Modifikasi Tampilan Widget MyBlogLog Recent Readers

Contoh Tampilan Widget MyBlogLog Punya Saya :





Dan Berikut Contoh Recent Reader Standar nya :



Memasang Widget MyBlogLog recent readers dapat meningkatkan popularistas blog dan merupakan suatu komunitas bagi para pengunjung atau pembaca blog. Pertama kali saya pasang, Eh ternyata malah saya jadi tidak menyukainya ... bukan karena Widget MyBlogLog itu jelek tetapi karena tampilanya yang menurut saya terlalu mencolok, jadi tidak sesuai dengan template saya. Nah kali ini saya akan mencoba menuliskan posting bagaimana mengubah tampilan widget MyBlogLog yang sebelumnya mencolok menjadi lebih menarik.

Tutorial ini saya dapat dari sang master blog yang sudah dimodifikasi sedemikian rupa, sehingga menjadi tidak mencolok (tampilanya seperti yang saya pasang pada blog ini). Demi meningkatkan jumlah komunitas pembaca, tentu harus ada sedikit perubahan, terutama pada modifikasi tampilan, selain MBL hanya tampak seperti thumbnails, anda juga bisa menambahkan sendiri kalimat berupa ajakan atau menghasut pengunjung agar tergabung dalam komunitas

OK, langsung saja tutorial cara buatnya :

Sebelum memodifikasi tampilan, pastikan widget MBL yang anda gunakan merupakan versi lama, karena versi terbaru sudah jauh berbeda. Jika perlu anda bisa mengembalikan script baru anda ke versi lama, baca caranya: Copy paste kode dibawah ini, jangan lupa mengganti ID_MBL dengan code ID anda sendiri.

<script src="http://pub.mybloglog.com/comm2.php?mblID=ID_MBL&amp;c_width=330&amp;c_sn_opt=n&amp;c_rows=2&amp;c_img_size=h&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=ffffff" type="text/javascript"></script>

