Memasang Widget Recent Post + (Thumbnails dan Comment Count)

Beberapa rekan mungkin sudah ada yang pernah memasang Widget Recent Post + Thumbnails + Comment Count ini ya, bagi yang belum pernah tidak ada salahnya mencoba memasang widget cantik ini yang saya ketahui pembuatnya bernama Kranti, yaitu owner dari Bloggertriks.com.


Kalo tidak salah dulu saya pernah juga menulis tentang Recent Posts menggunakan Javascript, tapi yang terbaru ini rada beda, dimana widget ini tidak hanya menampilkan recent post doank, tetapi juga dilengkapi dengan penambahan fasilitas gambar dan juga jumlah komentar, seperti pada gambar diatas.
Untuk memasang widget ini caranya sangat mudah, kita tinggal copy-paste aja semua kode dibawah ini, kemudian langsung paste aja dalam gadget HTML/javascript (Tuju tab Layout - Page Elements - Add a Gadget - pilih HTML/javascript)
Berikut kodenya :

<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 298;
cellspacing = 8;
borderColor = "#ffffff";
bgTD = "#000000";
thumbwidth = 40;
thumbheight = 40;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 5;
home_page = "http://blogging-admin.blogspot.com/";
</script>
<script src="http://myblogtalk.com/bloggertemplates/js/recentposts_thumbnail.js" type="text/javascript"></script>

Apa saja yang perlu diedit ?

boxwidth - Ukuran Lebar Widget
cellspacing - Spasi diantara cells
borderColor - Warna Border
thumbwidth & thumbheight - Ukuran lebar dan tinggi gambar Thumbnails
fntsize - Ukuran Font pada title
acolor - Warna title
aBold - Tebal huruf pada title? (true or false)
numposts - Jumlah recent post yang ditampilkan?
home_page : http://NAMABLOGKAMU.com/ (Ubah sesuai URL blog masing2)

Read More >> Memasang Widget Recent Post + (Thumbnails dan Comment Count)

Fly Banner With Close Button

Penulis : trik-tipsblog.blogspot.com

Mungkin rekan blogger pernah melihat tutorial ini, memang setau saya ada yang lebih rumit menggunakan banyak kode, tapi disini saya coba memberikan tips yang lebih mudah dan sangat simple bahkan bagi anda blogger yang baru mengenal pengkodean pasti bisa melakukannya, ok saya akan segera memberikan tutornya, lanjutkan bacanya ya.



nih ikutin saja langkahnya :
1. Login Ke Blogger.com dengan Akun anda masing-masing Pastinya
2. Masuk ke Tab Tata Letak / Rancangan
3. Pilih Elemen Halaman
4. Tambah Gadget Pilih HTML / JAVASCRIPT
5. Dan Copy kode di bawah ini kedalamnya ok

<a onblur="try {parent.
deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLkOmdH-44qW_AZhLVyHHY-xi8KoRWTXlOq58MVwJn15fjuQq0r_nM2kLQH2w14MOaewoyeCiuVofGJPaonPUM_6Q8R13K7XJQC6U0oTv5Q1XvrVxFsYpErAJWzAUff7DzmiRswmNt8Jw/s1600-h/Widget.JPG"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhg3nqGDAqJYbfH75-ImFDnw7dwcojVCZ4LNWf8NEy85xi_nXOenC7LSBh5FQOPCr0ixCawNavlid4LrOJw4BMXuMCQszU_WK7Z9z6HliPjotjF1dk9AmraDnZtOLAwijkrPaLEL2pCA/s1600/Widget.JPG" alt="" id="BLOGGER_PHOTO_ID_5493933113530648754" border="0" /></a>
<style type="text/css">
#gb{
position:fixed;
top:10px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbcontent{
float:right;
border:2px solid #A5BD51;
background:#ffffff;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
<div style="text-align:right">
<a href="javascript:showHideGB()">
.:[Close][Klik 2x]:.
</a>
</div>
<center>

Masukan Kode iklan atau Gambar yang anda inginkan di sini

</center>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.center = (30-gb.offsetWidth).toString() + "px";
</script></center></div></div>

6. Simpan

Semoga BERHASIL :-)

Read More >> Fly Banner With Close Button

Tampilan Iklan Dengan Gaya Adsense

Oke...topik yang ingin saya angkat pada saat ini yaitu bagaimana membuat iklan dengan tampilan yang cukup sederhana, namun tidak meninggalkan kesan jual untuk iklan tersebut, justru jika anda bisa lebih hebat dalam mengkreasikan kehebatan anda dalam dunia coding, maka tampilan tersebut bisa lebih mantap dibanding tampilan iklan seperti banner, bahkan menurut pendapat saya iklan seperti ini lebih bergengsi, karena jika anda lihat dengan seksama, tampilan iklan seperti ini khalayaknya iklan-iklan ADSENSE.

Oke...langsung saja ketahap pembuatannya :
Iklan ini saya spesifikasikan menggunakan kode HTML. naah...disini juga terdapat dua alternative untuk membuat frame pada kode HTMLnya, yaitu HTML yang menggunakan kode <div> atau bisa menggunakan kode <span>.
Nah, langkah awal untuk membuat iklan yang bergaya seperti diatas,lebih baik anda persiapkan terlebih dahulu iklan apa yang akan anda tampilkan, lebar iklan, konten iklan, warna frame, warna latar belakang, warna huruf, dan lain sebagainya. Jika sudah siap semuanya, kita langsung saja ke kode HTML yg akan di buat
Kodenya seperti ini:

<div style="border: 3px yellow; background: #121B1E; padding:10px; width:250px; text-align:left; color:white;">
<a style="font-size: 17px;COLOR: blue; text-decoration:none;" href="http://blogging-admin.blogspot.com" title="click here"><b>GRATIS DOWNLOAD </b></a> &raquo;<br />
Dapatkan MP3, Movie, Software, Artikel-artikel tentang blog disini. Semua serba <blink>GRATIS...!!!</blink><br />
<a style="color:red; font-size:12px; text-decoration:none;" href="http://blogging-admin.blogspot.com" title="click here"><b>www.blogging-admin.blogspot.com</b></a>
</div>

Hasil dari kode diatas seperti pada gambar berikut ini :


SELAMAT BERKREASI - SELAMAT BEREKSPERIMEN DALAM MENCIPTAKAN TAMPILAN YANG INDAH UNTUK IKLAN-IKLAN ANDA...
SALAM BLOGGER

Read More >> Tampilan Iklan Dengan Gaya Adsense

Cara buat Random “tips of the day”

Tips of the day merupakan tips singkat yang akan disampaikan kepada pengunjung seriap hari, Tips ini bisa berisi apa saja, bisa berupa Tips Bisnis, Tips memasak, Tips merawat mobil, Tips money online, Tips bercinta atau apalah terserah :), Asal jangan tips blogging karena dah punya om hehehe (emang siapa om ya :). Sebenarnya Tips of the day disini cuma istilah saja...tips yang akan kita buat nanti bukan disampaikan setiap hari melainkan tips ini akan berganti ketika pengunjung melakukan refresh atau reload pada halaman blog.



