Tuesday, August 19, 2014

Cara Terbaru Membuat Kotak Komentar Facebook Di Bloger

Cara Terbaru Membuat Kotak Komentar Facebook Di Bloger

Selain kotak komentar bawaan blogger anda juga bisa menambahkan kotak komentar facebook yang langsung terkoneksi dengan akun facebook anda 
Keistimewaan kotak komentar ini adalah bila ada yang komentar maka otomatis komentar tersebut juga muncul di dinding facebooknya..nah ini adalah keuntungan tersendiri untuk anda karena ini membantu anda untuk berpromosi blog gratis di media sosial..

Perhatikan gambar dibawah ini

http://bout-internet.blogspot.com/
Bagaimana anda minat untuk membuatnya di blog anda...???

Kalau berminat silahkan ikuti langkah-langkah membuat kotak komentar facebook di blogger seperti  dibawah ini

1.Silahkan anda login di Facebook anda
2.Login ke dasbord blogger anda
3. Klik template lalu pilh menu edit html
4.Cari kode ]]></b:skin>

Dan masukkan kode dibawah ini tepat diatas kode tersebut

.comments-page { background-color: #00BFFF;} 
#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;}

4. Cari kode </head>

Masukkan kode script dibawah ini tepat diatas kode diatas

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

5. Cari kode
 
<div class='comments' id='comments'> 

Letakkan kode berikut ini tepat dibawah kode tersebut 

<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'/>
    <div style='color:#fff; background-color:#3B5998;border: solid 1px #ddd; font-size:10px; padding:3px; width:588px;'>Facebook Comments by 
<b><a href='http://bout-internet.blogspot.com/' style='text-decoration:underline; color:#fff;' target='_blank' title='Blogger Widgets'>Media Blogger</a></b>
</div>
    </b:if>
    </div>
    <div class='comments comments-page' id='blogger-comments-page'>

5. langkah terakhir adalah save template

Ada baiknya sebelum anda menerapkan cara ini anda mencoba berkomentar diblog ini sebagai uji coba lalu coba cek dinding facebook anda

Catatan : Untuk mempermudah pencarian masing- masing kode diasta silahkan gunakan ctrl+F agar cepat ketemu masing-masing kode tersebut

Nah demikian Cara Terbaru Membuat Kotak Komentar Facebook Di Blogger semoga bermanfaat untuk anda

No comments:

Post a Comment