Selanjutnya pada Element halaman Blogger pilih Edit-HTML, masukan kode CSS dibawah ini dibawah kode <b:skin><![CDATA[

td.mbl_fo_hidden{display:none;}td.mbl_join_img{}td.mbl_join{}tr#tr0{display: none}th.mbl_h{display:none;}

Untuk menambah link berupa kalimat ajakan, anda dapat menggunakan kode dibawah ini, ganti warna merah NamaUserMBL dan ID_MBL sesuaikan dengan nama user dan ID MBL anda dan pastikan kode diletakan dibawah javascript MLB.

<p align="center"><a target="_blank" href="http://www.mybloglog.com/buzz/community/NamaUserMBL/">
Lihat pembaca yang tergabung komunitas</a></p>
<p align="center"><a target="_blank" href="http://www.mybloglog.com/buzz/yjoin/?ref_id=ID_MBL&ref=w">
Gabung dalam komunitas ini</a></p>

Mudah bukan? Untuk lebih maksimal, anda bisa mengatur sendiri kombinasi warna dalam Script, sebaiknya sesuaikan warna background MBL dengan background template anda. Selamat Mencoba ... happy blogging.

Anda sudah bergabung dalam komunitas MBL uttajadoel.blogspot.com? klik disini untuk bergabung.

Read More ->>

Cara Memasang Widget Follow Twitter Tersembunyi

Pada kesempatan kali ini saya akan memposting Cara Memasang Widget Follow Twitter Tersembunyi, dimana pada postingan saya yang sebelumnya juga membahas Cara Memasang Widget Follow Tersembunyi. disini saya akan memberikan jalan alternatif untuk menghemat Ruang penyimpanan Script, mudah-mudahan bermanfaat untuk anda dan untuk kita semua

Berikut Cara-caranya :
1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode </body> Lalu masukkan code berikut tepat diatasnya:

<!-- twitter follow badge by go2web20 -->
<script src='http://www.go2web20.net/twitterfollowbadge/1.0/badge.js' type='text/javascript'></script><script type='text/javascript' charset='utf-8'><!--
tfb.account = 'http://twitter.com/UttajadoeL';
tfb.label = 'follow-me';
tfb.color = '#0072bc';
tfb.side = 'r';
tfb.top = 300;
tfb.showbadge();
--></script>
<!-- end of twitter follow badge -->

Lihat Contohnya :

KET :
- tfb.side = 'r' : Posisi Gambar anda bisa rubah R(Right) L(Left)
- tfb.top = 300; : jaraknya.
- tfb.label = 'follow-me'; : Tulisan, Anda dapat Merubahnya. : Misal : Follow me on Twitter
- UttajadoeL'; anda ganti sesuai dengan nama Twitter anda.

6. Simpan template, lihat hasilnya...

Jika Ingin Membuatnya Sendiri Bisa Kunjungi Situs Berikut.

"Semoga Berhasil"

Read More ->>

Cara Memasang Widget Follow Tersembunyi

Bagi Anda yang Blognya tidak terlalu banyak ruangan pada sidebarnya disini saya akan memberikan jalan alternatif mudah-mudahan bermanfaat untuk anda dan untuk kita semua yaitu WIDGET FOLLOWER TERSEMBUNYI/MELAYANG yang tentunya tidak memerlukan tempat banyak.:...

Baiklaah...kali ini akan saya share bagaimana cara membuat widget follower melayang dengan mode show/hide. Postingan ini merupakan permintaan dari beberepa sobat blogger (hehehe..sebenarnya saya sudah berniat memposting sebelumnya). 

Trik ini merupakan pengembangan dari Script untuk membuat BUKU TAMU TERSEMBUNYI, hehe..,,yasudahlah yang penting Follownya bisa show/hide. Mau tau caranya?? mari ikuti langka langkah berikut :

1. Pastikan login Blogger terlebih dahulu
2. Masuk ke Perancangan Elemen Laman
3. Tambahkan Gadget Html/Java Script
4. Copas kode berikut :

<style type="text/css">
#fl{
position:fixed;
left:150px;
z-index:+1000;
}
* html #fl{position:relative;}
.flcontent{
float:left;
border:2px solid #676767;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwtm8dUzxYC0rb3t6iK5LPJ7on5Rczr-tF3tenM9RTcX1zb3W2imdGN2KGKcL0_JTXBMQiAY4vcXSONPG1ivTDfNKnjjx2WR1vXrqPciVrsgZV0ePO9aw8TASBJEdhA4itwEh3e_86QKdu/)#000000 repeat-x bottom center scroll;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideFL(){
var fl = document.getElementById("fl");
var w = fl.offsetWidth;
fl.opened ? moveFL(0, -100-w) : moveFL(20-w, 0);
fl.opened = !fl.opened;
}
function moveFL(x0, xf){
var fl = document.getElementById("fl");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
fl.style.bottom = x.toString() + "px";
if(x0!=xf){setTimeout("moveFL("+x+", "+xf+")", 10);}
}
</script>
<div id="fl">
<div class="fltab" onclick="showHideFL()"> </div>
<div class="flcontent">

Kode Widget Follow Disini

<div style="text-align: right;">
<a href="javascript:showHideFL()">
[Tutup]
</a></div>
<font size="2"><a href="http://uttajadoel.blogspot.com/2011/03/cara-memasang-widget-follow-tersembunyi.html"target=_blank"><div style="color: #444444;">
<span style="font-size: xx-small;">By Utta' jadOeL</span></div></a></font>
</div>
</div>
<script type="text/javascript">
var fl = document.getElementById("fl");
fl.style.bottom = (-100-fl.offsetWidth).toString() + "px";
</script>

Eits..jangan disave dulu, mari lanjut ke langkah selanjutnya

6. untuk mengambil kode widget follownya silahkan masuk ke link ini [http://www.google.com/friendconnect]
7. Lihat Gambar dibawah

-[1] Pilih blog sobat yang akan dipasang widget follownya
-[2] Klik "Tambahkan gadget anggota"
-[3] Silahkan diatur ukuran, warna  dll nya..
-[4] Klik "Buat kode"
-[5] Silahkan Copy kodenya, dan ikuti langkah selanjutnya
8. Paste kode Widget Follow tadi pada kode nomor 4 (*Gantikan kode yang berwarna merah dengan kode Widget Follow yang sudah dicopy tadi)
9. Save..
hohoho...ternyata tidak cukup sampai disini, masih ada 1km perjalanan lagi
10. Untuk memasang tombol Navigasinya, silahkan masuk ke :
Perancangan>>Edit HTML.
11. Cari kode <body> dan paste code brikut tepat diatas kode <body>

<a href='javascript:showHideFL()' style='display:scroll;position: fixed; bottom:5px;left:5px;' title='Follow This Blog'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4TFKa-cgkIYz6FVUiV9VSQrKRJUHnB74-rhIP_Kz_l1puZuPIthvODhY0zo6zpq7KNoKcM4eC095ybPvcGUJ5_k3n4R-x44aYhGP4CvakV97bUR0TGlzWyQxRLrlUUFF-BJVhWpOycQh2/'/></a>

12. Simpan template
lihat hasilnya... "Semoga Berhasil"

Selamat Mencoba

Read More ->>

Pasang TAB Tombol Buka Tutup

Berikut Contohnya :

[MASUKAN KODE HTML ANDA DISINI]

Baiklah Kali ini saya akan memberi penjelasan sedikit tentang postingan kali ini.. sebagai seorang blogger tentu saja anda ingin membuat hal-hal yang menarik di blog anda tapi anda bingung ingin meletakkan gadget anda dimana karena tempatnya terlalu sempit,
Jangan khawatir ada jalan keluarnya..!!! anda tinggal meletakkan gadget anda di dalam tab kotak tersebut,, ya sudahlah sepertinya anda sudah mengerti dan tinggal anda kembangkan sendiri..
5. Lalu masukan CSS dibawah sebelum kode ]]></b:skin>