Memangnya Tips of the day ini berguna om? tentu saja, dari pengamatan saya selama ini banyak pengunjung menyukai tips singkat yang saya sampaikan di blog saya -> PD bgt ya he100x. Selain berguna menampilkan informasi singkat, coba bayangkan ketika kamu hanya ingin memposting artikel yang pendek misalkan hanya 250 karakter..masa mau dipaksa dipanjang-panjangin khan malah terlihat aneh, disinilah untungnya memasang Tips of the day. Pengen tau cara buatnya...

Untuk kodenya bisa kamu pelajari script dibawah ini:

<a href="http://www.o-om.com">
<img border="0" style="float:left; margin:0 5px 5px 0;cursor:pointer; cursor:hand;" alt="http://www.o-om.com" src="http://www.geocities.com/oom_directory/tipsOftheday.gif"/></a>
<font color="#333333"><b>Did You Know...</b>
<script language="JavaScript">
//store the quotations in arrays
tips = new Array(5);
tips[0] = "<i>tips bla bla bla 1</i>";
tips[1] = "<i>tips bla bla bla 2</i>";
tips[2] = "<i>tips bla bla bla 3</i>";
tips[3] = "<i>tips bla bla bla 4</i>";
tips[4] = "<i>tips bla bla bla 5</i>";
//calculate a random index
index = Math.floor(Math.random() * tips.length);
//display the quotation
document.write("\n");
document.write(tips[index]);
//done
</script>
</font>
<a href="javascript:location.reload(true)">»»</a> <a target="_blank" href="http://blogging-admin.blogspot.com/2010/06/cara-buat-random-tips-of-day.html">(?)</a>
<br/>

Sedikit penjelasan kode :
Kode warna hijau merupakan text tips yang akan ditampilkan nantinya.

Kode warna pink merupakan icon/logo dari tips, kamu bisa mengganti sesuai keinginan (caranya tinggal arahkan saja alamat url dimana logo/icon kamu disimpan).

Kode warna kuning merupakan kode singkat untuk melakukan refresh atau reload halaman, ketika kode ini di klik maka setiap halaman di refresh tips tersebut akan berganti secara otomatis (kode ini jangan di modifikasi).

Bagaimana Menambah Tips nya biar banyak ?
Lihat contoh kode dibawah, ini berarti kamu hanya menampilkan 5 tips.
tips = new Array(5);
tips[0] = "<i>tips bla bla bla 1</i>";
tips[1] = "<i>tips bla bla bla 2</i>";
tips[2] = "<i>tips bla bla bla 3</i>";
tips[3] = "<i>tips bla bla bla 4</i>";
tips[4] = "<i>tips bla bla bla 5</i>";

Kalau pengen nambah 10 tinggal tambahin aja script kodenya seperti ini.
tips = new Array(10);
tips[0] = "<i>tips bla bla bla 1</i>";
tips[1] = "<i>tips bla bla bla 2</i>";
tips[2] = "<i>tips bla bla bla 3</i>";
tips[3] = "<i>tips bla bla bla 4</i>";
tips[4] = "<i>tips bla bla bla 5</i>";
tips[5] = "<i>tips bla bla bla 6</i>";
tips[6] = "<i>tips bla bla bla 7</i>";
tips[7] = "<i>tips bla bla bla 8</i>";
tips[8] = "<i>tips bla bla bla 9</i>";
tips[9] = "<i>tips bla bla bla 10</i>";

Kalau sobat ingin lebih banyak lagi bisa kan ..? Yang harus diingat jumlah tips dihitung dari 0 (nol) bukan dari angka 1.

Cara memasang pada blogger :
Pilih Tempalate -> Elemen Halaman -> Tambahkan sebuah Elemen Halaman -> Copy-Paste kode script nya -> simpan dan lihat hasilnya.

Read More >> Cara buat Random “tips of the day”

Search Engine With Flat Button and Flat Textbox Style

Search Engine pada blogger merupakan proses pencarian untuk memudahkan mengunjung mencari suatu artikel sesuai dengan kata kunci yang digunakan.

Walaupun sudah banyak yang mengetahui cara pembuatannya namun kali ini saya memberikan sentuhan yang berbeda dari yang standar, yaitu menampilkan dengan gaya Flat Button Style dan Flat Texbox Style.


Untuk membuatnya ikuti langkah dibawah ini:
1. Pada Template -> Element Halaman -> Tambahkan sebuah Elemen Halaman -> HTML/JavaScript
Copy / Paste code dibawah ini

<form action="http://NAMABLOG.blogspot.com/search" method="get"><input class="textinput" name="q" size="37" type="text"/><input value="search" class="buttonsubmit" name="submit" type="submit"/></form>

Jangan lupa ganti NAMABLOG dengan nama blog sobat, dan jangan lupa disimpan.

2. Langkah kedua pada Template -> Edit HTML
Copy / Paste code dibawah ini pada jajaran kode CSS pada blogger, kalo masih bingung cari kode body { lalu setelah tanda akhiran body ada tanda } letakan saja dibawah kode tersebut.

.buttonreset {
color: #333;
background-color: #f3f3f3;
border: 1px solid #999;
padding: 1px;
}
.buttonsubmit {
color: #333;
background-color: #f3f3f3;
border: 1px solid #999;
padding: 1px;
}
.textinput {
color : #333;
background-color: #ffffff;
border: 1px solid #999;
padding: 1px;
}

jangan lupa disimpan, dan lihat hasilnya seperti dibawah ini

Read More >> Search Engine With Flat Button and Flat Textbox Style

Make Logo With Supalogo

Penulis : www.o-om.com

Supalogo merupakan salah satu dari sekian banyak logo maker yang memudahkan kita untuk membuat logo secara instant. Mungkin layanan online inilah cara termudah bagi kita yang tidak terlalu jago menggunakan aplikasi pengolah gambar. Apalagi jika kita hanya ingin membuat logo yang berhubungan dengan nama pribadi, perusahaan atau nama blog, mungkin layanan inilah sebagai solusinya.



Satu hal yang perlu dilakukan untuk menciptakan logo adalah dengan cara memasukkan beberapa text, kemudian memutuskan pada salah satu dari parameter yang berbeda seperti font, size, warna atau transparansi, dan kita akan mendapatkan logo hanya dalam beberapa detik. Silahkan dicoba aja dah :)

Berikut ini beberapa teks yang saya buat menjadi logo with Supalogo

Read More >> Make Logo With Supalogo

Widget Translator Language

Translator widget tentu sesuatu yang sangat familiar bagi para pengguna internet untuk menerjemahkan isi dari informasi yang lagi dibaca terutama pada content non Indonesian Language. Anda dapat langsung mengetikkan kata, kalimat, bahkan beberapa paragrap yang akan diterjemahkan oleh google dengan fasilitas translatenya rekan dapat mencobanya di google translate


