BloggerTutorial

Cara Mudah Memasang Komentar Facebook di Blog

Untuk cara memasang kotak komentar Facebook di blog ini cukup mudah. Tujuannya adalah agar blog Anda lebih terkonek dengan Facebook sehingga setiap ada orang yang berkomentar di blog anda, secara tidak langsung dia sudah melakukan sharing artikel yang ia komentari ke wall facebook yang bersangkutan. Berikut Langkah mudahnya, hanya 3 langkah saja…

  1. Miliki lebih dulu ‘ID FACEBOOK’ caranya, ketik: https://graph.facebook.com/usernameAnda – maka akan muncul ID Facebook yang berupa angka-angka tertentu.
  2. Berikutnya, Masuk ke akun blogger.
    Pilih  menu template –> Edit HTML.
    Cari kode (CTRL+F) ini  <div class=’comments’ id=’comments’>
    kemudian letakkan kode di bawah ini tepat dibawah kode <div class=’comments’ id=’comments’>

<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=’400’/>
</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=’ID FACEBOOK KAMU‘ 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>

3. Silahkan cari dan ubah kata “ID FACEBOOK KAMU” dengan ID facebook yang sudah dibuat seperti pada langkah pertama tadi. Dan lihat hasilnya, berikut contoh hasil di blog saya;

Workshop Toko Online

Pendapat atau Pertanyaan Anda?

comments

Baca Juga:  Cara Membuat Layout Buku Dengan Adobe InDesign
Tags

Musthafa Kamal

Seorang manusia fakir ilmu yang selalu berusaha belajar dan menjadi lebih baik agar bisa berbuat sebanyak-banyaknya untuk orang banyak. Menyukai dunia Desain Grafis, Blogging, Traveling, Online Marketing, Diet, Bisnis dan Ekonomi Islam

Related Articles

Leave a Reply

Your email address will not be published. Required fields are marked *

Close

Adblock Detected

Please consider supporting us by disabling your ad blocker