WordPress

Error Ketika Share Gambar dan Link di Facebook? Atasi dengan Tool Facebook Debugger

Sharing konten website ke Facebook masih menjadi salah satu cara paling jitu untuk memaksimalkan situs Anda dan menggaet lebih banyak pengunjung. Hanya saja, di beberapa kasus, Facebook tidak menampilkan gambar yang benar untuk artikel Anda. Tentu ini menjadi masalah tersendiri bagi Anda. Namun jangan khawatir, masalah atau error seperti ini bisa dengan mudah diatasi jika Anda tahu cara menggunakan tool Facebook Debugger.

Ada dua cara yang dapat dilakukan:

  1. Bersihkan cache WordPress.
  2. Force Facebook untuk reload tag open graph.

Di tutorial ini, kami akan membahas tentang Facebook Debugger dan cara kerjanya. Selain itu, kami juga akan menjelaskan mengapa kadang-kadang Facebook melakukan kesalahan saat menampilkan gambar dari konten Anda serta menjabarkan cara mengatasinya.

Tampilan Gambar dan Link WordPress di Facebook (Dan Penyebab Facebook Melakukan Kesalahan Dalam Menampilkannya)

Ketika membagikan konten di Facebook, platform tersebut mencoba untuk ‘memanggil’ informasi terkait yang spesifik sehingga dapat dengan benar menampilkan konten dimaksud. Facebook menggunakan elemen yang disebut ‘open graph meta tags’, atau yang juga dikenal dengan nama ‘og tags’.

Open Graph beserta tag-nya dikembangkan oleh Facebook pada tahun 2010. Fungsinya adalah untuk membantu para creator mengontrol dan mengelola platform ketika hendak menampilkan link yang terhubung ke halaman situs mereka. Singkatnya, tag ini memampukan Anda untuk memilih judul, deskripsi, dan gambar yang sebaiknya ditampilkan pada saat Anda share link dari WordPress ke Facebook:

Contoh link WordPress yang ditampilkan di Facebook.

Sejak og tags diperkenalkan, platform media sosial lainnya juga memanfaatkan kesempatan ini, seperti Twitter, LinkedIn, dan Google+. Bisa dilihat bagaimana tag ini begitu penting untuk diketahui dan digunakan.

Masalah akan terjadi jika platform media sosial tidak bisa mengambil informasi yang dibutuhkan dari konten Anda. Misalnya, ada kalanya Facebook menampilkan gambar fitur yang salah ketika Anda membagikan post dari WordPress.

Tentunya error ini akan memberikan dampak negatif terhadap rate klik menuju konten Anda. Ingatlah, media sosial merupakan source yang sangat baik dan tepat jika Anda ingin meningkatkan traffic. Oleh karena itu, pastikan gambar konten yang ditampilkan di Facebook atau platform lainnya adalah benar dan sesuai dengan konten situs asli.

Untungnya, penggunaan og tags tidak begitu sulit. Anda hanya harus memasukkan tag tersebut ke halaman HTML. Berikut tampilannya:

<!-- Open Graph data -->
 <meta property="og:locale" content="en_US" />
 <meta property="og:type" content="article" />
 <meta property="og:title" content="How to Disable Comments on WordPress" />
 <meta property="og:description" content="Learn two easy ways to disable comments on WordPress by following this tutorial. The guide covers how to do it using inbuilt WordPress dashboard tools or via plugins. You&#039;ll also learn to disable or remove WordPress comments on individual posts, pages, and other neat tricks!" />
 <meta property="og:url" content="https://www.hostinger.com/tutorials/wordpress/how-to-disable-wordpress-comments" />
 <meta property="og:site_name" content="Hostinger Tutorials" />
 <meta property="article:tag" content="disable comments wordpress" />
 <meta property="article:section" content="WordPress Tutorial" />
 <meta property="article:published_time" content="2018-04-18T15:49:30+00:00" />
 <meta property="article:modified_time" content="2018-04-25T12:28:53+00:00" />
 <meta property="og:updated_time" content="2018-04-25T12:28:53+00:00" />
 <meta property="og:image" content="https://www.hostinger.com/tutorials/wp-content/uploads/sites/2/2018/04/wordpress-disable-comments.png" />
 <meta property="og:image:secure_url" content="https://www.hostinger.com/tutorials/wp-content/uploads/sites/2/2018/04/wordpress-disable-comments.png" />
 <meta property="og:image:width" content="900" />
 <meta property="og:image:height" content="560" />