Bagi pengguna blog tentu dapat juga menambahkan fasilitas ini pada bagian / widget blognya, sehingga pengunjung yang non Indonesian people dapat mengerti isi dari blog kita.
Caranya mudah sekali, silahkan Copy - Paste dari salah satu bentuk tampilan translator berikut ini dan letakkan pada salah satu widget blog anda.

1. Vertical dengan Background Putih

mau yang seperti diatas berikut kodenya

<div style="border:1px solid #ccc;padding:10px 3px 3px 10px;text-align:center;background-color:#FFFFFF;">
<!---GOOGLE TRANSLATE MINI FLAGS--->
<div align="left">
<!-- Add English to Chinese (Simplified) BETA -->
<strong> Google Translate</strong>�<br/>
<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Czh-CN&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-Chinese (Simplified) BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-Chinese (Simplified) BETA" src="http://growpa.bay.livefilestore.com/y1p1uPoPqXa3UKUUAkAVFfexI7egVPHRwG3pImeqPG7Lje9X3Vaok2Ow5pXvBf-O44vyDmb9PRG78uzI9GNZUQM0Q/_chinese_s.png" height="24" title="Google-Translate-Chinese (Simplified) BETA"/> Chinese</a>

<!-- END English to Chinese (Simplified) BETA-->

<br/>

<!-- Add English to French -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cfr&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to French "><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to French " src="http://growpa.bay.livefilestore.com/y1p2khoQY_AJfGOc4sr626ugjACTUnVs-mBTEUz-tb5f8jQ9_BM37-lp3ZxqFjmUvMRSH35UYbHHp0lN6QAXE3-aQ/_french_s.png" height="24" title="Google-Translate-English to French "/> French</a>

<!-- END English to French -->

<br/>

<!-- Add English to German -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cde&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to German"><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to German" src="http://growpa.bay.livefilestore.com/y1prWarW-yS9UWGkP9t6HIIQjW_Eltl__uJPVASmgDKql99zKOlv1jJilTrGVvRM7VSEIvjGsR4A6pbPo2KrQdrow/_german_s.png" height="24" title="Google-Translate-English to German"/> German</a>

<!-- END English to German -->

<br/>

<!-- Add English to Italian -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cit&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Italian"><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to Italian" src="http://growpa.bay.livefilestore.com/y1pihtUnS8uKwJQ8ep-_AtvEefYsSSpe7BuGCRmnoA5G2305nPqYP5ENQnX6i6YHBXveCLNXgitzGpQLCvw8YYBTA/_italian_s.png" height="24" title="Google-Translate-English to Italian"/> Italian</a>

<!-- END English to Italian -->

<BR/>

<!-- Add English to Japanese BETA -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cja&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Japanese BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to Japanese BETA" src="http://growpa.bay.livefilestore.com/y1pwPr3iynDaRaulak1f2W4f3gWNEOqQ4K9nsIWB6N7aOYBI02QhhX-48OOeROACQAcHleqiCY2wTLKfnffTghs2A/_japanese_s.png" height="24" title="Google-Translate-English to Japanese BETA"/> Japanese</a>

<!-- END English to Japanese BETA -->

<br/>

<!-- Add English to Korean BETA -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cko&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Korean BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to Korean BETA" src="http://growpa.bay.livefilestore.com/y1pXidbN5Z6YZ5j0fb2AXCyjLBr9n_ddaYqz1qFEi3N7NBjegm2VkUQavp9d8hMz2UWBJHF2ajVRjWUnn5PCdj5Cg/_korean_s.png" height="24" title="Google-Translate-English to Korean BETA"/> Korean</a>

<!-- END English to Korean BETA -->

<br/>

<!-- Add English to Russian BETA -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cru&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Russian BETA "><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to Russian BETA " src="http://growpa.bay.livefilestore.com/y1phf9HxXBCzVD3KIGCm2oTlvoTGwR_rWkgTRQ0_w-Nw_Oi9OYdzIMfJjhl1kvbven1Fo61xxKLF_6KM7w_BlDhCg/_russian_s.png" height="24" title="Google-Translate-English to Russian BETA "/> Russian</a>

<!-- END English to Russian BETA -->

<br/>

<!-- Add English to Spanish -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Ces&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Spanish "><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to Spanish " src="http://growpa.bay.livefilestore.com/y1pS41oGyQtMRYc6yBTJoaovLHaCZOthp6qXfQxIau493uQ-BefJvBTkz5kliT5BfzKgxIZ8hYMuUXPjKEXio1Gow/_spanish_s.png" height="24" title="Google-Translate-English to Spanish "/> Spanish</a>

<!-- END English to Spanish -->

</div>

^{Powered by} <img align="absbottom" src="http://www.google.com/ig/modules/translatemypage_content/logo.gif"><br/>
<small><a href="http://blogging-admin.blogspot.com" target="_blank">+</a> <a href="http://blogging-admin.blogspot.com/2010/06/widget-translator-language.html" target="_blank">Grab this Widget</a></small><br/>

</div>

2. Vertical Background Transparent
sama dengan diatas tetapi dengan latar belakang transparan

<div style="border:1px solid #ccc;padding:10px 3px 3px 10px;text-align:center;background-color:none;margin:7px 0 7px 0;">

<!---GOOGLE TRANSLATE MINI FLAGS--->
<div align="left">

<!-- Add English to Chinese (Simplified) BETA -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Czh-CN&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-Chinese (Simplified) BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-Chinese (Simplified) BETA" src="http://growpa.bay.livefilestore.com/y1p1uPoPqXa3UKUUAkAVFfexI7egVPHRwG3pImeqPG7Lje9X3Vaok2Ow5pXvBf-O44vyDmb9PRG78uzI9GNZUQM0Q/_chinese_s.png" height="24" title="Google-Translate-Chinese (Simplified) BETA"/> Chinese</a>

<!-- END English to Chinese (Simplified) BETA-->

<br/>

<!-- Add English to French -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cfr&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to French "><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to French " src="http://growpa.bay.livefilestore.com/y1p2khoQY_AJfGOc4sr626ugjACTUnVs-mBTEUz-tb5f8jQ9_BM37-lp3ZxqFjmUvMRSH35UYbHHp0lN6QAXE3-aQ/_french_s.png" height="24" title="Google-Translate-English to French "/> French</a>

<!-- END English to French -->

<br/>

<!-- Add English to German -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cde&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to German"><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to German" src="http://growpa.bay.livefilestore.com/y1prWarW-yS9UWGkP9t6HIIQjW_Eltl__uJPVASmgDKql99zKOlv1jJilTrGVvRM7VSEIvjGsR4A6pbPo2KrQdrow/_german_s.png" height="24" title="Google-Translate-English to German"/> German</a>

<!-- END English to German -->

<br/>

