HTML Color Code Chart

Selected color code is:

Menyembunyikan Judul Header

Kali ini sebuah informasi baru sekaligus ilmu buat para blogger. Sedikit agak basi ataupun kurang menarik judul postingan ini, namun setidaknya sedikit berbagai ilmu saja buat semuanya, jikalau masih ada yang belum mengetahui berkatian dengan informasi ini.

Jika kita melirik postingan ini, memang kayanya agak sedikit kurang bermanfaat. Namun tujuan saya membuat tulisan ini yaitu sekedar berbagi informasi saja. dan mudah-mudahan bisa berguna.

Berikut script kode yang harus dimasukan.

display: none;
visibility: hidden;

Kode diatas diletakan pada bagian Site Title. Biar tidak bingung, cari kode dibawah seperti ini

#header h1 (

atau

sitetitle (

Dan letakkan setelah tanda kurung buka.

Jika ingin dimunculkan kembali, tinggal rubah kode css nya seperti dibawah ini

display: yes;
visibility: yes;

Membuat Background Posting

Dalam membuat background ada dua alternatif yaitu membuat background dengan warna dan membuat background dengan bantuan gambar, khusus untuk background dengan gambar terbagi lagi ke dalam beberapa teknik yaitu background gambar dengan teknik repeat (ada repeat, repeat-x, repeat-y) dan background gambar dengan teknik no-repeat (gambar backgroundnya memang ukuran besar).

• Membuat background dengan warna 

Agar warna background postingan bisa berbeda-beda setiap postingan, ada warna merah, hijau, ungu, kuning.

Ketika anda akan memulai untuk membuat postingan, pilih tab Edit HTML agar langsung kelihatan kode HTMLnya. jangan pilih Compose.

Awali postingan anda dengan kode seperti ini :  
<div style="background:kode_warna_disini;">
Dan diakhir postingan, harus di tutup dengan kode seperti ini : 
</div>

Catatan :
Ganti tulisan kode_warna_disini dengan kode warna yang anda inginkan. Sedikit tips yang masih bingung dengan kode warna, silahkan cari di sini.

Karena kode ini merupakan Style dari CSS, maka tentu saja bukan hanya warna background yang bisa anda tentukan, warna hurup, jenis hurup, perataan posting, dan lain-lain pun bisa anda tentukan. Sebagai contoh, jika postingan anda ingin berwarna background abu-abu, tulisan bisa rata kiri-kanan, besarnya hurup 120% dan padding sebesar 10 pixel :
dibawah ini contoh penulisannya :


<div style="background:#D9D7D7; text-align:justify; font-size:120%">
isi kantong postingan - isi tas postingan - isi perut postingan
isi kantong postingan - isi tas postingan - isi perut postingan
isi kantong postingan - isi tas postingan - isi perut postingan
</div>


Contoh jadinya paling tidak begini :

• Membuat background dengan Gambar

Jika postingan anda ingin mempunyai background berupa gambar, langkah pertama yang harus di ingat yaitu anda harus punya gambar yang akan di jadikan background (gambarnya kalo bisa transparant, yang bisa diedit di photoshop dulu atau program pengolah gambar lainnya). Trus gambar tersebut harus di upload ke hosting tempat menyimpan gambar. Bingung cara upload gambar ke hosting gratisan? anda bisa gunakan web hosting gratisan seperti picasaweb.google.com atau photobucket.com, anda daftar dulu selanjutnya anda dapat upload gambar-gambar yang anda punya untuk dijadikan album dan disimpan disitu. gratis tis,...

Ketika anda akan memulai untuk membuat postingan, pilih tab Edit HTML agar langsung kelihatan kode HTMLnya. jangan pilih Compose.

Awali postingan anda dengan kode seperti ini :  
<div style="background:url(alamat_gambar_disini) no-repeat;">
Dan diakhir postingan, harus di tutup dengan kode seperti ini : 
</div>
Catatan :
- alamat_gambar_disini ganti dengan alamat gambar yang ingin anda tampilkan. Penggunaan kode
- no-repeat digunakan bila gambar yang anda miliki sudah memiliki ukuran besar dan tidak mau di tampilkan berulang-ulang.

Seperti halnya pada background dengan warna, kode inipun bisa anda tambah-tambahin sesuai dengan keinginan.
untuk peletakkan batu pertama posisi gambar, anda bisa merubahnya sesuai keinginan anda bisa ditengah bawah, dipinggir kanan/kiri bawah/atas, ditengah-tengah, dan sebagainya, anda bisa menggunakan kode dan contoh penulisannya seperti dibawah ini.

<div style="background:url(http://i877.photobucket.com/albums/ab339/fiefa_class/ffforevertrans.png) no-repeat right top; text-align:justify; font-size:90%; padding:10px">
isi kantong postingan - isi tas postingan - isi perut postingan
isi kantong postingan - isi tas postingan - isi perut postingan
isi kantong postingan - isi tas postingan - isi perut postingan
</div>

Catatan :
- Ganti Url gambar dengan punya anda yang sudah anda gambar di buku gambar upload di webhosting yang telah ditunjuk oleh pemerintah diatas.
- Posisi gambar background bisa anda letakkan dimana saja dengan merubah,
right top menjadi right bottom menjadi left top menjadi left bottom dan menjadi jadi lainnya.

ini contoh jadinya :

Silahkan menjajal,........

Membuat Scroll Widget

Agar widget blog anda tidak memakan tempat, anda bisa membuat scroll pada widget tersebut. Nah, begini cara membuatnya.

1. Login ke Blogger anda.

2. Masuk Tata Letak/Rancangan > Edit HTML.

3. Backup dulu templatenya untuk menghindari kegagalan dalam hidup.

4. Cari kode seperti ini.

Code:

<b:widget id='HTML8' locked='false' title='' type='HTML'/>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
<b:widget id='HTML12' locked='false' title='' type='HTML'/>
<b:widget id='Followers1' locked='false' title='Followers' type='Followers'/>
<b:widget id='Text1' locked='false' title='Mp3freeDownload' type='Text'/>
<b:widget id='HTML20' locked='false' title='Feedjit' type='HTML'/>
<b:widget id='HTML21' locked='false' title='' type='HTML'/>
</b:section>
</div>

Nah, cari kode widget yang akan anda berikan scroll. Misalnya Feedjit Apabila judul widget tersebut adalah Feedjit, maka kodenya kira-kira seperti ini.

Code:

<b:widget id='HTML20' locked='false' title='Feedjit' type='HTML'/>

Kode title adalah judul dari widget. Apabila tidak diberi judul maka kodenya adalah title=''. Yang harus anda perhatikan dengan seksama adalah kode id='HTML20'. Perhatikan pada bagian HTML20. itu adalah id dari widget Feedjit.

Nah, lalu kita cari kode ]]></b:skin>. Nah, lalu ketikkan kode dibawah ini letakkan diatasnya.

