Bagaimana cara memasang script iklan kliksaya di zona header blogspot

Oke kali ini saya ingin berbagi mengenai cara memasang script iklan kliksaya di bagian header blogspot. Sudah tahukan kalau kliksaya.com menyediakan fitur terbarunya berupa iklan zone header yang powerfull. Jadi bila teman-teman sudah menjadi anggota kliksaya nggak ada salahnya mencoba fitur ini.

Apa sih manfaatnya?

Dengan memasang iklan di bagian header sebuah blog, akan membuat pendapatan Pay Per Click (PPC) kita meningkat secara drastis. Seperti yang pernah saya alami. Pendapatan saya bisa meningkat dua kali lipat dari iklan header ini bila dibandingkan dengan sebelumnya yang tanpa zona header. Lumayan kan....? he..he..he

Terus gimana cara pasangnya ya? Sebenarnya gampang kok caranya. Baca terus ya...

Untuk memasang sebuah script adsense atau iklan ppc di bagian header, anda bisa mengikuti beberapa langkah berikut:

1. Anda login ke dashboard anda. Kemudian cari menu 'design' - 'edit html'.
2. Jangan lupa untuk mendownload dulu template anda untuk 'back up' bila ada kesalahan dalam pemasangan. Caranya klik di bagian "download full template".



3. Setelah selesai, langkah selanjutnya adalah centang "Expand Widget Templates".




4. Cari kode dibawah ini dengan bantuan tombol 'ctrl+F'

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

Mungkin saja tiap template memakai kode yang berbeda. Intinya carilah kode yang mirip kode tersebut di template blogspot anda.

5. Setelah ketemu anda rubah sedikit kodenya.

maxwidgets='1' showaddelement='no'

menjadi :

maxwidgets='2' showaddelement='yes'

Jadi cuma beda angka dan keterangan yes atau no.

6. Setelah itu klik simpan template. Berati widged di atas header sudah jadi.




7. Tinggal memasukkan script dari kliksaya ke kolom widged yang ada diatas header blog kita.

Caranya : Masuk ke bagian 'design'- 'page elements'. Pilih widged yang ada diatas header. Kemudian anda pilih html. Silahkan copy paste kode script disini. Jangan lupa klik save atau simpan.

Demikian cara memasang kode script iklan kliksaya di header blogspot, selamat mencoba semoga berhasil.

Cara membuat tabel di blogspot tanpa kode html

Bagaimana sih cara buat tabel di blogspot? Biasanya kita menggunakan kode HTML tertentu untuk membuat tabel. Sebenarnya ada cara yang gampang lho untuk membuat tabel di blogspot. Yaitu dengan memanfaatkan MS Words.


Pertama-tama anda buat tabel di MS Words seperti biasa. Anda tentukan jumlah kolom dan baris nya. Kemudian and amsukkan artikel atau gambar ke dalam kolom tabel tersebut. Hal ini untuk memudahkan kita nanti mengganti gambar yang sebenarnya. Sehingga tabel yang terjadi nanti bisa sama ukurannya dan rapi.

Nah setelah itu anda copy paste tabel tersebut ke dalam posting di blog anda. Tapi ingat, pakai mode yang visual ya...jangan pakai mode yang html. Lihat gambar di bawah ini:




Setelah di copy maka akan tampil tabel dan image gambar yang rusak seperti terlihat diatas. Image inilah yang harus anda ganti dengan gambar yang sebenarnya. Anda tinggal copy dari website yang ada gambarnya terus paste di bagian gambar. Setelah selesai hapus aja gambar yang rusak sebelumnya.

Demikian tips membuat tabel di blogspot selamat mencoba.

Download template blogger gratis dan bagus

Innovation Live Demo Download Theme	Mobile Gadget Live Demo Download Theme
Stoxi Live Demo Download Theme	Magic Bean Live Demo Download Theme
Artarius Live Demo Download Theme	Zonaruto Live Demo Download Theme
Dione Live Demo Download Theme	MMOStar Live Demo Download Theme

Free Template blogger : This is my favorite

Untuk membuat blog yang bagus...pemilihan template yang sesuai dan menarik amat disarankan. Untuk itu gunakanlah waktu anda sebaik mungkin untuk mencari desain template yang paling anda sukai dan sesuai temanya. Untuk tema bisnis sebaiknya anda menggunakan warna yang soft dan tidak terlalu ramai.