<div>
<div style="margin: 5px;">
<div class="normalfont" style="margin-bottom: 2px;">
<input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Open'; }" style="background: none repeat scroll 0% 0% rgb(66, 66, 66); color: #ffffcc; font-size: 11px; margin: 0px; padding: 5px; width: 100%;" type="button" value="Open" /></div>
<div class="alt2">
<div style="display: none;">
<div style="color: bisque; padding: 10px; text-align: justify;">

<div style="-moz-background-inline-policy: -moz-initial; -moz-border-radius: 0px 0px 0px 0px; background: url(&quot;#&quot;) no-repeat scroll 0pt 0pt rgb(0, 0, 0); border: 1px solid rgb(204, 204, 204); height: 250px; margin: 10px 0px; overflow: auto; padding: 10px; text-align: left; width: auto;">

[MASUKAN KODE HTML ANDA DISINI]

</div>
</div>
</div>
</div>
</div>
</div>

KET:
-Teks yang berwa kuning ada rubah sesuai keinginan anda.
-Tulisan [MASUKAN KODE HTML ANDA DISINI] anda masukkan script yg ingin anda pkai.

Langkah 2
1. Login di blogger dengan ID anda
2. Klik menu tata Letak
3. Klik Elemen Halaman
4. Klik Tambah Gadged
5. Klik HTML/JavaScript
6. Lalu Copy paste kodenya
7. Setelah itu klik Simpan
8. Dan Lihat Hasilnya

kemudian SAVE TEMPLATE dan lihat hasilnya...met mencoba..:)

Read More ->>

Pasang Social Bookmark AddThis di Setiap Posting

Banyak situs yang menyediakan jasa bookmar dan sharing gratis. Diantaranya adalah AddThis.com, AddToAny.com, ShareThis.com, AddInto.com, dan masih banyak lagi. Anda tinggal pilih untuk menggunakan salah satu diantaranya. Karena saya menggunakan jasa AddThis.com maka saya bahas yang ini saja. Untuk yang lainnya tidak jauh berbeda, pada dasarnya cara pasang tombol bookmark di setiap posting sama saja. Bahkan anda bisa memasangnya di sidebar dan tidak perlu di akhir postingan.

Pasang Bookmark Di Setiap Posting
Perbedaan antara meletakkan tombol bookmark di sidebar dan akhir posting adalah, jika anda letakkan tombol di sidebar maka bookmark akan mengambil feed pada halaman utama blog anda. Sedangkan jika diletakkan di akhir setiap posting, maka bookmark akan mengambil feed dari setiap judul posting yang dipilih. Nah, untuk memasang di akhir posting akan saya bagi menjadi dua tahap yaitu tahap pendaftaran atau registrasi dan tahap pemasangan kode script pada template blog.