Code:

#HTML20 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

Catatan : 
HTML20 Bisa diganti dengan id dari widget yang anda Cintai dan anda inginkan. Misalnya Label1 atau Followers1. Kalau sudah klik Simpan Template.
Tinggi yang di inginkan ganti dengan tinggi badan yang anda inginkan misal 200

Terakhir Klik Save/Simpan Template dilemari.

Selamat Menjajal,....
Tips dari Kang Rohman

Membuat Teks Berkedip ( blinking )

Bila di blog anda tulisan berkedip pasti akan lebih seru dan rame, seperti kunang-kunang dan seperti lampu pesawat, anda ingin punya tulisan FIFA OKE yang berkedip-kedip pada blog anda,

Caranya tidak susah kok anda tinggal menambahkan kode <blink> pada awal text yang anda inginkan dan </blink> pada akhir text di HTML seperti contoh di bawah ini:

<blink><a href="http://efisujanti.blogspot.com">FIFA</a></blink>

Catatan :

Teks berwarna hijau silakan ganti dengan alamat link web yang anda inginkan, dan teks FIFA bisa diganti dengan teks yang anda inginkan.

tinggal klik Save/Simpan dan tolong dilihat teks berkedip yang anda inginkan sudah jadi.

Selamat menjajal,.....

Pasang Recent Post Blog