Anda pasti bisa memahami sebagian besar tag yang disebut di atas. Anda hanya harus membuat judul, URL, meta description, dan gambar terkait.

Dengan adanya og tags, Anda dapat mengontrol setiap aspek terkait tampilan konten di Facebook. Anda bahkan bisa melakukan berbagai tes A/B untuk mengecek mana yang memiliki performa lebih baik, dan menggunakan informasi tersebut untuk mengoptimalkan rate click. Tentu saja, kelebihan-kelebihan di atas bisa digunakan jika platform menampilkan konten Anda tanpa kesalahan. Namun, apabila Facebook tidak menampilkan gambar dengan benar, maka Anda harus melakukan berbagai cara untuk mengatasi error tersebut. Di sinilah Facebook Debugger berperan.

Mengenal Tool Facebook Debugger

Facebook Open Graph Debugger membantu Anda menganalisis halaman untuk melihat apakah ada error yang bisa diatasi atau diperbaiki oleh og tags. Anda juga dapat menggunakan tool tersebut untuk melihat tampilan pratinjau ketika Anda share link di Facebook, seperti gambar di bawah ini.

Tool Facebook Debugger

Untuk menggunakan Facebook Debugger, Anda tidak perlu membuat akun khusus. Akan tetapi, Anda harus punya akun Facebook untuk dapat menjalankan tool tersebut.

Buka halaman website Facebook Debugger dan ketik atau masukkan link halaman yang ingin Anda analisis. Kemudian klik tombol Debug, dan tool Facebook debug akan menampilkan analisis penuh seperti yang Anda inginkan.

Anda terlebih dulu akan mendapatkan notifikasi yang menyatakan jika tool tersebut menemukan missing og tag:

Pesan Error Facebook Debugger OG

Di bawahnya, Anda akan melihat informasi tentang kapan terakhir kali Facebook diakses atau link yang dimasukkan ‘dibatalkan’. Bagian ini juga mencakup informasi tentang URL halaman kanonik, dan redirect lainnya yang ditemukan oleh Facebook:

Link Informasi di Tool Debugger

Anda pun akan melihat pratinjau penuh bagaimana Facebook menafisirkan URL pada saat Anda membagikannya di platform tersebut. Apabila terjadi error pada gambar fitur, misalya, maka Anda dapat melihatnya di sini:

Pratinjau Debugger Facebook

Jika Anda tidak ingin error tersebut sampai terjadi, Anda bisa mengeceknya terlebih dulu sebelum membagikan konten dengan Facebook URL debugger. Namun, cara ini tidak efisien. Sebaiknya, cari cara untuk mengoptimalkan konten og tag agar error tidak sampai terjadi.

Pada report, scroll sampai ke bawah untuk  melihat kerusakan semua og tag secara utuh di halaman yang telah Anda pilih untuk dianalisis:

Menganalisis og tag post Anda

Idealnya, judul, meta description, URL, dan gambar yang dilihat haruslah sama dengan yang telah diatur di WordPress. Jika tidak, maka Anda sebaiknya menggunakan dedicated tool untuk memastikan bahwa tag telah diatur dengan benar.

Cara Mengatasi Open Graph Tags yang Salah di Facebook

Apabila Facebook link debugger tidak menampilkan koten yang seharusnya di halaman WordPress, maka itu berarti ada kesalahan di og tag. Untuk mengatasinya, gunakan plugin yang memudahkan Anda setup og tag secara manual di setiap halaman.

