Social media Facebook untuk support popularity website
Anda berminat memiliki komentar Facebook di setiap artikel blog Blogger? Anda hanya perlu memasukkan snippet code kotak komentar Facebook di area data:post.body (atau sekitarnya). Tidak sampai setengah jam kotak komentar social network milik Mark Zuckerberg akan ditampilkan tepat dibawah setiap posting. Dengan menyediakan ruang berkomentar di setiap halaman artikel blog, kita dapat meningkatkan popularitas posting dengan sangat cepat dan support SEO.Bagaimana penjelasannya?
Ketika visitor blog dalam status LOGIN ke Facebook dan membaca salah satu halaman posting, jika mereka berkomentar, maka secara otomatis posting tersebut langsung dalam status LIKE.
Hasilnya dapat dilihat di area komentar di bawah artikel ini, seperti terlihat pada gambar ini.
Bagaimana mendapatkannya?
Install Facebook Comments on each Post Page of website blog
- Login ke Blogger(dot)com dengan Gmail address Anda
- Buka Dashboard Blogger
- Pergi ke Template >>> Edit HTML >>> Expand Widget Templates.
- Tekan kombinasi tombol keyboard Ctrl – F untuk mencari kode ini.
<div class='comments' id='comments'>
- Letakkan snippet code dibawah ini tepat di bawahnya.
<div class='comments-tab' id='fb-comments'
onclick='javascript:commentToggle("#fb-comments");'
title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='550'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
- Tekan kombinasi tombol keyboard Ctrl – F untuk mencari kode ini : /* Comments atau #comments atau yang mirip diantara keduanya. Pada halaman HTML Editor blog, saya hanya menemukan baris seperti di bawah ini sebagai satu-satunya yang bisa saya temukan.
/* Comments----------------------------------------------- */
- Letakkan barisan kode CSS berikut tepat dibawahnya.
.comments-page { background-color: #f2f2f2;}
.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background: #f2f2f2;}
.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}
}
- Letakkan script code berikut tepat di atas </head>
CATATAN PENTING
Maafkan! Script diatas hanya image untuk mengurangi loading time dan memperbesar prosentase Text/HTML Ratio, karena ini sangat baik bagi SEO blog ini. Jika setiap script code harus saya ketik, akibatnya akan memperbanyak script dan menurunkan prosentase Text/HTML Ratio.
Script ASLI untuk langkah nomor 7 dapat Anda download dengan klik link :
Letter yusufzulkarnain pada script diatas harus diganti dengan ID Facebook Anda sendiri.
- SIMPAN template
- SELESAI.