Kode HTML ini digunakan untuk mengatur tampilan link blog saat dibagikan ke Facebook. Dengan menambahkan kode ini, link artikel akan menampilkan gambar dan deskripsi yang lebih jelas.
Tanpa pengaturan ini, biasanya Facebook akan mengambil gambar atau teks secara acak. Hasilnya sering kurang sesuai dengan isi artikel.
Apa Itu Meta Tag Open Graph
Meta tag Open Graph adalah kode HTML yang membantu menentukan bagaimana tampilan halaman saat dibagikan ke media sosial. Kode ini memberi informasi seperti judul, deskripsi, dan gambar.
Dengan Open Graph, tampilan link menjadi lebih rapi dan sesuai dengan isi artikel.
Manfaat Penggunaan di Blogger
Kode ini membantu menampilkan gambar utama artikel secara otomatis saat dibagikan. Selain itu, deskripsi juga bisa tampil lebih jelas.
Hal ini membuat link lebih mudah dipahami oleh pembaca sebelum mereka membuka artikel.
Contoh Penerapan
Jika artikel memiliki gambar, maka gambar tersebut akan muncul sebagai thumbnail. Jika tidak ada, maka akan digunakan gambar default.
Judul dan deskripsi artikel juga akan ikut ditampilkan sesuai isi blog.
Kode HTML Open Graph
Berikut kode yang bisa langsung digunakan di Blogger:
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<meta content='URL-GAMBAR-DEFAULT' property='og:image'/>
</b:if>
<meta content='article' property='og:type'/>
Silakan ganti URL-GAMBAR-DEFAULT dengan link gambar cadangan sesuai kebutuhan.
Cara Memasang di Blogger
Masuk ke Blogger, lalu buka menu Tema dan pilih Edit HTML.
Cari bagian <head>, kemudian tempelkan kode di atas tepat di bawahnya.
Setelah itu, simpan template.
Tips Penggunaan
Gunakan gambar pada setiap artikel agar hasil share lebih baik.
Pastikan deskripsi artikel tidak kosong agar bisa tampil di Facebook.
Jika tampilan belum berubah, coba bersihkan cache menggunakan Facebook Debugger.
FAQ
Apakah kode ini aman digunakan? Ya, aman selama dipasang di dalam tag <head>.
Kenapa gambar tidak muncul? Biasanya karena cache, bukan karena kode.
Apakah wajib pakai gambar? Tidak wajib, tapi lebih baik digunakan.
Kesimpulan
Kode Open Graph membantu menampilkan gambar dan deskripsi saat artikel dibagikan ke Facebook. Cara pemasangannya juga cukup mudah dan tidak mengganggu template.
Dengan pengaturan ini, tampilan link menjadi lebih jelas dan rapi.