Salah satu penyedia template bagus dan gratis adalah colorizedtemplate.com. Berikut adalah beberapa template yang bagus yang saya kutip dari corizedtemplate.com. Sedangkan untuk pilihan yang lebih banyak lagi silahkan kunjungi website nya.

B Tube Advantage

Press Magajah

Cameo

Column Magazine White

Portal Magajah

Column Magazine Dark

Cara pasang artikel favorit di blogger

Ada pengunjung blog ini yang menanyakan bagaimana caranya menampilkan artikel favorit atau entri popular. Biasanya saya menggunakan script seperti yang telah saya sampaikan disini. Namun akhir-akhir ini sepertinya banyak yang nggak berhasil dengan script tersebut. Kemungkinan ini disebabkan pemilihan template yang nggak sesuai dengan scriptnya. Karena saya masih pakai sciprt itu di blog kebahagiaan terbesar ini. Solusinya gimana..?

Tenang...sekarang blogger sudah menyediakan widged khusus entri popular atau artikel favorit. Tinggal mengaktifkan aja selesai. Berikut langkah-langkah mengaktifkan entri popular atau artikel favorit di blogger:

1. Buka dasboard blog anda.



2. Cari menu 'rancangan' -'elemen halaman'-'tambah gadged'



3. anda cari 'entri popular'



4. jangan lupa simpan.



Anda bisa mengatur mau ditampilkan judulnya saja atau dengan diskripsinya. Kalau judulnya saja ..hilangkan tanda centangnya.

Selamat mencoba

Cara menampilkan judul saja di halaman posting atau label di blogspot

Bagi teman-teman yang sudah mempunyai blog dengan artikel yang sangat banyak...nggak ada salahnya mencoba trik ini. Dengan memakai trik ini ...maka setiap di klik label maka yang akan tampil hanya judul nya saja. Hal ini memudahkan pembaca untuk melihat-lihat posting yang dicari. Dan loadingnya pun menjadi cepat. Coba bayangkan bila satu label ada 100 posting...terus diklik...tampil semua isi posting label tersebut...kan bisa lama banget loadingnya. Langsung aja caranya sebagai berikut:

1. anda masuk ke dashboard anda. Pilih Rancangan-edit html.
2. Kemudian anda klik expand widged.
3. Anda cari kode berikut:

<b:include data='post' name='post'/>

4. Setelah ketemu kemudian anda ganti kode tersebut dengan kode di bawah ini:

<b:if cond='data:blog.homepageUrl !=
data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<data:post.title/></a><br/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

5. Kemudian klik save template.

Selamat mencoba semoga berhasil.

Cara pasang artikel favorit di blogspot

Kali ini saya akan berbagi tips bagaimana cara memasang artikel paling favorit atau top article di blog kita. Mengapa perlu dipasang artikel favorit...? Karena hal ini akan memudahkan pengunjung untuk menjelajahi blog kita dan mengetahui info favorit dalam blog kita. Ujung-ujungnya akan meningkatkan page views di blog kita.

Caranya sebenarnya mudah banget kok. Tinggal copy kode html di bawah ini ke dalam widget blogspot anda. Kemudian ubah beberapa setting disesuaikan dengan alamat blog anda.

Langkah-langkahnya :
1. Login ke blogger.
2. Pilih lay out atau tata letak.
3. Klik tambah widged atau add widged
4. Pilih HTML / java script
5. Copy paste script 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=ff855e4f4d4a10fde1c2eb32074f99cd&url=http%3A%2F%2Fdidiksugiarto.com&num=10" type="text/javascript"></script>
<span style="gt;Widget edited by <a href="http://didiksugiarto.com" target="_blank">Didik Sugiarto</a></span>

6. Gantilah alamat yang di blok merah 'didiksugiarto.com' tersebut dengan alamat blog anda.
7. Kemudian klik save.

Demikian tips memasang top article di blogspot ...selamat mencoba...

Cara menampilkan posting acak di blogspot

Kali ini aku ingin berbagi tentang cara menampilkan posting secara acak di blog kita. Apa gunanya ya..? Sebenarnya banyak lho gunanya...antara lain bila kita nggak bisa update blog kita setiap hari...maka artikel nya bisa ditampilkan secara berubah-ubah...sehingga kelihatannya selalu di update....padahal cuman diacak.

Oke..caranya gimana ya..?

Pertama-tama anda copy kode berikut kemudian masukkan ke menu widget pilih kode html.

<script type="text/javascript">

var acakarray = new Array();var l=0;var flag;