<!-- Add English to Italian -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cit&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Italian"><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to Italian" src="http://growpa.bay.livefilestore.com/y1pihtUnS8uKwJQ8ep-_AtvEefYsSSpe7BuGCRmnoA5G2305nPqYP5ENQnX6i6YHBXveCLNXgitzGpQLCvw8YYBTA/_italian_s.png" height="24" title="Google-Translate-English to Italian"/> Italian</a>

<!-- END English to Italian -->

<BR/>

<!-- Add English to Japanese BETA -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cja&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Japanese BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to Japanese BETA" src="http://growpa.bay.livefilestore.com/y1pwPr3iynDaRaulak1f2W4f3gWNEOqQ4K9nsIWB6N7aOYBI02QhhX-48OOeROACQAcHleqiCY2wTLKfnffTghs2A/_japanese_s.png" height="24" title="Google-Translate-English to Japanese BETA"/> Japanese</a>

<!-- END English to Japanese BETA -->

<br/>

<!-- Add English to Korean BETA -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cko&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Korean BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to Korean BETA" src="http://growpa.bay.livefilestore.com/y1pXidbN5Z6YZ5j0fb2AXCyjLBr9n_ddaYqz1qFEi3N7NBjegm2VkUQavp9d8hMz2UWBJHF2ajVRjWUnn5PCdj5Cg/_korean_s.png" height="24" title="Google-Translate-English to Korean BETA"/> Korean</a>

<!-- END English to Korean BETA -->

<br/>

<!-- Add English to Russian BETA -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cru&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Russian BETA "><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to Russian BETA " src="http://growpa.bay.livefilestore.com/y1phf9HxXBCzVD3KIGCm2oTlvoTGwR_rWkgTRQ0_w-Nw_Oi9OYdzIMfJjhl1kvbven1Fo61xxKLF_6KM7w_BlDhCg/_russian_s.png" height="24" title="Google-Translate-English to Russian BETA "/> Russian</a>

<!-- END English to Russian BETA -->

<br/>

<!-- Add English to Spanish -->

<a target="_blank" rel="nofollow" style="cursor:pointer; cursor:hand;" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Ces&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Spanish "><img border="0" style="cursor:pointer; cursor:hand;" width="24" align="absbottom" alt="Google-Translate-English to Spanish " src="http://growpa.bay.livefilestore.com/y1pS41oGyQtMRYc6yBTJoaovLHaCZOthp6qXfQxIau493uQ-BefJvBTkz5kliT5BfzKgxIZ8hYMuUXPjKEXio1Gow/_spanish_s.png" height="24" title="Google-Translate-English to Spanish "/> Spanish</a>

<!-- END English to Spanish -->

</div>

<span style="font-size:70%;">Powered by</span> <br/>
<strong>Google</strong>� Translate<br/>
<span style="font-size:80%;"><a href="http://blogging-admin.blogspot.com" target="_blank">+</a> <a href=" http://blogging-admin.blogspot.com/2010/06/widget-translator-language.html " target="_blank">Grab this Widget</a></span>

</div>

3. Mendatar Background Putih

kodenya berikut ini

<div style="border:1px solid #ccc;padding:10px 0px 3px 0px;text-align:center;background-color:#FFFFFF;min-width:235px; margin: 5px 0 5px 0;">

<!--GOOGLE TRANSLATE MINI FLAGS-->
<div align="center" style="width:auto;">

<!-- Add English to Chinese (Simplified) BETA -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Czh-CN&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-Chinese (Simplified) BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-Chinese (Simplified) BETA" src="http://growpa.bay.livefilestore.com/y1p1uPoPqXa3UKUUAkAVFfexI7egVPHRwG3pImeqPG7Lje9X3Vaok2Ow5pXvBf-O44vyDmb9PRG78uzI9GNZUQM0Q/_chinese_s.png" height="24" title="Google-Translate-Chinese (Simplified) BETA"/></a>

<!-- END English to Chinese (Simplified) BETA-->

<!-- Add English to French -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cfr&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to French "><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to French " src="http://growpa.bay.livefilestore.com/y1p2khoQY_AJfGOc4sr626ugjACTUnVs-mBTEUz-tb5f8jQ9_BM37-lp3ZxqFjmUvMRSH35UYbHHp0lN6QAXE3-aQ/_french_s.png" height="24" title="Google-Translate-English to French "/></a>

<!-- END English to French -->

<!-- Add English to German -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cde&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to German"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to German" src="http://growpa.bay.livefilestore.com/y1prWarW-yS9UWGkP9t6HIIQjW_Eltl__uJPVASmgDKql99zKOlv1jJilTrGVvRM7VSEIvjGsR4A6pbPo2KrQdrow/_german_s.png" height="24" title="Google-Translate-English to German"/></a>

<!-- END English to German -->

<!-- Add English to Italian -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cit&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Italian"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Italian" src="http://growpa.bay.livefilestore.com/y1pihtUnS8uKwJQ8ep-_AtvEefYsSSpe7BuGCRmnoA5G2305nPqYP5ENQnX6i6YHBXveCLNXgitzGpQLCvw8YYBTA/_italian_s.png" height="24" title="Google-Translate-English to Italian"/></a>

<!-- END English to Italian -->

<!-- Add English to Japanese BETA -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cja&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Japanese BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Japanese BETA" src="http://growpa.bay.livefilestore.com/y1pwPr3iynDaRaulak1f2W4f3gWNEOqQ4K9nsIWB6N7aOYBI02QhhX-48OOeROACQAcHleqiCY2wTLKfnffTghs2A/_japanese_s.png" height="24" title="Google-Translate-English to Japanese BETA"/></a>

<!-- END English to Japanese BETA -->

<!-- Add English to Korean BETA -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cko&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Korean BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Korean BETA" src="http://growpa.bay.livefilestore.com/y1pXidbN5Z6YZ5j0fb2AXCyjLBr9n_ddaYqz1qFEi3N7NBjegm2VkUQavp9d8hMz2UWBJHF2ajVRjWUnn5PCdj5Cg/_korean_s.png" height="24" title="Google-Translate-English to Korean BETA"/></a>

<!-- END English to Korean BETA -->

<!-- Add English to Russian BETA -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cru&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Russian BETA "><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Russian BETA " src="http://growpa.bay.livefilestore.com/y1phf9HxXBCzVD3KIGCm2oTlvoTGwR_rWkgTRQ0_w-Nw_Oi9OYdzIMfJjhl1kvbven1Fo61xxKLF_6KM7w_BlDhCg/_russian_s.png" height="24" title="Google-Translate-English to Russian BETA "/></a>

<!-- END English to Russian BETA -->

<!-- Add English to Spanish -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Ces&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Spanish "><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Spanish " src="http://growpa.bay.livefilestore.com/y1pS41oGyQtMRYc6yBTJoaovLHaCZOthp6qXfQxIau493uQ-BefJvBTkz5kliT5BfzKgxIZ8hYMuUXPjKEXio1Gow/_spanish_s.png" height="24" title="Google-Translate-English to Spanish "/></a>

<!-- END English to Spanish -->

</div>

