Pemasangan Meta tag ini sebenarnya bertujuan untuk menampilkan informasi situs blog yang ingin kita share pada laman Facebook. Jika blog kamu memasang Open Graph saat, maka setidaknya informasi situs yang kamu share akan tampil seperti gambar di bawah ini.
Dan sebaliknya, jika kamu tidak memasang open graph pada template blog kamu, maka akan terlihat seperti gambar di bawah ini.
Seperti yang saya katakan sebelumnya, tujuan pemasangan meta tag ini untuk meninjau atau menampilkan informasi seputar blog kita. Tujuannya agar calon pengunjung lebih tertarik mengklik situs kita. Maka dari itu dengan memasang Facebook Open Graph ini akan meningkatkan juga pengunjung blog kamu.
Bagi yang ingin memasang Meta tag ini, kali ini admin akan berbagi tutorial bagaimana cara pemasangan Facebook Open Graph di bawah ini.
Cara Memasang Meta Tag Facebook Open Graph
Sebelum memasang mari kita pahami terlebih dahulu penjelasan berikut ini.
Ada beberapa kode tag khusus pada open graph, setiap kode properti penting yang menjelaskan berbeda-beda fungsi seperti:
- og:title = Kode untuk menampilkan informasi judul artikel blog
- og:type = Kode untuk menampilkan informasi jenis artikel yang dishare
- og:description = Kode untuk menampilkan informasi deskripsi blog
- og:image = Kode untuk menampilkan gambar suatu artikel atau halaman di blog
- og:url = Kode untuk menyimpan Link atau URL dari artikel sebuah blog
- og:site = Kode untuk meletakan nama situs daru artikel yang dishare
Catatan:
Pada sebagian template blog yang tersebar di internet sekarang biasanya sudah terpasang meta tag ini. Jadi kamu tidak perlu memasang kode ini lagi.
Berikut cara pemasangan Kode Facebook Open Graph
1. Buka Blogger.
2. Pada Dashboard buka menu Template >> Edit HTML
3. Salin dan letakan kode berikut dibawah kode <head> atau diatas kode <b:skin>
<!-- [ META TAG FACEBOOK OPEN GRAPH ] -->
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType == "static_page"'>
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if></b:if></b:if></b:if>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<b:if cond='data:blog.pageType == "item"'>
<meta content='article' property='og:type'/>
<b:else/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='URLGAMBAR' property='og:image'/>
</b:if></b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='NOMORIDFBAPP' property='fb:app_id'/>
<meta content='NOMORIDFBADMIN' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<!---untuk lokasi di Indonesia -->
<meta content='id_ID' property='og:locale:alternate'/>
<!---untuk lokasi di Indonesia --><!---BONUS TWITTER SOSIAL META TAG--><meta content='summary' name='twitter:card'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='TWITTER' name='twitter:site'/>
<meta content='IDTWITTER' name='twitter:creator'/>
4. Simpan dan Test di situs Facebook Debugger untuk memastikan bahwa kode meta berjalan dengan baik. Untuk yang tidak tahu caranya bisa mengunjungi artikel berikut ini.
Baca Juga
Cara Mudah Memasang Meta Tag Keyword
Cara Membuat Multi Tab Widget di Sidebar Blog
Cara Memasang Meta Tag Deskripsi
Itulah cara memasang Meta Tag Facebook Open Graph. Bila kamu kurang paham bisa dengan memberikan komentar dibawah ini. Kunjungi terus SHARE TUTOR GAN untuk artikel berguna seputar tutorial yang bisa kamu terapkan sehari-hari. Terima kasih telah berkunjung.