Monday, July 11, 2016

Cara Mudah Memasang Komentar Facebook di Blog

Facebook adalah salah satu sosial media yang paling banyak digunakan  diseluruh dunia untuk bisa terhubung dengan teman lama,atau untuk mencari teman baru dan juga bergabung dalam sebuah komunitas. Bukan hanya itu facebook juga bisa anda manfaatkan untuk meningkatkan traffic pada blog atau website  anda,dengan cara mempromosikan blog atau website.

Di kesempatan kali ini,saya akan membahas tentang cara menambahkan kolom komentar di blog anda dengan kolom komentar facebook. Tujuan memasang kolom komentar facebook adalah memudahkan pengunjung untuk memberikan komentar tanpa harus terhubung dengan akun gmail mereka. Jadi selama akun facebook pengunjung aktif,mereka bisa  membuat komentar.


Disini saya akan jelaskan tahap demi tahap tanpa harus menghapus kolom komentar bawaan blog. Otomatis di blog anda akan ada dua kolom komentar sekaligus.


Pasti anda juga pernah berkunjung disalah satu blog dimana di blog tersebut sudah tersedia kolom komentar facebook. Sebelum saya melanjutkan tutorial ini,ada baiknya jika template anda di back up terlebih dahulu misal dengan menyalin kode html template dan lalu anda bisa menyimpan nya di notepad agar jika tidak sesuai dengan keinginan anda,anda bisa lebih mudah kembali ke template sebelumnya.


(Baca Juga Cara Mudah Membuat Fans Page di Facebook)
Berikut Langkah Langkah nya.

1. Masuk ke akun blogger milik anda sendiri.

2. Di dashboard akun blogger,anda masuk ke opsi Template lalu pilih Edit Html.
3. Cari kode <div class='comments' id='comments'>.
Cara Mudah Memasang Komentar Facebook di Blog

4. Jika anda kesulitan menemukan kode diatas,anda bisa mengeklik CTRL + F dan kemudian paste kode diatas tepat di kolom pencarian. Langkah selanjutnya anda bisa lihat kode dibawah.

<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='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle("#blogger-comments");' title='Comments from Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> 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'>

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><script src='http://code.jquery.com/jquery-latest.js'/><meta content='IDFANSPAGEFACEBOOK' property='fb:admins'/><script type='text/javascript'>function commentToggle(selectTab) {$(".comments-tab").addClass("inactive-select-tab");$(selectTab).removeClass("inactive-select-tab");$(".comments-page").hide();$(selectTab + "-page").show();}</script>

<style>.comments-page { background-color: #f2f2f2;}#blogger-comments-page { padding: 0px 5px; display: none;}.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}.comments-tab:hover { background-color: #eeeeee;}.inactive-select-tab { background-color: #d1d1d1;}</style>
5. Copy semua kode di atas,lalu kemudian paste tepat di bawah kode <div class='comments' id='comments'>
Catatan:

Untuk cara melihat Id fans page,masuk ke akun facebook anda kemudian cari halaman yang sudah anda buat langkah selanjutnya anda pilih About atau Tentang,kemudian scroll atau geser ke bawah,dan anda akan melihat ID fans page anda.

 Ganti IDFANSPAGEFACEBOOK dengan id fanspage facebook anda.
Jika anda ingin menyesuaikan kolom komentar facebook,anda bisa ganti angka width='550'

Selesai,setelah itu anda bisa langsung simpan template. Jika sudah selesai maka selanjutnya anda bisa mengunjungi blog anda dan lihat di bawah postingan.



(Baca Juga Cara Mudah Membuat Contact Form di Blog)

Artikel Terkait

Cara Mudah Memasang Komentar Facebook di Blog
4/ 5
Oleh

Berlangganan

Suka dengan artikel di atas? Silakan berlangganan gratis via email

Comments
0 Comments