var numofpost=5;function randomposts(json){

var total = parseInt(json.feed.openSearch$totalResults.$t,10);

for(i=0;i < numofpost;){flag=0;acakarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in acakarray){if(l==acakarray[j]){ flag=1;}}

if(flag==0&&l!=0){acakarray[i++]=l;}}document.write('<ul>');

for(n in acakarray){ var p=acakarray[n];var entry=json.feed.entry[p-1];

for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";

document.write(item);}}

}document.write('</ul>');}

</script>

<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>

Nah...sekarang sudah jadi artikel acak anda...selamat mencoba...

Cara Mudah membuat daftar isi di blogspot

Setelah beberapa kali mencoba daftar isi ...akhirnya ketemu juga cara yang paling mudah untuk membuat daftar isi. Nggak perlu pakai pasang script ataupun modifikasi template kita. Sekali dibuka langsung tampil semua posting yang ada di blog. Gimana ya caranya...?

Sebenarnya ini lebih disebut daftar arsip blog. KArena memanfaatkan fitur daftar arsip yang biasanya sudah otomatis tersedia di blogger. NAh bagi yang belum mengaktifkannya saya anjurkan untuk mengaktifkannya lebih dulu. Caranya masuk ke menu rancangan-edit laman-tambah gadget. Kemudian anda pilih arsip blog.

Nah nati akan muncul daftar arsip di blog anda dengan pilihan sesuai yang anda setting di awal. Bisa tiap bulan atau tiap minggu. Anda klik bulannya sehingga muncul semua artikel dalam bulan itu. Setelah itu anda copy seperti copy words.

Langkah selanjutnya anda membuat posting seperti biasa tetapi pakai mode tulis(bukan :edit html). Otomatis semua daftar isi akan masuk di posting anda lengkap dengan link url nya.

Setelah jadi posting jangan lupa untuk mengubah tanggal entri menjadi tanggal pertama kali posting anda...agar nggak muncul di depan.

Tugas anda selanjutnya adalah menghubungkan link url posting daftar isi dengan menu daftar isi yang ada di menu horizontal.

Demikian tips membuat daftar isi manual di blogspot...semoga bermanfaat.

Bagaimana cara membuat menu horizontal di blogspot ya...?

Teman-teman tentu pernah melihatkan ..menu horizontal yang biasa dipakai oleh para blogger yang biasa ditampilkan di bagian atas dari sebuah blog. Biasanya berisi : home, about, daftar isi, dll....tergantung para blogger semua. Bisa dilihat di blog kebahagiaan terbesar ini ya...seperti gambar di bawah ini:




Oke kali ini saya akan berbagi bagaimana cara paling mudah untuk membuat menu horisontal di blogger. Kenapa blogger...? Karena kalau pakai wordpress...hal itu sudah otomatis...sehingga sangat mudah. Tapi bagi pemakai blogger atau blogspot...perlu sedikit modifikasi di templatenya...Nggak susah kok.

Pertama-tama masuk ke dasboard blog anda. Pilih rancangan-edit html- dan jangan lupa centang bagian -Expand Template Widget-. Anda bisa mendownload template lengkap dulu untuk jaga-jaga bila ada kesalahan dalam edit nanti.

Setelah itu anda cari kode ]]></b:skin> atau untuk lebih mudahnya pakai (Crtl+ F) kemudian akan muncul menu find. Anda masukkan kode diatas agar lebih mudah ditemukan. Setelah ketemu anda copy paste kode html di bawah ini . Kode ini harus anda letakkan tepat diatas kode ]]></b:skin>

/*-- (Menu/Nav) --*/
#nav{background:#222; height:32px; padding:4px 0 0; margin-bottom:0px}
#nav-left{float:left; display:inline; width:600px}
#nav-right{float:right; display:inline; width:100px}
#nav ul{position:relative; overflow:hidden; padding-left:0px; margin:0; font:1.0em Arial,Helvetica,sans-serif}
#nav ul li{float:left; list-style:none}
#nav ul li a, #nav ul li a:visited{display:block; color:#fff; margin:0 5px; padding:5px 4px; text-decoration:none}
#nav ul li a:hover{color:#800000; background-color:#fff; margin:0 5px; padding:5px 4px}
#nav ul li a.current, #nav ul li a.current:visited, #nav ul li a.current:hover{margin:0 8px; background-color:#fff; color:#fff; padding:5px 7px}

Anda bisa mengganti lebar menu dan warna-warnanya disesuaikan dengan warna dasar blog anda. Ubahlah yang ada di warna merah.

Kemudian cari kode

<div id='outer-wrapper'><div id='wrap2'>