Ada beberapa plugin yang memudahkan Anda untuk memilih elemen yang sebaiknya ditampilkan di Facebook, dan di saat bersamaan juga memungkinkan Anda untuk mengonfigurasi og tag. Plugin termudah yang bisa Anda gunakan sekarang juga adalah Open Graph for Facebook, Google+, dan Twitter (selanjutnya Facebook graph):

Plugin Open Graph

Agar plugin ini dapat diaktifkan dan digunakan, login ke dashboard WordPress dan buka tab Plugins. Setelah itu, klik Add New, dan gunakan search bar di halaman selanjutnya untuk mencari plugin ini. Carilah dengan mengetikkan nama lengkap plugin. Open Graph for Facebook akan berada di hasil pencarian paling atas. Klik tombol Install Now yang berada tepat di sebelah nama plugin tersebut:

Install plugin Open Graphs

Apabila plugin berhasil diinstall di WordPres, tombol biru Activate akan muncul persis di samping nama plugin tersebut. Klik tombol tersebut untuk mengaktifkan plugin. Setelah itu, widget baru akan muncul di bawah editor WordPress setiap kali Anda membuka page atau post:

Widget Open Graphs

Anda kini dapat mengatur og image dan description tag secara manual. Jika judul dan URL konten benar, maka plugin akan menganalisisnya secara manual.

Untuk mengatur gambar, klik tombol Upload/Choose yang ada di bawah kolom Use this image. Plugin ini merekomendasikan gambar yang seharusnya Anda gunakan berukuran 1200 x 630 px. Resolusi ini sangatlah optimal untuk Facebook.

Mengupload gambar untuk ditampilkan di Facebook.

 

Perlu diingat, jika Anda menampilkan gambar secara manual dengan widget ini, maka Anda juga harus memilih gambar fitur menggunakan opsi Featured Image. Anda daapt menggunakan gambar yang sama untuk keduanya, tapi tetap saja Anda harus menyelesaikan tiap task secara terpisah.

Setelah selesai mengatur gambar Facebook, tulis meta description untuk konten Anda. Meta description untuk Facebook dapat ditulis sampai 300 karakter, dibandingkan dengan jumlah karakter penulisan yang dibatasi untuk Google, yaitu 320. Meskipun berbeda dari segi limit karakter, kami tetap menyarankan Anda untuk membuat meta description bagi di Facebook maupun Google. Hal ini untuk memudahkan Anda nantinya.

Apabila Anda sudah selesai menggunakan plugin, maka langkah selanjutnya adalah menerbitkan atau mengupdate post atau halaman WordPress. Bagikan sekarang juga konten Anda ke Facebook. Platform tersebut kini tak lagi menampilkan pesan error terkait gambar fitur. Namun, jika Anda masih saja mendapatkan pesan error, maka lanjut ke langkah berikutnya.

Cara Menggunakan Facebook Graph untuk Memperbaiki Gambar dan Link WordPress (Dalam 2 Langkah)

Jika og tag website sudah dikonfigurasikan dengan mengadopsi langkah-langkah di atas, maka besar kemungkinan penyebab error tidak terletak dalam struktur web Anda. Bisa jadi yang mengakibatkan Facebook menampilkan gambar yang salah atau sama sekali tidak menampilkan gambar konten adalah cache plugin. Berikut cara mengatasinya.

Langkah 1: Bersihkan Cache WordPress

Alasan mengapa cache plugin banyak digunakan adalah karena plugin ini memampukan Anda meningkatkan performa website dengan menyimpan sebagian kontennya di browser visitor situs Anda. Masalahnya, Facebook terkadang ‘memanggil’ og tag dari konten yang di-cache, alih-alih dari versi yang telah diperbarui.

