Selasa, 07 Februari 2012

Cara Membuat Komentar Facebook Dan Blog Berdampingan

Cara Membuat Komentar Facebook Dan Blog Berdampingan- pada postingan kali ini saya Ulas Mengenai kotak komentar blog dan facebook. kotak komentar ini berdampingan tapi tidak terbuka dua duannya, hanya yang dipilih oleh yang melihat, untuk demonnya bisa lihat kotak komentar paling bawah postingan ini.

Ok Langsung Ke tutorial aja, saya rasa sudah paha semua maksut dari Cara Membuat Komentar Facebook Dan Blog Berdampingan.

Login Dulu Blog masing Masing, Kalau sudah Pergilah ke Rancangan Lalu Edit HTML dan centanglah dulu Expand Template Widget
Download Template Lengkap Untuk Menjaga Kesalahan.

Ctrl + F pada Keyboard anda, Lalu cari code Berikut :
<div class='comments' id='comments'>
Copy dan Paste code dibawah ini Tepat dibawahnya

kode:
<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 num_posts='2' width='400'/>
angka 2 gunannya brapa banyak jumlah komentar fb yang kita tampilkan dan 400 lebar ukuran kotak komentar fb nya

Lanjut ..

cari Code </head>
Taruh kode Berikut Tepat di Atasnya


kode:
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1&appId=267556556622508'/>
<script src='http://filejs-irwan.googlecode.com/files/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>


Keterangan <meta content='ID FB Sobat disini' property='fb:admins'/> ganti dengan ID atau user facebook anda, misalkan id defalut 100000022074083 berarti saya ganti dengan
100000022074083. untuk ID defalut saya
CONTOH :
<meta content='100000022074083' property='fb:admins'/>

Lanjut .....

Taruk kode di bawah ini di atas ]]></b:skin>

kode:
.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;}



kemudian simpan.
selesai .. semoga berguna ..

JANGAN LUPA COMENT

Tidak ada komentar:

Posting Komentar