dan copy paste kode berikut tepat dibawah kode tersebut:

<div id='nav'>
<b:section class='header-tabs' id='header-tabs' preferred='yes' showaddelement='no'>
<b:widget id='LinkList1' locked='true' title='Top Tabs' type='LinkList'>
<b:includable id='main'>
<div class='widget-content'>
<b:if cond='data:title'/>
<div id='nav-left'>
<ul>
<li><a href='/'>Home</a></li>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
</div>
</div>

Setelah itu anda ganti link urlnya dengan alamat yang anda inginkan. Untuk menambahkan link url ...anda bisa meng copy paste dari link sebelumnya. Dibagian yang berwarna merah...anda bisa ganti alamat urlnya..dan nama menu nya. Misalnya home atau about..terserah anda.

Selesai edit urlnya...jangan lupa untuk tekan save template.

Oh ya di kode ini saya hilangkan search nya atau kotak pencarian. Karena biasanya teman-teman sudah memakai kotak pencaraian terlebih dahulu.

Demikian tips membuat menu horizontal di blogger kali ini semoga bermanfaat....

Cara Mudah menampilkan tv di blog kita

Bagi teman-teman yang ingin menampilkan tv di blognya bisa dicoba cara berikut. Gampang banget kok...tinggal copy paste aja. Pertama anda buka dulu website tv nya misalnya tv one di http://video.tvone.co.id/streaming. Setelah itu pilih Ch default.

Nah langkah berikutnya di blok aja gambar tv nya seperti mau copy artikel di words dari batas atas gambar video tv nya sampai batas bawah nya pakai cursor. Cara copy paste nya: gerakkan cursor dari atas kebawah...kemudian klik 'ctrl' dan 'C' bersamaan. Nanti kalau mau paste juga hampir sama klik"ctrl" dan "V" secara bersamaan di bagian posting blog anda.Tapi ingat pakai mode tulis bukan mode html. Terus kalau mau lihat hasilnya pakai preview saja.

Selamat mencoba....

Bagaimana mengatasi video tidak jalan di blog kita...?

Sudah tahukan untuk mengambil kode embed atau untuk emnampilkan video di blogger kita harus mengambil kode embed dari video sumbernya..semacam youtube dan lain-lain. Namun kadang-kadang kode yang diberikan nggak lengkap...sehingga ketika kita kopi ke blog kita..maka akan timbul error atau tanda html nggaksempurna. Gimana cara mengatasinya...?

Sebelumnya saya juga pernah mengalami masalah seperti itu. Ketika mengambil video dari sctv..tentang sekolah sepakbola kungfu di China. disitu nggak disebutkan embed nya. Ya..terpaksa cari diwebsite lain yang menampilkan kode embed dari video tersebut.

setelah ketemu...langsung saja saya copy...eeh ternyata nggak mau tampil. setelah saya amati...ternyata ada kode yang belum lengkap yaitu kode penutup dari embed tersebut. Akhirnya saya tambahi kode penutup embed...dan selesailah masalhnya. Sekarang video bisa tampil di blog kebahagiaan terbesar ini.

Kode sebelumnya adalah seperti di bawah ini:

<embed src='http://video.liputan6.com/libs/jwplayer/player-licensed-viral.swf' height='360' width='480' allowscriptaccess='always' allowfullscreen='true' flashvars='repeat=list&autostart=true&file=http%3A%2F%2Fvideo.liputan6.com%2Fmrss.php%3Fprogram%3Dnews%26id%3D255848%26m_id%3D906061&plugins=viral-1d'/>

terlihat di bagian akhir belum ada kode penutup embed. Kemudian saya tambahkan kode penutup embed

</embed>

Setelah itu video bisa tampil sempurna di blog ini.

Cara membuat teks berjalan di blogger

Membuat teks berjalan di blogger sebenarnya sangat mudah. Tinggal copy paste aja kode html nya kemudian dimodifikasi sesuai keinginan kita.

Oke..kali ini saya ingin berbagi tips bagaimana caranya membuat marquee atau teks berjalan di blog.

Ada beberapa bagian yang perlu anda ketahui tentang marquee ini antara lain :

1. Kode HTML umumnya menggunakan tag <marquee>...</marquee>
2. BGCOLOR="warna" --> Untuk mengatur warna background (latar belakang) teks
3. DIRECTION="left/right/up/down" --> Mengatur arah gerakan teks
4. BEHAVIOR="scroll/slide/alternate" --> Untuk mengatur perilaku gerakan. Ada 3 macam variasi yaitu:
*Scroll --> teks bergerak terus-menerus tanpa berhenti
*Slide--> teks bergerak sekali lalu berhenti
*Alternate --> teks bergerak bolak-balik

