Cara Mengatasi Thumbnail Share Facebook Yang Hilang
Share link ke Facebook memang seakan sudah jadi kebutuhan pokok para Blogger untuk menyebarluasakan hasil kreatifitasnya. Begitu juga dengan kamu, mungkin. Bukan tanpa alasan, kenapa mereka lebih memilih share link artikel di Facebook. Karena menurut website ilmu pengetahuan umum Indonesia menduduki peringkat 4 dengan jumlah pengguna Facebook terbanyak di Dunia. Oleh karena itu dengan kita menyebarkan link ke Facebook memberi kita peluang untuk mendapatkan banyak pengunjung di Blog yang kita miliki.
Hanya saja terkadang ketika kita sudah men-share link artikel kita ke Facebook, ternyata thumbnail atau tampilan sharenya kurang menarik. Misalnya seperti tidak muncul gambar, atau meskipun muncul gambarnya tidak full (berukuran kecil) dan terletak disamping artikel/meta tag dari artikel tersebut. Tentu sayang sekali kan? maka dari itu pada tutorial blog kali ini, saya akan berbagi trik cara mengatasi thumbnail share facebook yang hilang/berukuran kecil.
Langsung saja,
1. Langkah pertama, silahkan kamu login ke dashboard blogmu. Klik link berikut untuk masuk ke dashboard Blogger.com
2. Pada halaman dashboard blog, pilih menu "Tema" kemudian klik "Edit HTML" . Lihat keterangan pada gambar dibawah ini.
3. Tekan CTRL + F pada tampilan "Edit HTML" untuk memunculan kolom pencarian. Kemudian cari kode <head> pada template.
4. Salin kode dibawah ini, kemudian letakan dibawah kode <head>
<!-- [ Social Media meta tag ] -->
<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 expr:content='data:blog.blogspotFaviconUrl' 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 content='DESKRIPSI TAUTAN ALTERNATIF' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='KODE-APLIKASI' property='fb:app_id'/>
<meta content='KODE-ADMIN' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>
<div id='fb-root'/>6. Klik "Simpan Template"
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'KODE-APLIKASI',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
NB :
- DESKRIPSI TAUTAN ALTERNATIF : Silahkan diisi dengan keterangan blogmu. Deskripsi tersebut akan muncul ketika artikelmu tidak disertai meta tag.
- KODE-APLIKASI : Silahkan diisi dengan kode aplikasi facebookmu.
- KODE-ADMIN : Silahkan diisi dengan kode profil Facebook/Fanspage Facebookmu.
Selamat mencoba! Semoga tutorial ini bermanfaat. Jika kamu mengalami kesulitan silahkan tulis di kolom komentar.
Jagoan AdSense
Dapatkan $100 Pertamamu!