^{Powered by} <img align="absbottom" src="http://www.google.com/ig/modules/translatemypage_content/logo.gif"><br/>
<small><a href="http://blogging-admin.blogspot.com" target="_blank">+</a> <a href="http://blogging-admin.blogspot.com/2010/06/widget-translator-language.html" target="_blank">Grab this Widget</a></small><br/>

</div>

4. Mendatar 2 baris Background putih

kodenya berikut ini

<div style="border:1px solid #ccc;padding:10px 0px 3px 0px;text-align:center;background-color:#FFFFFF;min-width:180px; margin: 5px 0 5px 0;">

<!--GOOGLE TRANSLATE MINI FLAGS-->
<div align="center" style="width:auto;">

<!-- Add English to Chinese (Simplified) BETA -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Czh-CN&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-Chinese (Simplified) BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-Chinese (Simplified) BETA" src="http://growpa.bay.livefilestore.com/y1p1uPoPqXa3UKUUAkAVFfexI7egVPHRwG3pImeqPG7Lje9X3Vaok2Ow5pXvBf-O44vyDmb9PRG78uzI9GNZUQM0Q/_chinese_s.png" height="24" title="Google-Translate-Chinese (Simplified) BETA"/></a>

<!-- END English to Chinese (Simplified) BETA-->

<!-- Add English to French -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cfr&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to French "><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to French " src="http://growpa.bay.livefilestore.com/y1p2khoQY_AJfGOc4sr626ugjACTUnVs-mBTEUz-tb5f8jQ9_BM37-lp3ZxqFjmUvMRSH35UYbHHp0lN6QAXE3-aQ/_french_s.png" height="24" title="Google-Translate-English to French "/></a>

<!-- END English to French -->

<!-- Add English to German -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cde&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to German"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to German" src="http://growpa.bay.livefilestore.com/y1prWarW-yS9UWGkP9t6HIIQjW_Eltl__uJPVASmgDKql99zKOlv1jJilTrGVvRM7VSEIvjGsR4A6pbPo2KrQdrow/_german_s.png" height="24" title="Google-Translate-English to German"/></a>

<!-- END English to German -->

<!-- Add English to Italian -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cit&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Italian"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Italian" src="http://growpa.bay.livefilestore.com/y1pihtUnS8uKwJQ8ep-_AtvEefYsSSpe7BuGCRmnoA5G2305nPqYP5ENQnX6i6YHBXveCLNXgitzGpQLCvw8YYBTA/_italian_s.png" height="24" title="Google-Translate-English to Italian"/></a><!--END English to Italian--><BR/><!--Add English to Japanese BETA--><a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cja&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Japanese BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Japanese BETA" src="http://growpa.bay.livefilestore.com/y1pwPr3iynDaRaulak1f2W4f3gWNEOqQ4K9nsIWB6N7aOYBI02QhhX-48OOeROACQAcHleqiCY2wTLKfnffTghs2A/_japanese_s.png" height="24" title="Google-Translate-English to Japanese BETA"/></a>

<!-- END English to Japanese BETA -->

<!-- Add English to Korean BETA -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cko&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Korean BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Korean BETA" src="http://growpa.bay.livefilestore.com/y1pXidbN5Z6YZ5j0fb2AXCyjLBr9n_ddaYqz1qFEi3N7NBjegm2VkUQavp9d8hMz2UWBJHF2ajVRjWUnn5PCdj5Cg/_korean_s.png" height="24" title="Google-Translate-English to Korean BETA"/></a>

<!-- END English to Korean BETA -->

<!-- Add English to Russian BETA -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Cru&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Russian BETA "><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Russian BETA " src="http://growpa.bay.livefilestore.com/y1phf9HxXBCzVD3KIGCm2oTlvoTGwR_rWkgTRQ0_w-Nw_Oi9OYdzIMfJjhl1kvbven1Fo61xxKLF_6KM7w_BlDhCg/_russian_s.png" height="24" title="Google-Translate-English to Russian BETA "/></a>

<!-- END English to Russian BETA -->

<!-- Add English to Spanish -->

<a target="_blank" rel="nofollow" onclick="window.open(&apos;http://www.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;&langpair=en%7Ces&hl=en&ie=UTF8&apos;); return false;" title="Google-Translate-English to Spanish "><img border="0" style="cursor:pointer; cursor:hand;" width="24" alt="Google-Translate-English to Spanish " src="http://growpa.bay.livefilestore.com/y1pS41oGyQtMRYc6yBTJoaovLHaCZOthp6qXfQxIau493uQ-BefJvBTkz5kliT5BfzKgxIZ8hYMuUXPjKEXio1Gow/_spanish_s.png" height="24" title="Google-Translate-English to Spanish "/></a>

<!-- END English to Spanish -->

</div>

^{Powered by} <img align="absbottom" src="http://www.google.com/ig/modules/translatemypage_content/logo.gif"><br/>
<small><a href="http://blogging-admin.blogspot.com" target="_blank">+</a> <a href=" http://blogging-admin.blogspot.com/2010/06/widget-translator-language.html" target="_blank">Grab this widget</a></small><br/>

</div>

Bagaimana mudah bukan, semoga bermanfaat ..!!

Read More >> Widget Translator Language

Efisiensi Tampilan Link List

Penulis : Serba-seru Blogspot

Setelah posting sebelumnya yang mengangkat tema widget scrolling, nah sekarang tetap pada tema scrolling widget, namun disini yang akan diangkat adalah tentang scrolling pada Link, karena pada gadget Link ini tidak bisa secara langsung di edit melalui gadgetnya, namun melalui template blog kita, tapi supaya artikel ini tidak membingungkan, lebih baik dimulai dari awal aja yaaachhh....
Oke....lanjuuuuuuuuttttt....


Ikuti langkah-langkah berikut ini :
1. Pertama pastinya masuk dulu dong ke Blogger
2. Lalu masuk ke Tata Letak/Layout
3. Terus bikin dulu Link gadgetnya dengan mengklik Add Gadget - Link List
4. Nah Masukin dech beberapa Link dahulu, kl bisa agak banyakan, biar bisa ngeliat hasil scrollingnya nanti
5. Simpan dulu gadget link listnya....
6. Naaahhh, sekarang masuk ke tab Edit HTML diatas
7. Centang Expand Widget Template di kanan atas Box template.
8. Lalu cari code dibawah ini :

<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>

9. Ganti code diatas dengan code dibawah ini :

<div style='width:100%; height:100px; overflow:auto;'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target' target='new'><data:link.name/></a></li>
</b:loop>
</ul>
</div>

10. Simpan Template

Catatan :
Untuk code yang berwarna merah bisa anda sesuaikan dengan selera anda, untuk lebar dan tingginya.

Read More >> Efisiensi Tampilan Link List

Menambah Widget/Gadget Di Bawah Header Blog