Misalnya, jika salinan cache dari salah satu halaman situs Anda tidak memuat og tag, maka Facebook tidak dapat menampilkan informasi secara benar. Kemungkinan lain adalah Anda sudah mengubah gambar fitur halaman, tapi Facebook tetap saja menampilka versi yang belum diperbarui atau outdated.

Cara termudah untuk mengatasi error ini adalah membersihkan cache WordPress. Ada banyak cara untuk melakukannya, tentu saja tergantung pada plugin yang digunakan. Jika ingin menggunakan W3 Total Cache, misalnya, maka silakan login ke dashboard dan pilih tab Performance > Dashboard. Lihat tombol bertuliskan empty all caches yang ada tepat di bagian atas:

Menghapus cache dengan W3 Total Cache.

Klik tombol tersebut, dan tunggu selama beberapa saat. Setelah itu, halaman akan loading kembali dan cache telah dibersihkan atau dihapus.

Langkah ini juga bisa Anda lakukan jika ingin menginstall plugin lain, seperti WP Super Cache. Buka tab Settings > WP Super Cache di dashboard, dan cari tombol Delete Cache:

Menghapus cache dengan WP Super Cache.

Plugin lain yang tak kalah populernya adalah WP Fastest Cache. Buka tab WP Fastest Cache dan cari Delete Cache. Anda akan melihat tombol berwarna biru cerah bertuliskan Delete Cache:

Menghapus cache dengan plugin WP Fastest Cache plugin.

Ketiga plugin di atas adalah plugin WordPress yang paling banyak digunakan. Jika Anda menggunakan tool yang berbeda, lihatlah cara install di panduan atau tutorial online resminya. Di situ Anda akan mendapatkan penjelasa lebih terkait cara membersihkan cache.

Langkah 2: Force Facebook untuk Reload Open Graph Tags

Langkah ini lebih mudah daripada langkah sebelumnya. Setelah cache dibersihkan, setup og tag untuk konten Anda. Kali ini Facebook dapat menyusun dan menampilkan link Anda dengan benar.

Hanya saja, Anda masih tetap harus ‘memberitahukan’ Facebook untuk mengecek halaman situs sekali lagi dan memperbarui informasi yang ada. Kembali ke tool Facebook Debugger dan ketikkan URL yang ingin Anda share di Facebook:

Mengecek halaman dengan Facebook URL debugger.

Pada layar, Anda akan melihat tampilan report yang sama seperti yang sudah kita bahas sebelumnya. Cari tombol bertuliskan Scrape Again, tepat di samping kolom Time Scraped:

Memberitahukan Facebook Debugger untuk memeriksa konten Anda sekali lagi

Klik tombol tersebut, dan Facebook akan mulai melihat dan menganalisis artikel Anda. Jika semuanya berjalan dengan baik, maka gambar pratinjau konten tidak akan menampilkan error.

Anda hanya harus set gambar dan meta description yang ingin ditampilkan di Facebook untuk masing-masing bagian dari konten. Jika terjadi error yang sama, cukup bersihkan cache Anda sekali lagi!

Kesimpulan

Saat membagikan konten di Facebook, Anda ingin tampilannya tidak bermasalah. Namun, apabila Facebook menampilkan gambar fitur yang salah terkait konten WordPress Anda, maka langkah-langkah di atas merupakan solusi yang sebaiknya diambil. Pertama-tama, gunakan plugin, seperti Open Graph for Facebook, Google+, dan Twitter Card Tags. Jika tak juga berhasil dengan plugin, Anda bisa mencoba menggunakan tool Facebook Debugger dan bersihkan cache.

Apakah ada pertanyaan terkait mengatasi error dengan Facebook Debugger? Jangan ragu untuk menuliskannya di kolom komentar di bawah ini!

Gabung bersama ratusan ribu pelanggan di seluruh dunia

dan dapatkan tutorial baru langsung di email Anda

Please wait...

Abone olduğunuz için teşekkürler!

Dapatkan harga hemat!

Web Hosting Gratis Domain mulai dari

Rp.10.275
/bln