Cara Membuat Komentar Facebook dan Blogger Berdampingan

Cara mudah membuat komentar facebook dan blogger berdampingan di blogspot. Facebook adalah salah satu jejaring social media yang cukup banyak penggunanya di dunia, di Indonesia saja penggunaya cukup banyak yang mendominasi pelajar, mahasiswa sampai pebisnis online. Maka dari itu kita sebagai seorang blogger juga harus memanfaatkan social media yang satu ini untuk menarik pengunjung dan memudahkan mereka untuk berkomentar di blog kita.

Pada kesempatan ini saya akan membagikan tips bagaimana cara membuat komentar facebook dan blogger berdampingan di blog kita, yang saya maksut seperti gambar dibawah ini.

Jika anda tertarik untuk membuatnya maka lanjutkan saja kita bahas ke tahap selanjutnya.

1. Silahkan masuk ke blogger anda.
2. Masuk ke dosbar lalu pilih laman template dan masuk ke template editor blogger anda.



3. Jika sudah berada didalam template editor blogger maka letakkan kode dibawah ini tepat diatas kode ]]></b:skin> gunakan Contl+F untuk mempermudah pencarian.

.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;}
Ket : Warna biru adalah kode warna background transparan kedua komentar

4. Selanjutnya letakkan kode dibawah ini tepat diatas kode </head> 

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/> <script src='http://code.jquery.com/jquery-latest.js'/> <meta content='ID FACEBOOK' 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>
Ket : Warna biru adalah ID facebook anda Contoh https://www.facebook.com/newbie.tora

5. Selanjutnya letakkan kode dibawah tepat dibawah kode <div class='comments' id='comments'> biasanya ada dua bahkan lebih maka letakkan di bagian kedua.

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' 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(&quot;#blogger-comments&quot;);' 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 == &quot;item&quot;'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='5' width='500'/></b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
Ket :

  • Warna merah adalah jumlah komentar yang ditampilkan.
  • Warna biru adalah lebar komentar facebook.
  • Warna orange jika dibagian bawahnya sama maka hapus saja.
6. Jika sudah selesai maka simpan dan lihat hasilnya.

Sekarang komentar facebook dan blogger pasti sudah berdampingan di blog sobat. Namun jika ada yang tidak berhasil maka ulangi saja dengan baik tahap-tahap diatas, biasanya pada poin nomor 5 diatas jika ada banyak kode yang sama bisa anda coba satu persatu dimulai dari kode yang nomor 2.

Sekian pembahasan kita mengenai komentar facebook dan blogger berdampingan, semoga artikel yang sederhana ini bermanfaat untuk kita semua.

Sekian dan salam jabat tangan.

Subscribe to receive free email updates: