Daftar Isi
Apa Itu Open Graph?
Open Graph adalah teknologi yang pertama kali diperkenalkan oleh Facebook pada tahun 2010 yang memungkinkan integrasi antara Facebook dan data penggunanya dengan situs web. Dengan memasang meta tag Open Graph ke sebuah konten postingan, Anda dapat mengidentifikasi elemen halaman mana yang ingin ditampilkan ketika seseorang membagikan postingan blog Anda.Penjabaran Properti Meta Tag Open Graph
Di bawah ini adalah daftar properti dari meta tag Open Graph yang bisa Anda digunakan. Saya telah membuat daftar masing-masing berdasarkan tingkat kepentingannya. Juga, perlu dicatat bahwa tidak semua tag ini diperlukan, tetapi bisa saja membantu mengidentifikasi bagian-bagian halaman Anda dengan benar.- og:title. Merupakan judul postingan yang akan ditampilkan.
- og:image. Merupakan thumbnail postingan yang akan ditampilkan.
- og:description. Adalah deskripsi postingan Anda
- og:type. Jenis objek atau halaman yang Anda buat. Beberapa jenis yang dapat digunakan adalah article, music.album, video.movie, dan website.
- og:url. URL kanonis dari suatu objek atau halaman.
- og:locale. Lokasi informasi. Secara default, nilainya adalah en_US.
Preview Postingan yang Memasang Open Graph
Di bawah ini adalah contoh tampilan meta tag Open Graph yang muncul di Facebook. Jika Anda sudah paham mengenai meta tag HTML, Anda akan segera melihat bahwa satu-satunya perbedaan nyata antara meta tag biasa dan meta tag Open Graph adalah atribut properti yang tersedia.
Cara Memasang Open Graph
Seperti biasanya jika ingin mengedit template, Anda masuk dulu ke dasbor Blogger kemudian pilih "Tema" dan klik tombol "Edit HTML". Sebelum<html b:css='false' b:defaultwidgetversion='2' b:layoutsVersion='3' b:responsive='true' b:templateVersion='2.5' expr:dir='data:blog.languageDirection' lang='id' xml:lang='id' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:og='http://ogp.me/ns#'>Setelah menambahkan XML namespace, silakan mulai memasang meta tag Open Graph yang ada di bawah ini. Pasang meta tag Open Graph-nya sebelum
<meta expr: content = 'data: blog.pageName' property = 'og: title' />
<b: if cond = 'data: blog.postImageThumbnailUrl'>
<meta expr: content = 'data: blog.postImageThumbnailUrl' property = 'og: image' />
</ b: if>
<meta expr: content = 'data: blog.title' property = 'og: title' />
<meta expr: content = 'data: blog.canonicalUrl' property = 'og: url' />
<b: if cond = 'data: blog.metaDescription'>
<meta expr: content = 'data: blog.metaDescription' property = 'og: description' />
</ b: if>Ini akan menghasilkan meta tag Open Graph untuk judul, deskripsi, URL, dan gambar (jika ada di posting). Apabila masih ada meta tag Open Graph yang ingin Anda tambahkan, silakan kunjungi halaman Open Graph Protocol untuk informasi lebih lanjut.
1 komentar
Media Surabaya