Tahap Pertama

1. Kunjungi situs AddThis untuk mendaftar, cuma bentar koq.
2. Pada halaman Create your button, akan ada pilihan dimana anda akan meletakkan tombol. Misalnya seperti di website, blogspot, wordpress. Kalau saya pilih yang blogspot. Di bagian bawah, silahkan pilih model tombol yang anda rasa cocok.
   
   
3. Setelah itu klik tombol Get the code yang berada di bawahnya.
   
   
4. Pada halaman berikutnya anda akan diberikan dua pilihan. Apakah anda ingin menambahkan tombol addthis di sidebar atau di akhir setiap posting. Anda bisa memilih dua-duanya secara bertahap. Nah, untuk menambahkan tombol addthis pada setiap posting maka pilihlah yang bagian bawah. Disana ada kode script addthis yang bisa anda copy dulu ke teks editor. Caranya dengan mengklik tombol Copy Code.
   
   

Tahap kedua

1. Login ke blogger dengan ID anda
2. Klik Layout
3. Pada tab menu pilih Edit HTML
4. Centang kotak Expand Template Widget
5. Cari kode <data:post.body/>
6. Paste kode script AddThis anda di bawah kode <data:post.body/>
7. Klik tombol Save Template

Sekarang coba perhatikan pada salah satu posting blog anda. Tombol addthis sudah berada di bawahnya dan di setiap akhir postingan yang lain. Jika tidak ada masalah, maka hasilnya akan seperti gambar ini :


Nah, langkah-langkah di atas akan mirip jika anda menggunakan jasa situs lainnya. Yang penting, anda mendapatkan script bookmark dan tinggal menempatkannya akhir setiap posting.

Read More ->>

Cursor Bertabur Bintang

Untuk mempercantik blog agar lebih menarik ada berbagai cara,antara lain dengan memasang silde,jam,led scroller dan laia-lain.Penambahan widget ini bertujuan agar pengunjung  akan betah berlama-lama melihat blog kita.
Tulisan kali ini akan kita bahas bersama cara membuat cursor bertaburan bintang.Crusor ini akan mengeluarkan bintang bertaburan jika digerakkan, contoh anda bisa lihat di dalam postingan ini.
Langkah-langkahnya sebagai berikut :

1. Login Blogger dengan ID anda
2. Klik Tata Letak.
3. Klik Tambah Gadget
4. Pilih HYML/Java Script
5. Copy dan paste kode scipt di bawah ini.
6. Simpan dan lihat hasilnya.

Bintang Warna Biru
 
<script src="http://denisahlan.netau.net/bintang.biru.js" type="text/javascript"></script>


Bintang Warna Hijau
 
<script src="http://denisahlan.netau.net/bintang.hijau.js" type="text/javascript"></scrip
t>

Bintang Warna Merah
 
<script src="http://denisahlan.netau.net/bintang.merah.js" type="text/javascript"></script>


Bintang Warna Putih

<script src="http://denisahlan.netau.net/bintang.putih.js" type="text/javascript"></script>

Bintang Warna Ungu


<script src="http://denisahlan.netau.net/bintang.ungu.js" type="text/javascript"></script>

Selamat mencoba......

Read More ->>

Pasang Widget MP3 Music Player di Blog

Hasilnya Seperti Ini :

Pengen MP3 Player buat ditaruh di blog kamu? Kenapa tidak menggunakan layanan dari Mixpod? Beberapa kelebihan Mixpod diantaranya:

1. Banyak pilihan skin player dengan desain yang bagus.
2. Kita dapat meng-custom warna agar sesuai dengan tema blog.
3. Mendukung playlist

Caranya?
1. Buat akun baru di Mixpod
2. Buat playlist baru dengan mengeklik “Create Playlist”. Kita pilih “Add URL”. Ini adalah URL MP3 yang bisa didapat dari 4Shared, BeeMP3, EMP3Finder, dll. Tinggal masukkan satu persatu.
3. Kalau daftar MP3 sudah OK, lanjut ke Customize. Di sini kita bisa memilih skin yang akan dipasang di blog. Beberapa di antaranya :


