Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Menciptakan Kotak Komentar Facebook Di Blog Terbaru

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai akun fb nya dengan mudah. Selain itu komentar tersebut juga sanggup di share oleh pengunjung di akun sosial media nya jadi dengan menambahkan kotak komentar ini dibawah postingan blogger, wordpress maupun website maka tidak menutup kemungkinan sanggup meingkatkan traffik situs teman apalagi dari facebook yang merupakan sosmed terpopuler yang mempunyai banyak pengguna di internet dan pastinya kalau blog memilik banyak komentar maka juga akan menciptakan blog tersebut menjadi lebih SEO.

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

Kali ini saya akan share gimana Cara Membuat Kotak Komentar Facebook Di Blog Terbaru, silahkan ikuti tutorial langkah langkah berikut lengkap beserta gambarnya buat teman yang ingin menambahkan kolom komentar fb dibawah post / artikel pada blogger.

Cara Memasang Kotak Komentar Facebook Di Blog Tanpa Fungsi Tab :

1. Bikin kotak komentar tanpa fungsi tab ibarat gambar di atas ialah dengan cara masuk sajian Template dan klik Edit HTML

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

2. Cari isyarat <body>, gunakan Ctrl+F untuk memudahkan pencarian

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

3. Kemudian copy isyarat berikut :

<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>


dan paste sempurna dibawah isyarat <body>

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

3. Lalu cari isyarat <div class='comments' id='comments'>, biasanya isyarat tersebut ada 2 di html namun teman sanggup cari yang pertama dari atas, gunakan Ctrl+F untuk mempermudah

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

4. Kemudian copy isyarat berikut :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='margin-top:20px'>
<div class='fb-comments' data-num-posts='5' data-width='600' expr:data-href='data:blog.url'/>
</div>
</b:if>


dan paste sempurna dibawah isyarat <div class='comments' id='comments'>, kalau sudah klik Simpan template.. Selesai dan lihat hasilnya

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

5. Jika cara diatas tidak berhasil, teman sanggup memakai cara yang satu ini ialah teman sanggup bikin dulu ID Aplikasi FB silahkan login Facebook kemudian buka situs https://developers.facebook.com/apps maka akan muncul tampilan berikut dan klik Register Now

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

6. Kemudian klik tombol disamping kanan menjadi angka 1, kalau sudah klik Mendaftar

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

 7. Selanjutnya eksklusif saja klik Selesai

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

8. Pada tampilan Add a New App pilih platform WWW

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

9. Kemudian masukkan Nama dan klik Create New Facebook App ID

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

 10. Setelah itu pada Kategori pilih Aplikasi untuk Halaman, kalau sudah klik Buat ID Aplikasi

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

11. Maka akan muncul tampilan berikut silahkan teman scroll ke bab bawah halaman

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

12. Pada kotak Site URL masukkan alamat blog teman kemudian klik Next

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

13. Kemudian scroll lagi kebawah sedikit dan klik Skip to Developer Dashboard

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

14. Maka akan muncul tampilan Dashboard Aplikasi FB dan teman pun sudah mendapat ID Aplikasi FB ibarat pada gambar dibawah ini

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

15. Selanjutnya silahkan masuk Edit HTML blog dan cari isyarat <head>

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

16. Kemudian copy isyarat berikut :

<meta property="fb:app_id" content="YOUR_APPLICATION_ID"/>

dan paste sempurna dibawah isyarat <head> ,ganti goresan pena warna biru dengan isyarat ID Aplikasi FB yang sudah teman buat tadi

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

17. Cari isyarat <div class='comments' id='comments'>, biasanya isyarat tersebut ada 2 cari yang pertama

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

18. Setelah itu copy isyarat berikut :

<b:if cond='data:post.isFirstPost'> <script>(function(d){ var js, id = &#39;facebook-jssdk&#39;; if (d.getElementById(id)) {return;} js = d.createElement(&#39;script&#39;); js.id = id; js.async = true; js.src = &quot;//connect.facebook.net/en_US/all.js#xfbml=1&quot;; d.getElementsByTagName(&#39;head&#39;)[0].appendChild(js); }(document));</script> </b:if> <a expr:href='data:post.url + &quot;#fb-root&quot;'><fb:comments-count expr:href='data:post.canonicalUrl'/> comments</a>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='fb-root'/> <script>(function(d){ var js, id = &#39;facebook-jssdk&#39;; if (d.getElementById(id)) {return;} js = d.createElement(&#39;script&#39;); js.id = id; js.async = true; js.src = &quot;//connect.facebook.net/en_US/all.js#xfbml=1&quot;; d.getElementsByTagName(&#39;head&#39;)[0].appendChild(js); }(document));</script> <div style='margin: 20px 0 0 0;'><fb:comments colorscheme='light' expr:href='data:post.canonicalUrl' expr:title='data:post.title' expr:xid='data:post.id' width='600'/></div> </b:if>

dan paste sempurna dibawah isyarat <div class='comments' id='comments'>, kalau sudah klik Simpan template.. Selesai dan lihat hasilnya

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

Cara Memasang Kotak Komentar Facebook di Blog dengan Fungsi Tab :

1. Silahkan ikuti langkah berikut kalau teman ingin menciptakan kotak komentar dengan fungsi tab semoga menghemat ruang blog ibarat gambar dibawah ini

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

2. Cari isyarat <div class='comments' id='comments'> sama ibarat langkah langkah sebelumnya

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

3. Kemudian copy isyarat berikut :

<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='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 Anda' 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>

dan paste sempurna dibawah isyarat <div class='comments' id='comments'> , ganti goresan pena warna biru dengan ID Fanspage sobat. (untuk melihat ID nya sanggup masuk ke fanspage teman - pengaturan - isu halaman kemudian lihat di paling bawah ada ID Halaman Facebook berupa angka) namun bagi teman yang tidak mempunyai halaman facebook (fanspage) biarkan saja isyarat tersebut tidak perlu dirubah, kalau sudah klik Simpan template.. Selesai dan lihat hasilnya

Kotak komentar facebook pada blog berfungsi semoga pengunjung sanggup berkomentar memakai  Cara Membuat Kotak Komentar Facebook Di Blog Terbaru

Nah itulah bagaimana menciptakan kotak komentar facebook dengan gampang dan cepat.

Silahkan dicoba

Posting Komentar untuk "Cara Menciptakan Kotak Komentar Facebook Di Blog Terbaru"