/ / / Cara Memasang Kotak Komentar Blogger, Facebook dan Twitter di blog dalam satu kotak (berdampingan) (3 in 1)

Cara Memasang Kotak Komentar Blogger, Facebook dan Twitter di blog dalam satu kotak (berdampingan) (3 in 1)

May 09, 2013 ,

Welcome to Mata Air Ilmu | Center of Excellence

Cara Memasang Kotak Komentar Blogger, Facebook dan Twitter di blog dalam satu kotak (berdampingan) (3 in 1)
by
  Rio Anderta

Cara Memasang Kotak Komentar Blogger, Facebook dan Twitter di blog dalam satu kotak (berdampingan) (3 in 1)
السلام عليكم ورحمة الله وبركاته
بسم الله الرحمن الرحيم

 

Terima kasih buat sobat semua yang telah berkunjung pada blog yang sederhana ini, kali ini saya menulis artikel yang berjudul Cara Memasang Kotak Komentar Blogger, Facebook dan Twitter di blog dalam satu kotak (berdampingan) (3 in 1). Kotak Komentar Facebook, Twitter dan Blogger menyatu. Facebook dan twitter adalah jejaring sosial yang amat di minati masyarakat dunia, akan saat bermanfaat sekali jika sekirannya komentar blog kita juga bisa buat pengguna facebook dan twitter, ini sangat membantu dalam kemajuan blog kita.  Dan tentunya tampilan blog kita lebih menarik.
Untuk mengaktifkan fitur ini, sebelumnya kita harus mempunyai API KEY yang bisa didapatkan setelah membuat applikasi twitter. , masuk ke akun twitter lalu buat aplikasi baru di sini (Mudah, hanya tinggal ikuti langkah"nya). Sedangkan untuk mengaktifkan fitur komentar facebook, kita tidak harus mempunyai APP ID. Walaupun begitu, supaya kita bisa memoderasi komentar dan mendapatkan pemberitahuan setiap ada komentar baru, kita harus memiliki APP ID yang bisa didapatkan setelah kita membuat aplikasi facebook di sini (Mudah, hanya tinggal ikuti langkah"nya). Tutorial Pemasangan:
  1. Masuk ke akun blogger, lalu pilih Rancangan > Edit HTML > Ceklis 'Expand Template Widget'
  2. Tekan tombol Ctrl+F lalu cari kode <head>
  3. Masukkan kode berikut tepat di bawah kode <head>:
<meta content='Profile_ID' property='fb:admins'/> 
<meta content='APP_ID' property='fb:app_id'/>
<script src='http://code.jquery.com/jquery-latest.pack.js'/>
<script src='http://jsblogstop.googlecode.com/svn/commentpages/jsCommentPages.js'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://jsblogstop.googlecode.com/svn/jstweetbox/v1/jsTweetBox.js'/>
<script src='http://platform.twitter.com/anywhere.js?id=API_KEY&amp;v=1'/>
4. Perhatikan kode berwarna merah:

  • Ganti tulisan Profile_ID dengan ID profil atau username facebook kita. ID profil bisa berupa angka atau huruf. Cara mengetahui ID profil kita adalah dengan membuka halaman profil dan lihatlah kolom alamat (address bar). Jika alamat profil Paman adalah www.facebook.com/RioAnderta, maka ID profil  adalah RioAnderta
  • Ganti tulisan App_ID dengan ID Aplikasi facebook kita
  • Ganti tulisan API_KEY dengan API KEY dari aplikasi twitter yang kita buat
5. Berikutnya, cari kode class='comments'
     Catatan>>> class='comments' <<< kode ini biasanya ada dua 

6. Masukkan kode berikut tepat di bawah kode class='comments' 
   
<div class='comments-tab' id='blogger-comments' title='Comments from Blogger'>
<data:post.numComments/> Comments
</div>
<div class='comments-tab' id='twitter-comments' title='Comments with Twitter'>
<span class='js-page-tweet-count' expr:href='data:post.url'/> Tweets
</div>
<div class='js-default-tab comments-tab' id='fb-comments' title='Comments made on Facebook'>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='clear'/>
</div>
<div class='comments-page' id='twitter-comments-page'>
<div id='js-tweet-box'/>
</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'>
7. Perhatikan kode berwarna merah:
  • Kita bisa mengganti kata Comments dan Tweets dengan kata lainnya yang diinginkan
  • Kita bisa mengganti angka 10 dengan jumlah komentar facebook yang ingin ditampilkan
  • Kita bisa mengganti angka 400 dengan ukuran lebar kotak komentar yang diinginkan
8. save template sobat, selesai
9. Selamat mencoba, semoga berhasil, semoga bermanfaat...!

Sumber Bacaan: secebisilmu.blogspot.com, Copast-master.blogspot.com

Thanks You For Visiting | Jangan Lupa Comment ya....!
Share on Google Plus

About Unknown

Satrio Utama Nopenri (Rio Anderta)
Kontak:
FB: https://www.facebook.com/RioAnderta
Twitter: @Anderta
Instagram: rioanderta
Email: rioanderta90@gmail.com

13 comments:

  1. AnonymousMay 26, 2013 at 7:49 AM

    Sangat bermanfaat gan, kunjungan balik ya ..

    ReplyDelete
  2. UnknownJune 3, 2013 at 3:46 PM

    @Bandi Shippuden,,, Trima kasih gan,, Ok Gan ^_^

    ReplyDelete
  3. UnknownJune 29, 2013 at 5:34 AM

    alhamdulillah saya akhirnya bisa terima kasih GLHF buat blognya

    ReplyDelete
  4. AnonymousJuly 5, 2013 at 10:12 AM

    ko komen twitter ga muncul ya gan ?
    coba liat sndiri di tangankreasi.blogspot.com

    thx, ane tunggu solusinya

    ReplyDelete
  5. Rame dan MeriahJuly 6, 2013 at 3:02 AM

    " terima kasih atas infonya Mas "

    ReplyDelete
  6. UnknownJuly 7, 2013 at 9:02 AM

    Bang Rio, kok di di blog ane ngga muncul kotaknya? Cuma tab blog, Twitter, sama facebook. Di klik pun ngga muncul kotaknya. kenapa ya?

    ReplyDelete
  7. FauziyahJuly 16, 2013 at 7:15 PM

    sukron

    ReplyDelete
  8. XsonAVI (FILM FORMAT AVI)July 19, 2013 at 6:15 PM

    thanks gan

    ReplyDelete
  9. UnknownAugust 15, 2013 at 11:26 PM

    mntp dech gan, slhkn knjungi http://mubaroxapps.blogspot.com

    ReplyDelete
  10. UnknownOctober 31, 2013 at 5:08 AM

    kok nggak bisa ya gan

    ReplyDelete
  11. UnknownDecember 4, 2013 at 1:55 AM

    hehe,, sorry agan",,,
    Q jg lg cari solusinya,, tp blm dapet,,
    :-D

    ReplyDelete

Subscribe to: Post Comments ( Atom )