Minggu, 10 April 2011

Mengubah Tampilan Widget Recent Readers dari MyBlogLog

MyBlogLog adalah salah satu situs jejaring sosial yang banyak digunakan oleh blogger, kenapa banyak digunkan oleh blgger? Tentu saja banyak manfaat dari mengunakan MyBlogLog, kita dapat mengetahui siapa yang barusan melihat blog kita (recent reader) bisa juga disertai dengan avatar atau photo pengunjung blog kita.

Dengan mybloglog kita juga dapat mengetahui link apa di blog kita yang paling banyak diklik. Selain itu tentu juga akan bisa meningkatkan traffic blog kita. Kita bisa membentuk komunitas blog kita sendiri, saling berinteraksi dengan teman-teman kita yang tergabung di komunitas kita.

Kali ini kita akan memodifikasi tampilan widget dari MyBlogLog yang berbentuk Recent Readers dari bentuk standart yang disediakan oleh MyBlogLog menjadi bentuk tampilan yang lebih ramping.

  • Kode javascript dari MyBlogLog sebelum diubah adalah seperti ini
 <script src="http://pub.mybloglog.com/comm3.php?mblID=2008122219200403&amp;r=widget&amp;is=normal&amp;o=l&amp;ro=4&amp;cs=black&amp;ww=220&amp;wc=single&amp;l=a"></script>

  • Kode javascript dari  MyBlogLog setelah diubah adalah seperti ini
<script src="http://pub.mybloglog.com/comm2.php?mblID=2008122219200403&amp;c_width=220&amp;c_sn_opt=n&amp;c_rows=2&amp;is=normal&amp;c_heading_text=&amp;c_color_heading_bg=eeeddf&amp;c_color_heading=111&amp;c_color_link_bg=eeeddf&amp;c_color_link=c13a10&amp;c_color_bottom_bg=eeeddf" type="text/javascript"></script>

Nah, tentu kalian tahu beda dari script itu? atau gak tahu? gak penting kali :p sekarang yang harus kita lakukan menambahkan kode tersebut pada blog kita. Dengan login ke Blogger  => Tata Letak => Tambah Gadget => pilih HTML/JavaScript. Sebelum disimpan kita harus melalukukan yaitu menganti mblID dengan mblID kita masing-masing karena setiap orang akan memiliki mblID yang berbeda-beda. Dan tentu saja rows dan width juga kita sesuaikan dengan blog kita.

Jika kita menginginkan hanya foto atau avatar dari recent reader yang muncul atau tampil. Berikut langkah-langkah yang harus kita lakukan.
1. Pilih tata letak, kemudian Edit HTML
2. Beri tanda centang pada Expand Template Widget
3. Cari kode berikut ]]></b:skin>  
4. Taruh kode berikut ini di atas kode ]]></b:skin> 

table#MBL_COMM td.mbl_fo_hidden {
display:none;
}
table#MBL_COMM td.mbl_join_img {
background:transparent url(http://bloggerbuster.com/images/blank.gif) repeat scroll 0%;
}
table#MBL_COMM td.mbl_join {
background:transparent url(http://bloggerbuster.com/images/blank.gif) repeat scroll 0%;
}
table#MBL_COMM tr#tr0 {
background:transparent url(http://bloggerbuster.com/images/blank.gif) repeat scroll 0%;
display:none;
}
table#MBL_COMM th.mbl_h {
display:none;
}

5. Pilih PRATINJAU untuk melihat hasil sementara dan jika berhasil langsung pilih SIMPAN 


Artikel Terkait:


Tidak ada komentar:

Posting Komentar

Komentator Blog Ini