Sebagian besar template blogspot kita tidak dapat menambahkan widget di bawah header. Why alias Kenapa kok bisa gitu? ini karena template telah mengunci kode htmlnya agar tidak bisa menambah Widget di bawah Header.
Untuk apa sich kok di tambah widget segala? banyak gunanya, kalau kamu suka adsense bisa nampilin iklan adsense disini, kalau yang suka affilied juga bisa buat nampilin iklannya atau keperluan yang lain juga boleh tergantung selera.


Lalu kalau mau nambah widget bagaimana caranya? tenang saja menurut pengalaman di dunia blogger semua ada caranya. langsung saja to....
Ikuti langkah-langkah berikut ini :
1. Masuk ke Account Blogger kamu.
2. Pilih tab Tata Letak/Rancangan klik Edit Html.

3. Jangan lupa backup template dengan klik Download Template Lengkap setelah itu contreng Expand Template Widget.

4. Cari kode di bawah ini :

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='your blog title (Header)' type='Header'/>
</b:section>

5. ubahlah kode berwarna merah menjadi seperti di bawah ini:

<b:section class='header' id='header' maxwidgets='2' showaddelement='yes'>
<b:widget id='Header1' locked='false' title='your blog title (Header)' type='Header'/>
</b:section>

6. Setelah selesai klik Simpan Template
7. Lihat pada Element halaman bila disana sudah terlihat ada tulisan tambah gadget berarti kamu dah berhasil.. selamat ya.. :)

Catatan :
maxwidgets dapat di ubah sesuai keinginan kamu.

Read More >> Menambah Widget/Gadget Di Bawah Header Blog

Modifikasi Tampilan MyBlogLog Recent Readers

Penulis : www.o-om.com

Namun ada satu hal yang tidak saya sukai, bukan dari tulisan mas cosa, tapi dari tampilan standar widgets MBL yang kurang nyaman memberikan kemudahan dalam mengajak pembaca bergabung dalam komunitas. Anda bisa melihat tampilan widget MBL anda saat ini, terasa sangat kental dengan nuansa MBL-nya dan bandingkan dengan MBL milik saya.





Lihat sample gambar dibawah:

Gambar diatas tidak perlu saya jelaskan panjang lebar, anda pasti memahaminya. Nah 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.

Cara Modifikasi tampilan MyBlogLog:

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 MBL sebelumnya.

<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>
<div align="right"><br /><br /><span style="font-size: 80%">Modif by <a href="http://blogging-admin.blogspot.com">Desta </a></span></div>

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

Read More >> Modifikasi Tampilan MyBlogLog Recent Readers

Sexy Bookmarking For Blog

Kalo denger yang seksi-seksi biasanya bikin kita penasaran sambil ngiler. Tapi kalo setelah kata ‘seksi’ ada kata ‘bookmarking’ bukannya ngiler malah melongo. Apa coba yang seksi dari bookmarking? Nah ini dia… Sexy-Bookmarks v2 : gadget bookmarking untuk blogger yang seksi punya. Tools ini ‘menyembunyikan’ bookmarking yang diletakkan di bawah posting dan hanya akan nongol setiap kali ada mouse hover. Memang kadang yang keliatan dikit-dikit lebih seksi daripada yang langsung bugil (apa coba?!). Lanjutkan dulu bacanya ..


nah ini yang saya sebut sexy bookmarking ituCaranya sebenarnya mudah, tapi agak panjang jalan yang harus dilalui, okelah kalo begitu, sudah siap?
Let’s get ready to rumble!!
1. Ada baiknya sebelum memulai anda mengunduh dulu file berikut Download Image

2. Unpack file gambar PNG yang ada di zip tersebut menggunakan unzip tools dan upload file yang ada ke image hosting kesayangan anda. (Misalnya imageshack.us, jangan gunakan picasa atau photobucket).

3. Masuk ke halaman layout kemudian Edit HTML anda. Centang tanda Expand Widget Template untuk menampilkan semua widget yang mungkin tersembunyi.

4. Masukkan kode di bawah ini sebelum tag </head>

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function() {
// xhtml 1.0 strict way of using target _blank
jQuery('.sexy-bookmarks a.external').attr("target", "_blank");
// this block sets the auto vertical expand when there are more than
// one row of bookmarks.
var sexyBaseHeight=jQuery('.sexy-bookmarks').height();
var sexyFullHeight=jQuery('.sexy-bookmarks ul.socials').height();
if (sexyFullHeight>sexyBaseHeight) {
jQuery('.sexy-bookmarks-expand').hover(
function() {
jQuery(this).animate({
height: sexyFullHeight+'px'
}, {duration: 400, queue: false});
},
function() {
jQuery(this).animate({
height: sexyBaseHeight+'px'
}, {duration: 400, queue: false});
}
);
}
// autocentering
if (jQuery('.sexy-bookmarks-center')) {
var sexyFullWidth=jQuery('.sexy-bookmarks').width();
var sexyBookmarkWidth=jQuery('.sexy-bookmarks:first ul.socials li').width();
var sexyBookmarkCount=jQuery('.sexy-bookmarks:first ul.socials li').length;
var numPerRow=Math.floor(sexyFullWidth/sexyBookmarkWidth);
var sexyRowWidth=Math.min(numPerRow, sexyBookmarkCount)*sexyBookmarkWidth;
var sexyLeftMargin=(sexyFullWidth-sexyRowWidth)/2;
jQuery('.sexy-bookmarks-center').css('margin-left', sexyLeftMargin+'px');
}
});
</script>

5. Lalu letakkan kode di bawah ini setelah Script yang baru anda pasang di atas.

