Tutorial yang satu ini, pasti sudah tidak asing lagi bagi para blogger sekalian. Hal semacam ini sudah banyak yang nangkring di beberapa blog. Tapi, apa salahnya berbagi informasi dengan para sobat sekalian. Kalau hanya untuk kotak komentar facebook juga sudah pernah saya bahas pada
artikel sebelumnya.
Nah, kali ini kita akan membahas yang berdampingan, sekedar contoh Anda bisa lihat gambar di bawah ini, yang saya ambil dari blog baru saya
DISINI.
Jelas kan?? Biar kalian tahu, tutorial macam ini sudah banyak di google, tapi rata-rata dari tutorial mereka tidak berhasil dari beberapa template yang biasa dan mungkin hanya pada template premium. Oleh sebab itu, disini saya akan mengulas sedikit
Cara Membuat Kotak Komentar Facebook dan Blog Berdampingan yang semoga berhasil pada template blog kalian. Aminn..
1. Masuk ke akun blogger sobat
2. Selanjutnya masuk pada bagian Template
3. Klik Edit HTML
4. Silahkan centang Expand Template Widget
5. Sudah itu, Anda cari kode
]]></b:skin>, untuk memudahkan pencarian, silahkan tekan
ctrl+f.
6. Setelah ketemu, silahkan letakkan kode di bawah ini tepat
di atas kode tadi
.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;}
catatan:Silahkan hapus kode berwarna merah itu, jika Anda ingin membuat kotak komentar
facebook menjadi transparan.
7. Kemudian Anda cari kode
</head> , seperti tadi untuk lebih memudahkan pencarian tekan ctrl+f
8. Jika sudah ketemu, silahkan letakkan kode di bawah ini tepat
di atas kode
</head> tadi
<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 Anda 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>
catatan:Silahkan Anda ganti tulisan berwarna merah tersebut dengan ID FB Anda. Sudah tahu kan, apa itu ID FB? Jika Anda sudah ganti, misalnya http://facebook.com/
justangzealotous berarti ID FB kamu
justangzealotous. Namun, jika Anda belum menggantinya, maka ID FB Anda adalah sebuah angka-angka, contoh http://facebook.com/
1234567890. Untuk melihat ID FB, Anda bisa masuk ke profil FB kamu, kemudian silahkan lihat pada
adress bar.
9. Selanjutnya, silahkan Anda cari kode
<div class='comments' id='comments'>10. Umumnya, kode
<div class='comments' id='comments'>, terdapat 2. Silahkan Anda letakkan kode berikut tepat
di bawah kedua kode tersebut.
<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='
3' width='
400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>Silahkan Anda, hapus kode berwarna merah tersebut, jika kode di bawah sama. Kalau tidak, yah tidak perlu dihapus. Perhatikan, untuk yang nomor
3 adalah jumlah komentar yang akan muncul di kotak komentar facebook, untuk yang nomor
400 adalah lebar kotak komentar.
Silahkan ganti sesuai dengan keinginan Anda.
11. Setelah itu, klik Simpan Template
Selesai, juga deh
kotak komentar facebook dan blog yang berdampingan. Selamat mencoba.
Sumber:
http://super-bee.blogspot.com
Selamat siang dan apa kabar!! Menjelang berbuka puasa (masih lama), mari kita ngabuburit bareng dengan menyimak sebentar postingan blog Belajar Internet kali ini yang akan membahas tentang Cara Membuat Polling atau Voting di Blog dengan BooRoo.com. Postingan ini merupakan permintaan dari "saudara" (bukan kandung) blogger kita.
Hai sobat bloggers, udah puasa belum? Baiklah, postingan Belajar Internet kali ini akan membahas tentang Cara Buat Widget Melayang di Blog. Widget melayang? Seperti apa yah? Kayak superman? 
..Tentu saja bukan, widget ini mungkin sudah pernah Anda lihat di beberapa blog ataupun website, kadang widget melayang tersebut adalah widget like box facebook, iklan atau promosi, dan mungkin juga widget follow twitter. Sekarang, kalian sudah mengerti bukan? Widget semacam ini saya temukan ketika saya berjelajah menggunakan search engine terbaru saya. Tanpa basa-basi dan terus ngawur ngga jelas, ayo kita lihat caranya lansung.
