Cara Memasang Kotak Komentar FB Di Samping Kotak Komentar Blog

Apa kabar sobat pembaca semuanya, pastinya sehat maximal kan, kali ini dunia blogger akan memberikan informasi mengenai cara membuat kotak komentar antara blog dan FB berdampingan... siapa tau informasi ini menjadi salah satu yang sobat butuhkan.

Sebagaimana kita ketahui, saat ini banyak sekali yang mempromosikan sebuah blog ke media sosial, baik itu melalui twitter, goggle plus, Facebook, instagram dan masih banyak lagi, karna sarana yang paling mudah bagi kita  untuk mengenlkan blog kita yaa dengan meng sharenya ke media sosial salah satunya yang paling banyak saya jumpai adalah facebook /FB.

Pemasangan kotak komentar Facebook dalam sebuah blog akan memudahkan pembaca yang masuk ke blog kita melalui tautan dalam facebook untuk memberikan komentarnya. Oleh sebab itu peranan kotak komentar facebook menurut saya memiliki peranan penting juga.

Yaap... langsung saja ke cara pemasangannya:

1.    Silahkan sobat masuk ke template >> Edit HTML

2.   Kemudian masukkan kode di bawa tepat dibawah ]]></b:skin> 

    (agar mempermudah pencarian kodenya sobat bisa gunakan ctrl + F)

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

3.   Kemudian sobat cari kode </head> dan masukkan kode di bawah ini di atas kode </head> tersebut.

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/> <script src='http://code.jquery.com/jquery-latest.js'/> <meta content='Dunia-Blogger-602583239947284' 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>

Jangan lupa yang berwarna merah, di ganti sesuai ID Fanspage sobat yaaa !!

4.   Selanjutnya Silahkan sobat cari kode <div class='comments' id='comments'>

Umum nya code tersebut terdapat 2 code,letakan Code dibawah tepat dibawah 2 code tersebut <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='https://lh3.googleusercontent.com/-6jv8aChvBf8/V1vBCWMlZ3I/AAAAAAAAAv0/uv7yMTML3RwIZPP4Q3ZlYIs4Sw7VdfZuQCCo/s128/Logo-Facebook.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='10' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>

Angka 10 adalah jumlah komentar yang muncul dan 400 adalah lebar kotak pada komentar, silahkan sobat ganti sesuai keinginan.

Kemudian save dan liat blog sobat masing-masing.

Semoga informasi tentang pemasangan kotak komentar FB di blog ini bermanfaat bagi sobat pembaca, jika ada yang belum jelas silahkan masukkan komentar sobat. Terima kasih !!!

Posted by Unknown

Tweet