5. TITLE='pesan" --> Pesan akan muncul saat mouse berada di atas teks
6. SCROLLMOUNT="angka" --> mengatur kecepatan gerakan dalam pixel, semakin besar angka semajin cepat gerakannya.
7. SCROLLDELAY="angka" --> Untuk mengatur waktu tunda gerakan dalam mili detik
8. LOOP="angka|-1|infinite" --> Mengatur jumlah loop
9. WIDTH="lebar" --> Mengatur lebar blok teks dalam pixel atau persen

Biar lebih gampang saya berikan contoh aja ya..

Sebagai contoh anda bisa lihat teks berjalan di blog ini sebelah kanan atas. Kode html nya adalah sebagai berikut:

<div align="left"><font face="georgia" color="White"><b><marquee bgcolor="green" width="90%" scrollamount="3" behavior="scroll">

Terima Kasih telah mengunjungi blog kebahagiaan terbesar ini

</marquee></b></font></div>

hasilnya seperti

Terima Kasih telah mengunjungi blog kebahagiaan terbesar ini

Anda bisa mengubah tulisannya sesuai dengan keinginan anda. Kemudian untukmengubah warna back ground silahkan ubah di bagian bgcolor. Untuk mengubah kecepatan di bagian scrollamount, dan untuk mengubah variasi teks mau bolak-balik atau berjalan di bagian behavior. Variasi ini ada 3 pilihan yaitu: alternate, scroll, slide.

atau contoh yang lain :

<marquee align="center" direction="left" height="5" scrollamount="2" width="90%">

Siapapun Anda bisa bahagia...asal mau bersyukur...
</marquee>

nanti hasilnya seperti ini:



Siapapun Anda bisa bahagia...asal mau bersyukur...






Untuk membuat teks berjalan dengan link anda bisa gunakan kode

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">

<a href="http://didiksugiarto.com" target="new">Kebahagiaan Terbesar</a><br/>
<a href="http://iklanbarispromo.com" target="new">Pasang Iklan Baris </a><br/>
<a href="http://inginbahagia.com" target="new">Belajar Bisnis Online Pemula </a><br/>
</marquee>

nanti hasilnya seperti di bawah ini. Anda tinggal edit link urlnya.


Kebahagiaan Terbesar

Pasang Iklan Baris

Belajar Bisnis Online Pemula



Selamat mencoba...semoga berhasil....

Cara pasang become fan facebook di blogger gimana ya...?

Setelah sempat beberapa kali mencoba tutorial cara memasang become fans seperti di facebook...akhirnya ketemu juga dengan cara yang benar. Sebenarnya bukan salah sih..cuman sudah ada beberapa perubahan menu di facebook...sehingga beberapa panduan yang ada ...sudah tidak sesuai lagi. So...kali ini saya ingin berbagi bagaimana caranya membuat become fan di blogger.


Langkah Pertama : Buatlah facebook page sesuai dengan blog anda. Misalnya : Bisnis Online Terbaik. Caranya :

1. Masuk ke facebook advertising/page atau klik disini . Kemudian creat a page.



Kemudian ada 3 pilihan..anda pilih yang kedua :brand, product, organization.

2. Beri nama sesuai dengan nama blog anda. Centang autorized.Creat official pages.
3. Facebook page sudah jadi.



Langkah kedua : membuat become fan di blogger anda.
1. Anda masuk di wall facebook page yang sudah anda buat diatas. Biasanya otomatis.
2. Anda cari edit page di bawah gambar.




3.Carilah menu promote yaour page. Kemudian klik promote with a like box. Letaknya disebelah kanan agak bawah. Diatas gambar admins.




4. Kemudian akan muncul gambar seperti di bawah ini. Ini adalah contoh like box. tugas anda adalah mengganti Id yang ada di kotak id dengan id anda sendiri. Caranya lihat di bagian browser dan copy aja angka yang tertera di sana.





5. Setelah Id anda ganti..tunggu sebentar proses baru berjalan. Kemudian kotak box akan berganti sesuai dengan like box anda.




6. Tinggal klik get code anda ambil code yang pertama terus anda copy paste ke blogger anda.

Kotak become fan di blogger sudah jadi ...selamat mencoba

Cara pasang tombol like di blogger

