Selamat Datang di Y@Music

Saturday, December 7, 2013

Membuat Komentar Facebook Di Blogger - [Berdampingan] Dengan Mudah

Mungkin sobat sering menjumpai, blog blog dari blogger yang menggunakan fitur komentar dengan akun facebook,
Oke... kali ini buat kamu yang memiliki blog di blogger [Blogspot]
saya akan kasih bocoran bagaimana cara bikin komentar blog dengan akun facebook.

KOMENTAR FACEBOOK DI BLOGGER 


Cara Edit Template Blogger,
Membuat Komentar Facebook di Blog Yang Berdampingan.

Login ke akun Blogger anda
Edit Rancangan / Edit Template dan pilih HTML



1. Kemudian cari kode,
]]></b:skin>  (gunakan ctrl + f untuk mempermudah pencarian).
Jika sudah ketemu, masukan kode ini di ATAS kode ]]></b:skin>

.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;}


2. Kemudian Sobat cari kode </head>
Jika sudah ketemu, masukkan kode berikut ini tepat di atas 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='http://facebook.com/ilyasAndika' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(&quot;.comments-tab&quot;).addClass(&quot;inactive-select-tab&quot;);
$(selectTab).removeClass(&quot;inactive-select-tab&quot;);
$(&quot;.comments-page&quot;).hide();
$(selectTab + &quot;-page&quot;).show();}
</script>

3. Kemudian cari kode  <div class='comments' id='comments'>
Keterangan: Pada umumnya kode tersebut ada 2, copy dan pastekan kode berikut ini di bawah kedua kode <div class='comments' id='comments'> 

<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='20' width='450'/></b:if></div><div class='comments comments-page' id='blogger-comments-page'>

angka 20 merupakan jumlah komentar yang akan ditampilkan pada komentar facebook. Sedangkan angka 450 merupakan lebar kotak komentar facebook. Anda bisa sesuaikan dengan keinginan atau berdasarkan template blog.

4. Kemudian klik save template, dan lihat hasilnya.


Terimakasih semoga postingan ini bermanfaat.

0 comments:

Post a Comment

Note: Only a member of this blog may post a comment.

BitcoinTube