<style type="text/css">
div.sexy-bookmarks{margin:20px 0 0 0; border: 0;outline: none;clear:both !important}
div.sexy-bookmarks-expand{height:29px; overflow:hidden}
.sexy-bookmarks-bg-sexy, .sexy-bookmarks-bg-love{background-image:url('http://img31.imageshack.us/img31/176/sexytrans.png') !important; background-repeat:no-repeat}
div.sexy-bookmarks-bg-love{padding:26px 0 0 10px; background-position:left -1148px !important}
div.sexy-bookmarks ul.socials{width:100% !important; margin:0 !important; padding:0 !important; float:left}
div.sexy-bookmarks ul.socials li{display:inline !important; float:left !important; list-style-type:none !important; margin:0 !important; height:29px !important; width:60px !important; cursor:pointer !important; padding:0 !important}
div.sexy-bookmarks ul.socials li:before, div.sexy-bookmarks ul.socials li:after, div.sexy-bookmarks ul.socials li a:before, div.sexy-bookmarks ul.socials li a:after{content:none !important}
div.sexy-bookmarks ul.socials a{display:block !important; width:60px !important; height:29px !important; text-indent:-9999px !important; background-color:transparent !important}
div.sexy-bookmarks ul.socials a:hover{background-color:transparent !important}
.sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumbleupon, .sexy-stumbleupon:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoobuzz, .sexy-yahoobuzz:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-scriptstyle, .sexy-scriptstyle:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-comfeed, .sexy-comfeed:hover, .sexy-newsvine, .sexy-newsvine:hover, .sexy-linkedin, .sexy-linkedin:hover, .sexy-google, .sexy-google:hover, .sexy-friendfeed, .sexy-friendfeed:hover{background:url('http://img717.imageshack.us/img717/3006/sexyspritenew.png') no-repeat !important;border: 0;outline: none;}
.sexy-digg{background-position:-980px bottom !important}
.sexy-digg:hover{background-position:-980px top !important}
.sexy-reddit{background-position:-700px bottom !important}
.sexy-reddit:hover{background-position:-700px top !important}
.sexy-stumbleupon{background-position:-630px bottom !important}
.sexy-stumbleupon:hover{background-position:-630px top !important}
.sexy-delicious{background-position:-1190px bottom !important}
.sexy-delicious:hover{background-position:-1190px top !important}
.sexy-yahoobuzz{background-position:-1120px bottom !important}
.sexy-yahoobuzz:hover{background-position:-1120px top !important}
.sexy-blinklist{background-position:-1260px bottom !important}
.sexy-blinklist:hover{background-position:-1260px top !important}
.sexy-technorati{background-position:-560px bottom !important}
.sexy-technorati:hover{background-position:-560px top !important}
.sexy-myspace{background-position:-770px bottom !important}
.sexy-myspace:hover{background-position:-770px top !important}
.sexy-twitter{background-position:-490px bottom !important}
.sexy-twitter:hover{background-position:-490px top !important}
.sexy-facebook{background-position:-1330px bottom !important}
.sexy-facebook:hover{background-position:-1330px top !important}
.sexy-mixx{background-position:-840px bottom !important}
.sexy-mixx:hover{background-position:-840px top !important}
.sexy-scriptstyle{background-position:-280px bottom !important}
.sexy-scriptstyle:hover{background-position:-280px top !important}
.sexy-designfloat{background-position:-1050px bottom !important}
.sexy-designfloat:hover{background-position:-1050px top !important}
.sexy-newsvine{background-position:left bottom !important}
.sexy-newsvine:hover{background-position:left top !important}
.sexy-google{background-position:-210px bottom !important}
.sexy-google:hover{background-position:-210px top !important}
.sexy-comfeed{background-position:-420px bottom !important}
.sexy-comfeed:hover{background-position:-420px top !important}
.sexy-linkedin{background-position:-70px bottom !important}
.sexy-linkedin:hover{background-position:-70px top !important}
.sexy-friendfeed{background-position:-1750px bottom !important}
.sexy-friendfeed:hover{background-position:-1750px top !important}
.sexy-link{ margin-left:25px; float:left}
.sexy-link A{padding:10px 0; width:470px; text-align:right; border:0; outline:none}</style>

6. Nah kalau kode yang di bawah ini diletakkan setelah <data:post.body/>

<div class='sexy-bookmarks sexy-bookmarks-expand sexy-bookmarks-bg-love' style='margin:20px 0 0 0 !important; padding:25px 0 0 10px !important; height:29px;/*the height of the icons (29px)*/ display:block !important; clear:both !important;'>
<ul class='socials'>
<li class='sexy-delicious'><a class='external' expr:href='&quot;http://del.icio.us/post?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Share this on del.icio.us'>Share this on del.icio.us</a></li>
<li class='sexy-digg'><a class='external' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Digg this!'>Digg this!</a></li>
<li class='sexy-stumbleupon'><a class='external' expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Stumble upon something good? Share it on StumbleUpon'>Stumble upon something good? Share it on StumbleUpon</a></li>
<li class='sexy-reddit'><a class='external' expr:href='&quot;http://reddit.com/submit?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Share this on Reddit'>Share this on Reddit</a></li>
<li class='sexy-google'><a class='external' expr:href='&quot;http://www.google.com/bookmarks/mark?op=add&amp;bkmk=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Add this to Google Bookmarks'>Add this to Google Bookmarks</a></li>
<li class='sexy-twitter'><a class='external' expr:href='&quot;http://twitter.com/home?status=Reading: &quot; + data:blog.title + &quot; - &quot; + data:post.url + &quot; (@NAME)&quot;' rel='nofollow' title='Tweet This!'>Tweet This!</a></li>
<li class='sexy-facebook'><a class='external' expr:href='&quot;http://www.facebook.com/share.php?u=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Share this on Facebook'>Share this on Facebook</a></li>
<li class='sexy-mixx'><a class='external' expr:href='&quot;http://www.mixx.com/submit?page_url=&quot; + data:post.url' rel='nofollow' title='Share this on Mixx'>Share this on Mixx</a></li>
<li class='sexy-comfeed'><a class='external' expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' rel='nofollow' title='Subscribe'>Subscribe</a></li>
<li class='sexy-yahoobuzz'><a class='external' expr:href='&quot;http://buzz.yahoo.com/submit/?submitUrl=&quot; + data:post.url' rel='nofollow' title='Buzz up!'>Buzz up!</a></li>
<li class='sexy-linkedin'><a class='external' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Share this on Linkedin'>Share this on Linkedin</a></li>
<li class='sexy-designfloat'><a class='external' expr:href='&quot;http://www.designfloat.com/submit.php?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Submit this to DesignFloat'>Submit this to DesignFloat</a></li>
<li class='sexy-technorati'><a class='external' expr:href='&quot;http://technorati.com/faves?add=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Share this on Technorati'>Share this on Technorati</a></li>
<li class='sexy-scriptstyle'><a class='external' expr:href='&quot;http://scriptandstyle.com/submit?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Submit this to Script &amp; Style'>Submit this to Script &amp; Style</a></li>
<li class='sexy-myspace'><a class='external' expr:href='&quot;http://www.myspace.com/Modules/PostTo/Pages/?u=http&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Post this to MySpace'>Post this to MySpace</a></li>
<li class='sexy-blinklist'><a class='external' expr:href='&quot;http://www.blinklist.com/index.php?Action=Blink/addblink.php&amp;Url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Share this on Blinklist'>Share this on Blinklist</a></li>
<li class='sexy-friendfeed'><a class='external' expr:href='&quot;http://friendfeed.com/?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Share this on FriendFeed'>Share this on FriendFeed</a></li>
<li class='sexy-newsvine'><a class='external' expr:href='&quot;http://www.newsvine.com/_tools/seed&amp;save?u=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Seed this on Newsvine'>Seed this on Newsvine</a></li>
</ul>
<div style='clear:both;'/>
</div>
<div class='sexy-link'> Widget by <a href='http://www.cssreflex.com/' title='Web Design Blog, Blogger Hacks and Blogger templates'>Css Reflex </a>|<a href='http://www.tutzone.org/' title='Tutorials, Rare Downloads, Link Heaven, Tips Tricks, Hacks, Make How, Blogger Tricks And Tutorials, Internet, News, And Many More'> TutZone</a>|<a href='http://blogging-admin.blogspot.com/' title='Blogging, Download, Tips, Tricks, Windows, Computer, JavaScript, Internet, News, And Many More'> Desta</a></div>