Kali ini saya ingin berbagi tentang bagaimana caranya memasang tombol like seperti di facebook di blog kita yang berplatform blogspot atau blogger. Apa sih gunanya ...? Ya agar pembaca lebih mudah untuk menshare sebuah artikel yang bagus menurut mereka ke teman-teman nya yang lain di facebook. Sehingga bisa meningkatkan traffic blog kita.

Untuk menampilkan tombol like di blogger ada beberapa langkah yang perlu anda lakukan. Diantaranya mengubah setting html. Caranya:

1. Login ke blogger anda. Cari menu tata-letak terus klik edit html. Jangan lupa untuk backup template anda terlebih dahulu.

2. Centang expand widged kemudian cari kode

<data:post.body/> di template anda. Sudah tahukan cara mudah menemukan kode html di blogger. Yaitu dengan control F kemudian anda pastekan kode yang mau dicari.

3. Langkah berikutnya adalah copy paste kode berikut di bawah kode tersebut diatas:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>

Tombol like sudah jadi di blog anda...

Selamat mencoba...

Bagaimana cara membuat label atau kategori di blogspot..?

Setelah sempat berkunjung ke blog keponakan....lho kok nggak ada label atau kategorinya ya...? Akhirnya aku modifikasi sedikit agar bisa tampil label dan kategorinya. Serta aku pasang beberapa widged untuk emngetahui jumlah kunjungannya seperti sitemeter dan histat. Biar bisa dilihat pengunjung yang datang jumlahnya berapa dan memakai kata kunci apa aja mereka datang ke blog kita. Ya..kurang lebih 1 jam..selesai deh.

Oh ya...gimana cara membuat label di blogspot ya...? Pertama anda posting biasa namun diakhir posting jangan lupa untuk mengisi label. Setelah itu terbitkan entri...Jadi deh label atau kategori di blog anda. Lihat gambar berikut:



Selamat mencoba...

Inilah Cara membackup data blog di blogger...

Beberapa waktu yang lalu saya jalan-jalan ke blog sahabat. Diantaranya blognya blogger senior kang rohman. Nah disitu dibahas tentang beberapa blognya Kang Rohman yang di banned atau dihapus oleh google. Padahal blognya sudah mempunyai rating bagus. Dan juga english version...jadi bisa untuk jualan adsense google. Sayangkan..bila blog sudah sebagus itu...dihapus tanpa pemberitahuan sebelumnya...?

Nah..bagi teman-teman yang sudah mempunyai blog yang cukup ramai...nggak ada salahnya untuk melakukan back up data. Sehingga bila suatu saat blog kita ada masalah...entah karena dihapus oleh google atau dibajak oleh hacker....kita nggak pusing-pusing mikir. Karena tinggal bikin blog baru ..terus import data tersebut ke blog yang baru.....langsung deh semua artikel terkirim secara otomatis ke blog baru tersebut.

Jadi usahakan untuk melakukan back up data secara rutin. Caranya adalah sebagai berikut:
1. Masuk login ke blogger anda.
2. Pilih pengaturan dan klik 'dasar'



3. Nanti akan muncul di bagian paling atas...ekspor,impor, atau hapus blog.



4. Pilih eksport blog - unduh. Silahkan simpan di komputer anda. Back up data sudah jadi.

Nanti kalau anda membuat blog baru caranya hampir sama. Cuman yang dipilih import blog-terus pilih data bacup yang telah anda simpan di komputer anda.

Selamat mencoba.....

Dapatkan panduan bisnis online full video tutorial cara buat blog, website otomatis dll...hanya di inginbahagia.com.

Resiko mengganti template sebuah blog atau website...

Beberapa hari ini saya ingin mengubah tampilan beberapa blog dan website yang saya kelola. Untuk tampilan blog kebahagiaan terbesar ini beberapa kali sempat ganti-ganti. Karena ternyata setelah ganti template....membuat beberapa script yang saya tanam seperti related post, share, iklan pop, ....nggak berfungsi alias jadi hilang.

Nah bagi teman-teman yang ingin ganti template ada beberapa hal yang perlu diperhatikan. Apa saja hal itu:


1. Pastikan anda memback up template anda terlebih dahulu. Caranya membuat back up template sudah tahukan..? tinggal masuk ke dasboard-tata letak-edit html- download template lengkap. Sudah selesai.

2. Pastikan bahwa semua fungsi yang ada sudah anda simpan kode html nya di sebuah Notepad. Sehingga bila anda membutuhkannya sewaktu-waktu...lebih mudah tinggal copy saja.