4. Simpan Playlist dengan mengeklik “Save Playlist”. Isikan nama Playlist, tentukan genre yang diinginkan dan klik “SAVE (Get Code)”.
5. Akan keluar halaman baru berisi daftar layanan blog seperti MySpace, Friendster, Blogger, dll. Untuk memasang kodenya. Pilih layanan blog yang dipakai. Misal Blogger, maka pilih menu Blogger. Dan tinggal ikuti petunjuknya.

Bagaimana? Sudahkah kamu memasang Mixpod ini di blog kamu? Tulis komentar beserta URL blog kamu.

Berikut Script Musik saya :

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMDA1NjU2MzU2ODcmcHQ9MTMwMDU2NTYzOTMxMiZwPTE4MDMxJmQ9Jmc9MSZvPTY3Y2ViMzBjM2M2ZDQwMjY4ZDA*/Mzc3NDhiZGRhNjhk.gif" /><embed src="http://assets.mixpod.com/swf/mp3/mff-mpodmin.swf?myid=78835199&path=2011/03/18" quality="high" wmode="transparent" flashvars="mycolor=222222&mycolor2=77ADD1&mycolor3=FFFFFF&autoplay=false&rand=1&f=4&vol=100&pat=0&grad=false" width="235" height="390" name="myflashfetish" salign="TL" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" border="0" style="visibility:visible;width:100%;height:390px;" /><br /><div></div></embed>

Read More ->>

Widget TV Streaming Online

Kali ini adalah cara memasang TV Online channel Indonesia di blog atau situs Anda, dan caranya sangat mudah, opsinya gak ribet dan akan langsung muncul di blog Anda dengan fitur tidak kalah dengan TV streaming professional, PD MODE: ON.
cukup sobat copy code script dibawah.
dan Seperti apa tampilannya? anda bisa lihat langsung dibawah.




gmn? Lumayan kan?,.
baiklah jika sobat ingin memasangnya, langsung saja copy code script berikut :

<center><embed align="top" allowfullscreen="true" allowscriptaccess="always" bgcolor="#ffffff" devicefont="false" height="860" menu="true" name="MivoTV" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" scale="noscale" src="http://id.imediabiz.com/MivoTV.swf?r=%27%20+%20Math.round%28Math.random%28%29%20*%2099999%29%20+%20%27" type="application/x-shockwave-flash" width="610" wmode="transparent"></embed></center>

NB:
Fasilitas ini hanya untuk digunakan dalam postingan atau static page, karena kalau dipasangnya di sidebar maka akan kebesaran, lebih baik pasangnya di postingan saja key.

Read More ->>

Follow Twitter Melayang Mengikuti Arah Kursor

Pada postingan kali ini kita akan membahas sedikit tutorial cara memasang widget twitter animasi di blog yang selalu mengikuti krusor. tanpa sengaja saya menemukan tutorial ini di search Engine Mbah google,.hehee Oia, Untuk contohnya anda bisa lihat langsung pada postingan ini.

Demonya bisa dilihat disini


Tertarik??Baiklah, bagi sobat blogger yang tertarik untuk memasangnya di blog, silahkan ikuti tutorial di bawah ini.
1. Login ke akun Blog sobat.
2. Pilih rancangan, add gadget kemudian klik HTML/Java Script.
3. Copy Paste script di bawah ini ke dalam gadget sobat.

<!-- floating twitter Bird -->
<script type="text/javascript" src="http://kangdadang.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJUc58kr7PblFcZl3dbbW3eYXAF44Ixyb5VYmDsy2eFtqEczB6Bmrs6MNO7Hipp3IWZoTSDdCnYNKT_5vbz9v3V08hVkD790oZZXeULyV_dfOcTecgeZctaTy7ckGNpx7Dxa9tN2Wm3kY/s1600/birdsprite.png"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/Dhyaa008";var tweetThisText = "Twitter - UserID http://www.zonareviewblog.blogspot.com/";tripleflapInit();
</script>

NB: perhatikan teks yg berwarna biru, anda ganti semua sesuai dengan ID anda.

4. Terakhir Simpan. Lihat hasilnya.

Jangan lupa untuk meninggalkan pesan anda..

Semoga bermanfaat.

Read More ->>