7. Tugas berikutnya bagi anda adalah mencari kode berekstensi PNG yang ada di script kedua dan mengubah alamat urlnya dengan alamat url gambar yang sudah anda upload di image hosting anda tadi.

8. Klik Simpan Template

Akhirnya usai sudah perjalanan panjang untuk posting ini, silahkan sobat lihat hasilnya seperti pada bagian akhir posting ini, arahkan mouse pada salah satu bookmarking ... bagaimana Sexy bukan ...?

Read More >> Sexy Bookmarking For Blog

Related Post Widget

Related Post dalam dunia blogger berarti posting artikel yang memiliki hubungan atau saling terkait yang dipilih dari kesamaan label, kategori, ataupun tag yang telah ditentukan pada saat mempublikasikan/posting sebuah artikel dari blog yang dibuat. Dengan hack / kode ini pembaca akan dapat melihat judul-judul artikel lainnya yang tersimpan diblog yang saling berhubungan dari kesamaan label, kategori, tag, dari judul artikel tersebut, yang biasanya terletak pada akhir sebuah artikel.


Seperti pada gambar berikut

Manfaat dari fasilitas/widget ini pembaca akan semakin jauh dan berlama-lama membaca isi dari blog yang kita buat, dan tentu saja blog akan semakin baik dalam hal waktu yang diberikan pembaca selama membaca isi dari blog yang kita buat.
Untuk menambahkan widget ini pada blog anda silahkan ikuti langkah-langkah berikut ini :
1. Login pada blog anda
2. Masuk ke Tata Letak / Layout - Edit HTML
3. Klik Pada pilihan "Expand Template Widget"
4. Cari Tag </ head> pada template blog anda
5. Copy dan Paste-kan kode berikut ini persis sebelum </ head>

<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhupF0x6i4omepjLVO8ej0X5hUBCDq0_avaCLazG-UQoHpXOlFqLTabDZDouBSeOME0V1lQjL0bJdSNAMJBP6TJC_6lvHxOcukbXHrLYSXeyUEomCaXupJrZzyG_zSE-fF8GbiqCpjEfs8/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://theblogtemplates.com/scripts/Related_posts_hack.js' type='text/javascript'/>

6. Sekarang cari kode <data:post.body/> Dalam beberapa template kode ini mungkin terlihat seperti ini <div class='post-body>
7. Copy dan Paste-kan kode berikut ini persis di bawah kode tadi (kode pada langkah 6)

<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='related-posts'><font color='#FF6600' face='Arial' size='2'><b>Related Posts : </b></font><font color='#FF6600'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'><script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font><script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script></div></b:if>

8. Simpan Template dan silahkan anda lihat pada setiap akhir posting yang anda buat, lihat diakhir posting ini.

Keterangan :
Untuk mengubah jumlah posting yang terkait muncul pada label yang sama, anda dapat mengubah angka "5" pada kode max-results=5 (kode langkah 7 diatas) dengan angka yang anda inginkan.

Read More >> Related Post Widget

View List Top Commentator

Kini bagi anda pengguna layanan blog Blogger.com atau Blogspot.com anda bisa memasang top komentator widget pada blog anda, untuk melihat siapakah yang paling sering berkomentar di blog anda. Metode yang dipakai menggunakan feed dari blog yang diolah dengan bantuan aplikasi online pengolah RSS-feed milik Yahoo yaitu Yahoo Pipes.
Data para komentator tersebut muncul dengan jumlah tertentu, dimana agar nama komentator tersebut tampil, pemberi komentar harus menyertakan URL yang dimiliki, baik alamat blog, akun google, open ID dan beberapa akun lainnya.

Jika hanya menggunakan Anymous maka nama komentator dan jumlah komentarnya tidak akan ditampilkan. Contohnya Lihat pada gambar diatas.
Untuk membuat tampilan list ini ikuti langkah-langkah berikut :
Silahkan Blok dan Copy kode berikut

<script type="text/javascript">
function pipeCallback(obj) {
document.write("<ul>");
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write("</ul>");
}
</script>
<script src= "http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&
_id=33e2eb4dc25c7c21b9c586e11d2bc904&url=http%3A%2F%2FNamaBlog.blogspot.com&num=10" type="text/javascript"></script>

Silahkan anda Paste-kan pada sidebar dengan Add widget.

Ganti NamaBlog dengan nama blog Blog*Spot anda. Angka 10 menunjukkan jumlah dan nama yang memberikan komentar pada blog anda. Untuk merubah susunan list dari bullet menjadi urutan numbering anda bisa merubah <ul> menjadi <ol>. ul untuk bullet dan ol untuk numbering.

Selamat mencoba ..... !!

Read More >> View List Top Commentator

View Random Post Widget

Kini bagi anda pengguna layanan blog Blogger.com atau bagi anda yang memiliki blog di blogspot, anda bisa memasang random post atau widget untuk menampilkan beberapa artikel secara acak pada blog anda. Tujuan dari pembuatan widget ini adalah mengatasi rasa gundah blogger bahwa posting-posting terdahulu yang sudah tersimpan di arsip jarang sekali ditengok oleh para pengunjung blog. Bila ada posting baru, maka posting lama akan segera terabaikan. Begitulah seterusnya terjadi secara berulang-ulang.


Hingga akhirnya posting-posting lama tinggal kenangan saja... Sedih sekali. Padahal bisa jadi ada banyak posting-posting lama yang menarik untuk disimak...
Random Post Widget ini adalah beberapa posting atau artikel yang diambil secara acak dari keseluruhan posting anda (dengan jumlah maksimal 1000 posting) Sejumlah artikel tersebut kemudian ditampilkan dalam daftar artikel acak. Jadi, jika anda memiliki banyak artikel di blog anda, dan berharap setiap artikel tersebut dibaca oleh pengunjung, ada baiknya anda memasang widget random post ini.
Untuk diketahui, random post widget ini adalah penyempurnaan dari display random post with button seperti pada posting sebelumnya, baca disini
Oke sobat caranya mudah koq, ikuti langkah-langkah berikut :
Silahkan Blok dan Copy kode berikut

<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ul style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ul>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=ac99ebe0691031008a48d750fdbeaa67&url=http%3A%2F%2FNamaBlog.blogspot.com&num=10" type="text/javascript"></script>
<span style="font-size: 80%">Widget edited by <a href="http://www.deswan.co.nr">Deswan </a></span>

Silahkan anda Paste-kan pada sidebar dengan Add widget.

Ganti NamaBlog dengan nama blog Blog*Spot anda. Angka 10 menunjukkan jumlah artikel yang akan ditampilkan secara random. Untuk merubah susunan list dari bullet menjadi urutan numbering anda bisa merubah <ul> menjadi <ol>. ul untuk bullet dan ol untuk numbering.

Kode diatas dapat anda download disini Download Kode
Selamat mencoba ......!!

Read More >> View Random Post Widget