3. Pastikan design template yang baru sesuai dengan desaign sebelumnya. Misalnya kalau design sebelumnya latar belakangnya gelap...maka untuk template baru ..usahakan juga mempunyai latar gelap. Mengapa..? Karena ini kaitannya dengan beberapa link yang sudah anda tanam di posting. Biasanya menggunakan warna yang berlawanan dengan warna latar. Jadi bila anda mengubahnya menjadi warna yang berbeda...ditakutkan link di posting nggak akan terlihat lagi. Sayang kan bila linknya nggak nampak...kalaupun edit juga membutuhkan waktu yang cukup lama. Apalagi kalau artikel nya sudah mencapai seribuan lebih...capek lah....

4. Kalaupun ingin mengganti template...usahakan jangan terlalu sering. KArena nantinya akan membuat pembaca jadi bingung...kok tampilannya beda-beda.

Sekian tips ganti-ganti template kali ini semoga bermanfaat...

Inilah daftar kode dan warna html di blogspot

Nah setelah sebelumnya aku menampilkan bagaimana caranya membuat daftar warna dan kode html di blogspot atau bogger..kali ini aku ingin menampilkan tabel warna html sehingga bila menginginkan suatu warna tinggal klik warnanya...nanti otomatis kode warna htmlnya akan muncul di bawah.

Berikut adalah daftar warna dan kode html tersebut:

Kode warna yang terpilih :

Cara menampilkan daftar kode warna html di blogspot gimana ya...?

Bagi sobat yang suka ganti-ganti warna template...ini saya dapatkan artikel tentang bagaimana caranya menampilkan kode warna html di blog. Ternyata gampang sekali kok...tinggal ikutin aja 2 langkah berikut:

Pertama : Anda buka dulu tata letak - edit html dan centang expand. Setelah itu cari kode </head>

Setelah itu anda copy kode di bawah ini dan taruhlah tepat di atas head.

<script language='javascript'>
function Barva(koda)
{
document.getElementById("vzorec").bgColor=koda;
document.hcc.barva.value=koda.toUpperCase();
document.hcc.barva.select();
}
function BarvaDruga(koda)
{
document.getElementById("vzorec2").bgColor=koda;
document.hcc.Barva2.value=koda.toUpperCase();
document.hcc.Barva2.select();
}
</script>
<script type='text/javascript'>
var hue;
var picker;
//var gLogger;
var dd1, dd2;
var r, g, b;
function init() {
if (typeof(ygLogger) != "undefined")
ygLogger.init(document.getElementById("logDiv"));
pickerInit();
//ddcolorposter.fillcolorbox("colorfield1", "colorbox1") //PREFILL "colorbox1" with hex value from "colorfield1"
//ddcolorposter.fillcolorbox("colorfield2", "colorbox2") //PREFILL "colorbox1" with hex value from "colorfield1"
}
// Picker ---------------------------------------------------------
function pickerInit() {
hue = YAHOO.widget.Slider.getVertSlider("hueBg", "hueThumb", 0, 180);
hue.onChange = function(newVal) { hueUpdate(newVal); };
picker = YAHOO.widget.Slider.getSliderRegion("pickerDiv", "selector", 0, 180, 0, 180);
picker.onChange = function(newX, newY) { pickerUpdate(newX, newY); };
hueUpdate();
dd1 = new YAHOO.util.DD("pickerPanel");
dd1.setHandleElId("pickerHandle");
dd1.endDrag = function(e) {
// picker.thumb.resetConstraints();
// hue.thumb.resetConstraints();
};
}
executeonload(init);
function pickerUpdate(newX, newY) {
pickerSwatchUpdate();
}
function hueUpdate(newVal) {
var h = (180 - hue.getValue()) / 180;
if (h == 1) { h = 0; }
var a = YAHOO.util.Color.hsv2rgb( h, 1, 1);
document.getElementById("pickerDiv").style.backgroundColor =
"rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";
pickerSwatchUpdate();
}
function pickerSwatchUpdate() {
var h = (180 - hue.getValue());
if (h == 180) { h = 0; }
document.getElementById("pickerhval").value = (h*2);
h = h / 180;
var s = picker.getXValue() / 180;
document.getElementById("pickersval").value = Math.round(s * 100);
var v = (180 - picker.getYValue()) / 180;
document.getElementById("pickervval").value = Math.round(v * 100);
var a = YAHOO.util.Color.hsv2rgb( h, s, v );
document.getElementById("pickerSwatch").style.backgroundColor =
"rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";
document.getElementById("pickerrval").value = a[0];
document.getElementById("pickergval").value = a[1];
document.getElementById("pickerbval").value = a[2];
var hexvalue = document.getElementById("pickerhexval").value ='#'+
YAHOO.util.Color.rgb2hex(a[0], a[1], a[2]);
ddcolorposter.initialize(a[0], a[1], a[2], hexvalue)
if (hexvalue!="#FFFFFF") document.getElementById("pickerhexval").select();
}
</script><!--[if gte IE 5.5000]>
<script type="text/javascript">
function correctPNG() // correctly handle PNG transparency in Win IE 5.5 or higher.
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style="" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src='" + img.src + "', sizingMethod='scale');"></span>"
img.outerHTML = strNewHTML
i = i-1
}
}
}
YAHOO.util.Event.addListener(window, "load", correctPNG);
</script>
<![endif]-->