Bagi blogger yang ingin pasang recent post di blog, supaya agar dan biar kelihatan  artikel terbarunya yang baru saja di posting.

caranya pasti gampang, login ke dasbor blog anda, masuk ke menu Rancangan trus menuju Elemen Laman terus Tambah Gadget pilih HTML/Javascript terus tolong dong copy dan paste kode Javascript dibawah ini,

Catatan : 

Boxwidth menunjukkan ukuran lebar widget. ( sesuaikan dengan ukuran sidebar blog anda)

Numposts menunjukkan jumlah posting yang ditampilkan. ( terserah anda tentukan jumlah posting yang  masuk ke recent post blog anda )

Home_page menunjukkan alamat blog anda. ( isi dengan alamat blog anda http://........ )

Kliklah Save/Simpan.

ini 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 = 470;

cellspacing = 3;

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 = 7;

home_page = "http://www.alamatblogmu.com/";

</script>

<script src="http://adipramana.googlecode.com/files/recentposts_thumbnail.js" type="text/javascript"></script>

Silakan mencoba,...........

Translator di Blog

Anda ingin belajar bahasa asing? gampang itu bisa diatur bila anda mau,. belajar bahasa asing gak harus kursus dengan biaya yang mahal, jika anda punya blog, dan belum ada fasilitas atau widget translator bahasanya, segeralah pasang widget tersebut, disamping menambah kecantikan blog anda, kita bisa belajar bahasa asing dan blog anda akan terlihat profesional serta bisa dibaca oleh penduduk diseluruh dunia dengan fasilitas translate bahasa ini.

Berikut cara memasang widget translator bahasa di blog anda :
Pertama silahkan Login user ID blog anda (http://www.blogger.com)
Masuk ke menu Rancangan setelah itu masuk ke Elemen Laman 
Klik Tambah Gadget pilih HTML/JavaScript
Copy dan pastekan kode dibawah ini di widget yang baru anda buka tersebut.

<div style="overflow:no; padding: 5px; background:no;"> <style> .google_translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; } .google_translate:hover img { filter:alpha(opacity=30); -moz-opacity: 0.30; opacity: 0.30; } .google_translatextra:hover img { filter:alpha(opacity=0.30); -moz-opacity: 0.30; opacity: 0.30; } </style> <center> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img border="0" alt="Arabic" style="cursor: pointer;margin-right:3px" src="http://i30.tinypic.com/ixdrev.jpg" title="Arabic" align="absbottom"/></a> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img border="0" alt="Korean" style="cursor: pointer;margin-right:3px" src="http://i31.tinypic.com/2yod011.jpg" title="Korean" align="absbottom"/></a> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img border="0" alt="Japanese" style="cursor: pointer;margin-right:3px" src="http://i29.tinypic.com/2yxn5lu.jpg" title="Japanese" align="absbottom"/></a> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img border="0" alt="Chinese Simplified" style="cursor: pointer;margin-right:3px" src="http://i29.tinypic.com/sm9l6e.jpg" title="Chinese Simplified" align="absbottom"/></a> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img border="0" alt="Russian" style="cursor: pointer;margin-right:3px" src="http://i26.tinypic.com/n8cjs.jpg" title="Russian" align="absbottom"/></a> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img border="0" alt="Portuguese" style="cursor: pointer;margin-right:0px" src="http://i29.tinypic.com/2w4bckz.jpg" title="Portuguese" align="absbottom"/></a> </center> <center> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img border="0" alt="English" style="cursor: pointer;margin-right:3px" src="http://i29.tinypic.com/30axu6u.jpg" title="English" align="absbottom"/></a> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img border="0" alt="French" style="cursor: pointer;margin-right:3px" src="http://i25.tinypic.com/nnslrn.jpg" title="French" align="absbottom"/></a> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img border="0" alt="German" style="cursor: pointer;margin-right:3px" src="http://i32.tinypic.com/2ni07q9.jpg" title="German" align="absbottom"/></a> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img border="0" alt="Spain" style="cursor: pointer;margin-right:3px" src="http://i31.tinypic.com/2h6qzhy.jpg" title="Spain" align="absbottom"/></a> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img border="0" alt="Italian" style="cursor: pointer;margin-right:3px" src="http://i28.tinypic.com/281x3c8.jpg" title="Italian" align="absbottom"/></a> <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img border="0" alt="Dutch" style="cursor: pointer;margin-right:0px" src="http://i25.tinypic.com/9knyjd.jpg" title="Dutch" align="absbottom"/></a> </center></div> Untuk Kode pagar yang berwarna merah, silahkan diganti dengan alamat blog/web anda. Klik save/simpan, dan lihat hasilnya. Hore,..terlihat bendera translator bergerak/berkibar,, Selamat mencoba,...........

Tulisan Berjalan di Blog

Mungkin saat melihat blog teman- teman kadang menemui blog yang teks atau gambar banernya bisa bergerak-gerak. Dan ini menimbulkan pertanyaan di hati anda semua, “ Bagaimana yah cara membuatnya?

dari pada penasaran mari kita bongkar rahasia teks bergerak tersebut. Rahasianya yaitu “ Marque “.

Marquee merupakan kumpulan kode HTML yang jika diterjemahkan dalam bahasa web browser akan membentuk suatu animasi berupa teks atau image yang bergerak atau berjalan.

Karena pokok bahasannya adalah “marquee”, maka kode HTML-nya pun marquee, yakni <marquee> … </marquee>.

Untuk lebih memahami tentang marquee (teks bergerak atau berjalan), mari bersama-sama kita telusuri trik blogger dengan menggunakan kode HTML marquee tersebut.
Berikut beberapa contoh kode teks berjalan (marquee) :

<marquee>Contoh teks ini menggunakan marquee default</marquee>

hasilnya :

Contoh teks ini menggunakan marquee default

<marquee direction=”right”>Teks bergerak ke kanan</marquee>

hasilnya :
Teks bergerak ke kanan
Catatan : “direction” merupakan kode yang berfungsi untuk menentukan arah gerakan teks atau image. Atributnya adalah left, right, up, dan down.

<marquee direction=”up” height=”50″ width=”50%”>Teks berjalan ke atas yang dibatasi area tertentu</marquee>

Teks berjalan ke atas yang dibatasi area tertentu

Catatan : “height” dan “width” berfungsi untuk menentukan tinggi serta lebar area marquee yang digunakan oleh teks, atributnya berupa nilai angka atau prosen (%).

<marquee bgcolor=”#f2f5a9″ scrolldelay=”2000″ direction=”down” scrollmount=”2″ height=”50″ width=”75%”>Teks di kiri berjalan ke bawah dgn waktu tunda 2 detik, berkecepatan tertentu yang dibatasi area tertentu pula</marquee>

Teks di kiri berjalan ke bawah dgn waktu tunda 2 detik, berkecepatan tertentu yang dibatasi area tertentu pula

Catatan : “scrolldelay” berfungsi mengatur waktu tunda, atributnya adalah angka per-mili detik. Sedangkan “scrollmount” digunakan untuk mengatur kecepatan gerakan teks, atributnya berupa angka. Semakin besar angka, maka semakin cepat gerakannya.

<marquee bgcolor=”#cecef6″ scrollmount=”2″>Teks berkecepatan tertentu dengan menggunakan latar warna biru muda</marquee>

Teks berkecepatan tertentu dengan menggunakan latar warna biru muda

Catatan : “bgcolor” mempunyai fungsi memberikan warna latar teks, atributnya adalah kode warna.

<marquee bgcolor=”#f2f5a9″ loop=”4″>Teks 4x berjalan, kemudian hilang</marquee>

Teks 4x berjalan, kemudian hilang

<marquee bgcolor=”#cecef6″ loop=”4″ behavior=”slide”>Teks 4x berjalan, kemudian berhenti</marquee>

Teks 4x berjalan, kemudian berhenti

Catatan : “loop” mempunyai fungsi mengatur jumlah gerakan, atributnya adalah angka. Semakin besar nilainya, maka semakin banyak pula gerakannya. Biasanya kode loop diikuti dengan kode behavior=”slide”, agar teks tidak hilang.

<marquee hspace=”25″ width=”25%” bgcolor=yellow><p>Teks berjalan</p>dan berjarak horizontal</marquee>

Teks berjalan
dan berjarak horizontal

<marquee vspace=”25″ width=”25%” bgcolor=yellow><p>Teks berjalan</p>dan berjarak vertikal</marquee>

Teks berjalan
dan berjarak vertikal

Catatan : “hspace” berguna mengatur jarak marquee dengan teks atau tepi elemen secara horizontal, atributnya adalah angka. Sedangkan “vspace” berfungsi untuk mengatur jarak marquee dengan teks atau tepi elemen secara vertikal, atributnya angka juga. Semakin besar nilainya, maka semakin besar jaraknya.

<marquee behavior=”alternate”>Teks ini akan berjalan bolak-balik</marquee>

Teks ini akan berjalan bolak-balik

Catatan : “behavior” berfungsi untuk mengatur perilaku gerakan teks dgn atribut yang mengikutinya seperti scroll (gerakan default ke kiri), slide (bergerak sekali lalu berhenti), dan alternate (bolak-balik).

Nah, sekarang bagaimana jika anda ingin memasukkan jenis huruf (font-family) dan warna huruf (color). Kamu tinggal menambahkan kode <span> … </span> diantara kode marquee, singkat kodenya seperti di bawah ini.

<span style=”font-family:arial;color:#0000ff;”><marquee bgcolor=”#f2f5a9″ direction=”down” behavior=”alternate” scrollamount=”10″ height=”100″ width=”50&”>Teks arial warna biru</marquee></span>

Teks arial warna biru

Kalau anda ingin yang berjalan bukan teks, melainkan image maka tinggal mengganti teks yang berwarna merah dengan alamat penyimpanan file gambar anda.

<marquee><img src=”http://i647.photobucket.com/albums/uu191/ariamsi/powered-by.jpg”/></marquee>

Catatan : Kode warna merah merupakan teks yang dimasukkan dalam kode marquee.

Dan masih banyak lagi variasi kode yang dapat anda optimasi, sehingga sesuai dengan tipe dan karakteristik elemen di bloganda . Point pentingnya adalah jangan tidak pernah mencoba, karena anda nanti  tidak akan pernah pula tahu arti dan maknanya.

Selamat mencoba ,.....
Copy http://suhendi.com

Mengganti Logo Blogger

Jika kita membuat sebuah blog baru dari blogger.com maka logo favicon.ico nya yaitu default milik blogger yang berupa huruf "B" (Coba lihat di address bar).

Agar blog yang kita buat terlihat lebih menarik dan agar blog yang kita  punya mempunyai  logo sendiri yang kita buat sendiri pula, maka logo blogger tersebut dapat kita ganti dengan logo kita sendiri.
Langkah-langkahnya untuk mengganti logo blogger yaitu sebagai berikut : 

• Siapkan gambar atau foto yang akan dijadikan logo kita, bisa mendesain dengan Adobe Photosop, ataupun corel draw.

• Resize gambar yang telah disiapkan menjadi ukuran 50 x 50 pixels dan simpan dengan format gif, png, ataupun jpeg

• Upload gambar yang sudah jadi, ke situs penyedia layanan penyimpanan gambar. diantaranya Picassaweb.google ataupun Photobucket.com dan masih banyak lagi yang lainnya. jika kita belum punya akun, di haruskan mendaftar dulu. setelah upload, kita ambil Link dari album kita yang ada di photobucket.com. dibawah ini contoh link gambar dari Photobucket.com.

          
         http://i877.photobucket.com/albums/ab339/fiefa_class/BLOG.png 

         

• Setelah itu, login ke account blogger anda, masuk ke Tata Letak dan pilih edit html. kemudian cari kode seperti dibawah ini supaya lebih cepat gunakan ctrl + F untuk mencari. 

         <b:skin><![CDATA]

• Kemudian, letakkan kode gambar bawah ini diatas kode tersebut atau sebelum kode tersebut. 

         
         <link href='http://i877.photobucket.com/
         albums/ab339/fiefa_class/BLOG.png' rel='shortcut icon'/>

 

Kode warna ungu tersebut dapat diganti dengan kode gambar milik anda bisa diambil dari picassaweb.google.com maupun di photobucket.com dan layanan situs penyedia penyimpanan gambar lainnya.

untuk lebih jelasnya lihat gambar di bawah ini :

       
         <link href='http://i877.photobucket.com/albums/ab339/fiefa_class/
         BLOG.png' rel='shortcut icon'/>
         <b:skin><![CDATA[/* 

• Setelah itu simpan template, dan lihat perubahannya

Selamat Mencoba

Posisi widget ditengah sidebar

Sewaktu kita menambahkan suatu widget di sidebar diblog kita entah itu iklan, gambar,

kadang widget tersebut posisinya menempel disebelah kiri atau tidak berada ditengah-tengah dari sidebar. seperti gambar dibawah ini :

Bagaimana kita mengatasi hal tersebut ? pernah saya dibuat merasa puyeng karena hal tersebut, karena kelihatan tidak sedap dipandang mata karena widget kita yang kelihatan melenceng dari posisi tengah sidebar.

pernah saya ganti berulang-ulang dengan kode html gambar atau kode html lainnya namun hasilnya tidak berubah.

Akhirnya baru saya mengerti bahwa harus ada sesuatu kode yang harus ditambahkan pada kode script widget tersebut. kita perlu menambah kode <center> dan kode </center>.

adapun rinciannya Kode <center> sebagai pembuka, dan kode </center> sebagai kode penutup.

Jika anda bingung,. ikuti langkah-langkahnya dibawah ini :

1. Masuk ke halaman dasbor blog milik anda lalu klik Rancangan.

2. Lalu masuk ke Elemen Laman.

3. Cari Bok Widget yang mau di perbaiki posisinya. klik Edit.

4. Setelah halamannya terbuka, letakkan Kode <center> sebelum kode widget tersebut, dan kode </center> diakhir kode widget tersebut. contoh penulisannya sebagai berikut :

<center>
<a href="http://s877.photobucket.com/albums/ab339/fiefa_class/?action=view&current=fifaoke-1.gif" target="_blank"><img src="http://i877.photobucket.com/albums/ab339/fiefa_class/fifaoke-1.gif" border="0" alt="Photobucket" /></a>
</center>

5. Jika sudah, Klik simpan/Save dan tunggu hingga proses selesai.
6. Hasilnya akan tampak seperti dibawah ini.

Selamat mencoba,....

Situs Penyedia Blog Gratis

1. http://www.aeonity.com/
2. http://id.blog.com/
3. http://www.bloxster.net/portal.php
4. http://www.blogger.com/start
5. http://blogdrive.com/
6. http://www.blogsome.com/
7. http://blogthing.com/
8. http://www.blogomonster.com/blogo.php
9. http://free-blog-site.com/
10. http://www.ebloggy.com/
11. http://enewsblog.com/
12. http://friendsterblogs.friendster.com/
13. http://friendcircles.com/
14. http://gobloglah.com/
15. http://www.journalhome.com/
16. http://journalspace.com/
17. http://joeuser.com/
18. http://lifewithchrist.org/
19. http://www.livejournal.com/
20. http://modblog.com/
21. http://www.motime.com/
22. http://spaces.msn.com/
23. http://myblog.com/
24. http://multiply.com/
25. http://www.myspace.com/
26. http://www.tabulas.com/
27. http://tblog.com/
28. http://www.weblogpage.com/home.php
29. http://wordpress.com/
30. http://www.xanga.com/
31. http://www.blogspirit.com/en/index.php
32. http://360.yahoo.com/