Sekumpulan Tulisan Tips dan Trik, Blog, Huruf Hiasan, Laptop, Komputer, dll
Unduh Adobe Flash player

Saturday, 10 August 2013

alam Blogger, Melengkapi permintaan salah satu sahabat Generation Multinet Computindo pada blog Trik dan Tips yang meminta saya menjelaskan tentang cara memasang komentar facebook dan blogger berdampingan. 

Pada menu Tata Letak / Rancangan klik Edit HTML
Cari kode ]]></b:skin> (gunakan ctrl + f untuk mempermudah pencarian)
Kalau sudah ketemu maka masukkan kode berikut ini di atas kode ]]></b:skin>

Klik show untuk melihat
.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;}

Hilangkan kode #f2f2f2 bila ingin background kedua komentar transparan.
Cara di atas ini yang biasanya mewajibkan penempatan kode di bawah kode /* Comment atau #comments, Sebenarnya sama saja, mungkin para master terdahulu menyarankan begitu agar tampak lebih rapi.

Kemudian Sobat cari kode </head>
Jika sudah ketemu, masukkan kode berikut ini tepat di atas kode </head>

Klik show untuk melihat
<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 Sobat disini' 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>

Perhatikan tulisan  'ID FB Sobat disini'   di atas pada baris ke tiga, ganti dengan ID facebook Sobat, misalkan https://www.facebook.com/nama Sobat. Namun jika Sobat belum merubah ID Sobat maka yang tertera adalah berupa angka. contohnya seperti ini: https://www.facebook.com/1234567890

Cara mencari ID FB silahkan ketik di navigator Bar :
http://graph.facebook.com/namafacebookanda?fields=name,id
ganti tulisan merah dengan nama facebook anda.

Kemudian cari kode <div class='comments' id='comments'> 
Klik show untuk melihat
<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'>
Keterangan: Pada umumnya kode tersebut ada 2, copy dan pastekan kode berikut ini di bawahkedua kode <div class='comments' id='comments'>.

NB: Pada penempatan kode yang ke dua Sobat hapus kode  <div class='comments comments-page' id='blogger-comments-page'> apabila kode di bawahnya sama.

Perhatikan angka yang berwarna biru dan hijau di atas, angka 2 merupakan jumlah komentar yang akan ditampilkan pada komentar facebook. Sedangkan angka 400 merupakan lebar kotak komentar facebook. Sobat dapat menyesuaikannya sesuka hati, tapi kalu boleh saya kasih saran, sesuaikanlah dengan lebar template Sobat agar kelihatan rapi.

Cara di atas yang biasanya menyarankan hanya menempatkan pada kode <div class='comments' id='comments'> yang kedua saja, saat saya coba pada template blog uji coba saya tidak berhasil, jadi harus menempatkan di bawah kedua kode tersebut.

Kemudian klik save atau simpan dan lihat hasilnya.

Hasan GMC

Penulis:

Judul Trik membuat Komentar FB berdampingan
Jika ingin membantu memperkenalkan kepada teman atau (copy-paste) artikel ini, sertakan link dibawah ini sebagai sumbernya :
21:24   Posted by Hasan GMC in , with 5 comments

5 comments:

  1. Makasih Gan,... ijin pasang di blog ane,... :-*

    ReplyDelete
  2. Ko trik ini ga dipasang di blog ini Sob ?,... malah blog ini pake trik lain buat kotak komentarnya, ada icon emosinya juga,... tips n triknya mana Sob ?

    ReplyDelete
    Replies
    1. Berdasarkan komentar Anda, untuk membuktikan bahwa code diatas berfungsi, kini saya pasangkan di blog ini.

      Delete
  3. @AnonymousIya baru sadar,... kalo mau triknya saya juga dapet dari temen,.. silahkan berkunjung ke http://koderator.blogspot.com/2012/04/cara-merubah-tampilan-komentar-blogger_15.html

    ReplyDelete

Mohon maaf apabila komentar Sobat tidak langsung saya tanggapi, dikarenakan saya tidak nongkrong terus di blog,....

Silahkan berkomentar dengan tidak membubuhkan link hidup karena akan dianggap spam.

Bookmark Us

Delicious Digg Facebook Favorites More Stumbleupon Twitter

Search

* /

Langganan Artikel

Enter your email address:

Delivered by FeedBurner

Cara membuatnya ada disini

Fans Pages