Kemudian anda tinggal nulis posting seperti biasa. Yaitu masuk menu posting-entri baru jangan lupa pilih edit html. DAn copy paste kode di bawah ini:

<center><form name="hcc" id="hcc">
<table style="border-collapse: collapse;" align="center" border="1" bordercolor="#cccccc" cellpadding="0" cellspacing="0"><tbody><tr><td><table align="center" border="0" cellpadding="0" cellspacing="1" width="375"><tbody><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#190707">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a0808">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b40404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df0101">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff0000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2e2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa5858">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f78181">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cece">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbefef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#191007">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a1b0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b240b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#61380b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a4b08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b45f04">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df7401">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff8000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe9a2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#faac58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7be81">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5d0a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6e3ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8ece0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbf5ef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#181907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#292a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#393b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5e610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#868a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#aeb404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d7df01">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ffff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7fe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f4fa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f3f781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f2f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5f6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7f8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbfbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#101907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1b2a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#243b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#38610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#4b8a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5fb404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#74df00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#80ff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#9afe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#acfa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#bef781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d0f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e3f6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ecf8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5fbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01df01">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58fa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071910">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a1b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b24">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b6138">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a4b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b45f">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01df74">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ff80">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efe9a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58faac">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f7be">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5d0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6e3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8ec">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbf5">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071918">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a29">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b39">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b615e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a85">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b4ae">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01dfd7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ffff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58faf4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f7f3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbfb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071019">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a1b2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b243b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3861">
</td><td onclick="Barva(this.bgColor)" bgcolor="#084b8a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#045fb4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0174df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0080ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e9afe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58acfa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81bef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9d0f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cee3f6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0ecf8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#eff5fb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#070719">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a0a2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b3b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b61">
</td><td onclick="Barva(this.bgColor)" bgcolor="#08088a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0404b4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0101df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0000ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e2efe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5858fa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8181f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9a9f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cecef6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0e0f8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#efeffb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#100719">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1b0a2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#240b3b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#380b61">
</td><td onclick="Barva(this.bgColor)" bgcolor="#4b088a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5f04b4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#7401df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8000ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#9a2efe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ac58fa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#be81f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d0a9f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e3cef6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ece0f8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5effb">
</td></tr><tr height="24"> <td onclick="Barva(this.bgColor)" bgcolor="#190718">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a29">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b39">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b5e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a0886">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b404ae">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df01d7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff00ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2ef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa58f4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f781f3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cef5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbeffb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#190710">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a1b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b24">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b38">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a084b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b4045f">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df0174">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff0080">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2e9a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa58ac">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f781be">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9d0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cee3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0ec">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbeff5">
</td></tr><tr height="10"><td>
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#000000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#151515">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1c1c1c">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e2e2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#424242">
</td><td onclick="Barva(this.bgColor)" bgcolor="#585858">
</td><td onclick="Barva(this.bgColor)" bgcolor="#6e6e6e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#848484">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a4a4a4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#bdbdbd">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d8d8d8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e6e6e6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f2f2f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ffffff">
</td></tr></tbody></table></td></tr></tbody></table>
<table align="center" border="0" cellpadding="0" cellspacing="2"><tbody><tr height="24"><td id="vzorec" height="24" width="24">
</td><td valign="bottom"><p>Kode warna yang terpilih : <input name="barva" id="barva" style="font-weight: bold; font-family: Verdana; height: 16px; width: 74px; font-size: 12px;" maxlength="7" size="9" type="text"></p></td></tr></tbody></table>
</form></center>

Nah berarti sudah jadi daftar kode html warna di blog anda. Kalau ingin lihat hasilnya bisa dilihat disini

Selamat mencoba