{"id":9554,"date":"2018-08-06T14:27:43","date_gmt":"2018-08-06T14:27:43","guid":{"rendered":"https:\/\/www.rumahweb.com\/journal\/?p=9554"},"modified":"2022-04-06T16:27:41","modified_gmt":"2022-04-06T09:27:41","slug":"setting-open-graph-pada-wordpress","status":"publish","type":"post","link":"https:\/\/www.rumahweb.com\/journal\/setting-open-graph-pada-wordpress\/","title":{"rendered":"Setting Open Graph Pada WordPress"},"content":{"rendered":"\n

Hampir setiap hari, kami mendapatkan pertanyaan “Kenapa gambar pada website tidak muncul ketika di share ke Facebook atau WhatsApp ya?”. Kebanyakan dari pertanyaan tersebut terjadi, karena lupa melakukan setting open graph. Karenanya pada panduan ini, kami akan berbagi cara untuk setting Open Graph pada WordPress.<\/p>\n\n\n\n\n\n

Tidak munculnya gambar pada saat share ke social media, biasanya disebabkan karena properly open graph image tidak terbaca atau tidak ditemukan. Karenanya, platform social media tidak bisa menampilkan gambar postingan Anda. Solusinya, Anda bisa menambahkan plugin atau script yang dapat digunakan untuk menampilkan meta data tersebut.<\/p>\n\n\n\n

Namun sebelum membahas setting Open Graph di WordPress, kami akan menjelaskan terlebih dahulu apa itu Open Graph dan bagaimana cara pengujiannya.<\/p>\n\n\n\n

Apa itu Open Graph<\/h2>\n\n\n\n

Open Graph adalah salah satu meta data dari Facebook yang berfungsi untuk berbagi informasi halaman website di Facebook. Jika anda menambahkan tag meta Open graph atau og:image, maka Facebook akan menampilkan pratinjau dengan gambar dan kutipan saat tautan situs anda dibagikan.<\/p>\n\n\n\n

Facebook telah menyediakan tools debug yang berfungsi untuk menganalisa, apakah meta data pada suatu halaman atau website sudah sesuai atau belum. Anda bisa mengakses link berikut : Facebook debugger<\/a>.<\/p>\n\n\n\n

Cara penggunaannya, silahkan anda akses halaman Facebook debugger. Setelah itu isikan alamat website atau URL yang ingin anda cek.<\/p>\n\n\n\n

\"halaman<\/a><\/figure>\n\n\n\n

Setelah itu, klik tombol Debug dan tunggu hingga Facebook selesai melakukan debugging. Hasil akan muncul seperti contoh berikut : <\/p>\n\n\n\n

\"Hasil<\/a><\/figure>\n\n\n\n

Jika hasil debug pada artikel atau website anda gambar tidak muncul disebabkan karena missing property og:image, maka anda bisa melakukan setting open graph disisi websitenya.<\/p>\n\n\n\n

Setting Open Graph WordPress<\/h2>\n\n\n\n

Untuk CMS WordPress, berikut beberapa cara yang bisa Anda lakukan untuk menambahkan open graph di website<\/strong> :<\/p>\n\n\n\n

  1. Anda bisa menginstall plugin<\/em> Open Graph and Twitter Card Tags yang bisa Anda download melalui link berikut : Klik disini<\/a><\/li>
  2. Untuk instalasi plugin tersebut, Anda bisa login ke dashboard > klik menu Plugins > Add New > cari “Open Graph and Twitter Card Tags”.<\/li><\/ol>\n\n\n\n
    \"install<\/a><\/figure><\/div>\n\n\n\n

    Referensi cara install plugin bisa Anda pelajari pada link berikut : Cara Install Plugin WordPress<\/a><\/p>\n\n\n\n

    1. Setelah plugin aktif, Anda bisa melakukan konfigurasi og:image melalui klik tombol setting pluginnya :<\/li><\/ol>\n\n\n\n
      \"setting<\/a><\/figure><\/div>\n\n\n\n
      1. Langkah terakhir, Anda bisa sesuaikan konfigurasi open graph image seperti digambar. Untuk default gambar, kami sarankan diisi dan sesuaikan dengan gambar yang Anda inginkan. Kami sarankan default gambar sebagai og:image berukuran 1200px x 630px.<\/li><\/ol>\n\n\n\n
        \"default<\/a><\/figure>\n\n\n\n

        Penting untuk dipahami<\/p>

        Sebelum melakukan posting artikel, pastikan Anda telah mengupload gambar utama pada menu ‘feature image’ atau ‘gambar unggulan’. Ukuran gambar yang direkomendasikan adalah 630x315px atau 1200x630px. <\/p><\/blockquote>\n\n\n\n

        Setelah setting open graph pada website anda selesai dilakukan, silahkan dicoba kembali untuk melakukan test di halaman Facebook Debugger. Anda bisa klik tombol “kurangi lagi<\/strong>” agar Facebook debugger dapat melakukan generate ulang perubahan pada website anda. <\/p>\n\n\n\n

        Apabila hasil pratinjau di Facebook debugger gambar dan deskripsi singkat halaman tersebut telah tampil, anda bisa share artikel tersebut di halaman Facebook. Namun untuk WhatsApp, biasanya tidak akan langsung tampil. Perlu waktu hingga engine WhatsApp mampu mengenali open graph yang anda setting.<\/p>\n\n\n\n

        Demikian panduan setting open graph pada WordPress dari Rumahweb, semoga bermanfaat.<\/p>\n","protected":false},"excerpt":{"rendered":"

        Hampir setiap hari, kami mendapatkan pertanyaan “Kenapa gambar pada website tidak muncul ketika di share ke Facebook atau WhatsApp ya?”. Kebanyakan dari pertanyaan tersebut terjadi, karena lupa melakukan setting open graph. Karenanya pada panduan ini, kami akan berbagi cara untuk setting Open Graph pada WordPress. Tidak munculnya gambar pada saat share ke social media, biasanya […]<\/p>\n","protected":false},"author":329,"featured_media":9560,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[463],"tags":[705,706,19,14],"class_list":{"0":"post-9554","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-wordpress","8":"tag-og-image","9":"tag-open-graph","10":"tag-plugin","11":"tag-wordpress"},"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/9554","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/users\/329"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/comments?post=9554"}],"version-history":[{"count":0,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/9554\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media\/9560"}],"wp:attachment":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media?parent=9554"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/categories?post=9554"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/tags?post=9554"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}