remoxp

Mini share button adalah fitur baru blogspot yang berfungsi untuk membantu pengunjung untuk menyebarkan artikel di blog kita, baik di jejaring sosial maupun social bookmarking. Sedangkan bagi pemilik blog, share button akan membantu mempromosikan blognya. Dulu kita harus sedikit mengotak-atik kode html di template kita untuk memasangnya, tetapi sekarang sobat dapat memasangnya dengan cara yang lebih nudah karena blogger telah support pada fitur ini.

Cara memasangnya adalah sebagai berikut:
1. Login ke blogger
2. Masuk ke menu "Rancangan", lalu pilih "Elemen Halaman".

3. Klik link "edit" pada area post, bagian kanan bawah.
4. Lalu akan muncul pop up, kemudian centang pada pilihan "Tampilkan Tombol Berbagi".
5. Klik "simpan".

Cek apakah mini share button sudah terpasang di blog kita atau belum.
Oops....Apabila mini share button tidak muncul, lakukan langkah-langkah berikut ini:

1. Login > Rancangan > Edit HTML
2. Letakkan kode yang berwarna biru, dibawah kode <p class='post-footer-line post-footer-line-1'> atau bila sobat tidak menemukannya, maka letakkan kodenya di bawah <div class='post-footer-line post-footer-line-1'>

<div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div>

3. Klik "Simpan".

Free Template Blogger collection template Hot Deals SEO

• Mengisi judul dengan tulisan <!--->

Free Template Blogger collection template Hot Deals SEO

Lagi-lagi menu horizontal, sampai-sampai bosan nih!!! Yah, mungkin karena sudah terlanjur cinta sama yang namanya menu horizontal dengan menggunakan kode CSS dibandingkan menu horizontal pakai javascript, jadi saya mau ngga mau menerbitkan posting ini (ha...ha...ha...). Sorry, yang merasa disentil berarti mendapat perhatian khusus dari saya. Memang kalau dipikir-pikir yang namanya trik blogger tidak akan pernah habis-habisnya, kecuali tidak ada lagi orang yang nge-blog di blogger. Dalam kesempatan ini saya akan sedikit menambahkah tentang "Membuat Sub Dropdown Pada Horizontal Menu". Jangan kedipkan mata kamu dan mari kita mulai  trik bloggernya.

Oia, sebelumnya buat dulu horizontal menu, silakan buka  Membuat Horizontal Menu di blog dan Membuat Dropdown Pada Horizontal Menu

• Login dulu ke account blogger kamu.

• Pilih tab Tata Letak --> Edit HTML --> centang "Expand Template Widget".

Tips: Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.

• Tambahkan kode CSS berikut di bawah kode CSS menu horizontal yang ada.

    #nav li ul a {
    width: 100px;
    }
    #nav li ul ul {
    position: absolute;
    margin: -30% 0 0 95%;
    }
    #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
    left:-999em;
    }
    #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
    left:auto;
    }
    #nav li li li.sfhover ul {
    left:auto;
    }
    #nav li:hover, #nav li.sfhover {
    position:static;
    }

•  Cari kode HTML <div id='navleft'>.

Tips: Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan timbul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.

• Kemudian tambahkan menu turunan kedua, seperti kamu menambahkan dropdown menu dalam horizontal navigasi (turunan pertama). Illustrasi kodenya adalah sebagai berikut.

    <div id='navleft'>
    <div id='nav'>
    <ul>
    <li><a href='http://Alamat_Blog_Kamu.blogspot.com/'>home</a></li>
    <li><a href='http://Link_yang_dituju'>teks kamu</a></li>
    <li><a href='http://Link_yang_dituju'>teks kamu</a>
    <ul>
    <li><a href='URL sub 1'>teks kamu</a></li>
    <li><a href='URL sub 2'>teks kamu</a></li>
    <li><a href='URL sub 3'>teks kamu</a>

    <ul>
    <li><a href='URL sub 3.1'>teks kamu</a></li>
    <li><a href='URL sub 3.2'>teks kamu</a></li>
    </ul>
    </li>

    </ul>
    </li>
    <li><a href='http://Link_yang_dituju'>teks kamu</a></li>
    <li><a href='http://Link_yang_dituju'>teks kamu</a></li>
    </ul>
    </div>
    </div>

Catatan :
   1. Perhatikan peletakkan kode untuk menambah dropdown menu, ditandai dengan kode berwarna hijau.
   2. Perhatikan pula peletakkan kode untuk menambah menu turunan kedua, ditandai dengan kode yang berkedap-kedip.
   3. Ganti kode yang berwarna merah dengan alamat link dan teks yang kamu inginkan.

• Jangan lupa disimpan.

Selamat membuat sub dropdown pada horizontal menu...

Sumber: Optimasi-Blog.blogspot.com

Free Template Blogger collection template Hot Deals SEO

Diposting trik blogger terdahulu saya telah menulis tentang membuat menu horizontal. Dimana pengkodeannya menggunakan CSS yang disadur dari blog Kang Rohman. Selanjutnya tinggal bagaimana trik menambahkan dropdown menu di dalam kode tersebut. Betulkan... Seandainya saya jeli mengamati kode menu horizontal tersebut, mungkin ini tidak akan menjadi sebuah posting. Ternyata ada hikmahnya juga, karena faktor ketidaktelitian tersebut he..he..he.. Kalau dropdown menunya agak kurang enak dipandang menurut penglihatan dan perasaan kamu, maka diperlukan beberapa optimasi kode CSS-nya, terutama yang memiliki atribut #nav li li. Jadi memodifikasinya terserah pada yang punya blog (ingin seperti apa dan bagaimana).

Berikut trik menambahkan dropdown menu dalam horizontal navigasi :

• Sebelumnya buat dulu horizontal menu. Silakan buka  Membuat Horizontal Menu di blog 2

• Login ke account blogger kamu.

• Pilih Tata Letak --> Edit HTML --> centang "Expand Template Widget".

Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.

• Cari kode HTML di bawah ini yang posisinya diantara <body> ... <body>.

    <div id='navleft'>
    <div id='nav'>
    <ul>
    <li><a href='http://Alamat_Blog_Kamu.blogspot.com/'>home</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    </ul>
    </div>
    </div>

Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.

• Tambah kode berikut di nav link yang kamu inginkan, letakkan sebelum </li>.

    <ul>
    <li><a href='URL sub 1'>Sub menu 1</a></li>
    <li><a href='URL sub 2'>Sub menu 2</a></li>
    <li><a href='URL sub 3'>Sub menu 3</a></li>
    </ul>

Contoh :

    <div id='navleft'>
    <div id='nav'>
    <ul>
    <li><a href='http://Alamat_Blog_Kamu.blogspot.com/'>home</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a>
    <ul>
    <li><a href='URL sub 1'>Sub menu 1</a></li>
    <li><a href='URL sub 2'>Sub menu 2</a></li>
    <li><a href='URL sub 3'>Sub menu 3</a></li>
    </ul>
    </li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    </ul>
    </div>
    </div>

Catatan :
   1. Perhatikan peletakkan kode untuk menambah menu dropdown, ditandai dengan warna hijau.
   2. Ganti kode yang berwarna merah dengan alamat link dan teks yang kamu inginkan.

• Jangan lupa disimpan.

Tambahan : Kode CSS #nav li li yang perlu kamu optimasi adalah sebagai berikut.

#nav li li {

float: left;
margin: 0px;
padding: 0px;
width: 150px; <!-- lebar dropdown menu -->
}
#nav li li a, #nav li li a:link, #nav li li a:visited {
background: #ffffff; <!-- warna latar dropdown menu -->
width: 160px; <!-- lebar dropdown menu, ketika disentuh korsur/mouse -->
float: none;
margin: 0px;
padding: 7px 30px 7px 10px;
border-bottom: 1px solid #ffffff; <!-- garis tepi bawah dropdown menu -->
border-left: 1px solid #ffffff; <!-- garis tepi kiri dropdown menu -->
border-right: 1px solid #ffffff; <!-- garis tepi kanan dropdown menu -->
<!-- atau kamu bisa mengganti kode border-bottom, left, dan right dengan kode border: 1px solid #ffffff; -->
}
#nav li li a:hover, #nav li li a:active {
background: #c06000; <!-- warna latar dropdown menu , ketika disentuh korsur/mouse -->
padding: 7px 30px 7px 10px;
}

Selamat berdropdown dengan menu horizontal...

Free Template Blogger collection template Hot Deals SEO

Menu horizontal merupakan kumpulan beberapa link yang diletakkan secara horizontal dan biasanya ditempatkan di bawah header. Pada kesempatan ini, kita akan mengulas trik blogger tentang membuat menu horizontal secara sederhana. Mengapa dikatakan sederhana? Karena jika kita optimasi lebih mendalam, ternyata terdapat beberapa varian dari menu horizontal tersebut. Fungsi dari trik blogger ini adalah sebagai salah satu navigasi dalam blog agar memberikan layanan kemudahan shortcut link bagi pengunjung blog kamu.

Singkat kata, berikut langkah membuat menu horizontal dalam blog kamu :

• Login ke account blogger kamu.

• Pilih Tata Letak --> Edit HTML --> centang "Expand Template Widget".

Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.

• Cari Kode kode ]]></b:skin> dan Copy-Paste (copas) kode berikut di atasnya.

Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.

    /* navbar
    ================== */

    #bg_nav {
    background: #ffffff;
    width: 850px;
    height: 29px;
    font-size: 11px;
    font-family: Arial, Tahoma, Verdana;
    color: #000000;
    font-weight: bold;
    margin: 0px auto 0px;
    padding: 0px;
    border-top: 1px solid #000000;
    border-bottom: 1px solid #ffffff;
    overflow: hidden;
    }
    #bg_nav a, #bg_nav a:visited {
    color: #000000;
    font-size: 11px;
    text-decoration: none;
    text-transform: uppercase;
    padding: 0px 0px 0px 3px;
    }

    #bg_nav a:hover {
    color: #000000;
    text-decoration: underline;
    padding: 0px 0px 0px 3px;
    }

    #navleft {
    width: 500px;
    float: left;
    margin: 0px;
    padding: 0px;
    }
    #navright {
    width: 220px;
    font-size: 11px;
    float: right;
    margin: 0px;
    padding: 3px 5px 0px 0px;
    }
    #navright a img {
    border: none;
    margin: 0px;
    padding: 3px 5px 0px 0px;
    }

    #nav {
    margin: 0px;
    padding: 0px;
    list-style: none;
    }
    #nav ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
    }

    #nav a, #nav a:visited {
    background: #ffffff;
    color: #000000;
    display: block;
    font-weight: bold;
    margin: 0px;
    padding: 8px 15px 8px 15px;
    border-left: 1px solid #ffffff;
    }
    #nav a:hover {
    background: #c06000;
    color: #000000;
    margin: 0px;
    padding: 8px 15px 8px 15px;
    text-decoration: none;
    }

    #nav li {
    float: left;
    margin: 0px;
    padding: 0px;
    }
    #nav li li {
    float: left;
    margin: 0px;
    padding: 0px;
    width: 150px;
    }
    #nav li li a, #nav li li a:link, #nav li li a:visited {
    background: #ffffff;
    width: 160px;
    float: none;
    margin: 0px;
    padding: 7px 30px 7px 10px;
    border-bottom: 1px solid #ffffff;
    border-left: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
    }
    #nav li li a:hover, #nav li li a:active {
    background: #c06000;
    padding: 7px 30px 7px 10px;
    }

    #nav li ul {
    position: absolute;
    width: 10em;
    left: -999em;
    }

    #nav li:hover ul {
    left: auto;
    display: block;
    }
    #nav li:hover ul, #nav li.sfhover ul {
    left: auto;
    }

Catatan :

1. Agar menu horizontal sesuai dengan template blog, kamu perlu mengganti kode-kode yang berwarna hijau.
2. Untuk kode pewarnaan, kamu bisa melihatnya di kode warna disini---> Mengetahui Kode Warna

• Kemudian cari kembali kode seperti di bawah ini.

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

    ... dan seterusnya ...

    </b:section>
    </div>

• Copas kode berikut tepat di bawah kode yang berwarna hijau atau berwarna kuning (sesuaikan dengan template blog kamu).

    <div id='bg_nav'>

    <div id='navleft'>
    <div id='nav'>
    <ul>
    <li><a href='http://Alamat_Blog_Kamu.blogspot.com/'>home</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    <li><a href='http://Link_yang_dituju'>Add Link</a></li>
    </ul>
    </div>
    </div>

    <div id='navright'>

    <form action='http://Alamat_Blog_Kamu.blogspot.com/search' id='searchform' method='get' name='searchform'> <input id='s' name='q' type='text' value=''/> <input id='searchsubmit' type='submit' value='Cari'/>
    </form>

    </div>

    </div><!-- akhir bg_nav -->

• Jangan lupa disimpan

Oia, baca juga postingan saya yang lama tentang Membuat Horizontal Menu


Selamat membuat menu horizontal...

Sumber: Kolom-Tutorial.blogspot.com & Optimasi-Blog.blogspot.com

Free Template Blogger collection template Hot Deals SEO

Pengunjung Blog terkadang merasa tertarik dengan posting yang kamu tulis, apalagi posting kamu mempunyai topik yang "hot" dan "up to date". Dan saking sukanya, ia selalu merindukan posting-posting terbaru kamu. Kalau hanya sekedar mem-bookmark blog kamu, kemungkinan upaya tersebut masih kurang begitu mantap. Why? Karena suatu ketika jaringan sedang down atau host penyimpanan blog kamu sedang melakukan perbaikan atau gangguan lainnya, maka pada waktu itu pula ia tidak dapat mencapai hasratnya untuk membaca posting terbaru dari blog kamu. Nah, untuk menghindari terjadinya hal-hal yang demikian, alangkah lebih baiknya apabila kamu membuat form berlangganan melalui RSS. Form tersebut berguna untuk memudahkan pengunjung blog melakukan subcribe, sehingga ia akan selalu mendapatkan update posting kamu baik melalui email maupun reader.

Sebelum kamu menggunakan trik ini, terlebih dulu kamu harus memasukkan blog kamu dalam akun Feedburner. Kalau sudah mari kita mulai trik blogger untuk membuat form berlangganan, seperti yang kamu lihat di sidebar kanan blog ini :

• Login dulu ke account blogger kamu.
• Pilih tab Tata Letak --> Elemen Halaman.
• Tambah Gadget dalam elemen blog kamu.
• Di jendela "Tambahkan Gadget", pilih HTML/JavaScript.
• Kemudian copy dan pastekan kode di bawah ini.

<div style="background:url(http://i647.photobucket.com/albums/uu191/ariamsi/flying_bird.gif) no-repeat top right;padding:10px 0px">
<form action="http://feedburner.google.com/fb/a/mailverify" style="border:1px solid #ccc;padding:3px 3px 5px 3px;text-align:left;" target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=forantum', 'popupwindow', 'scrollbars=yes,width=300,height=320');return true">

<a href="http://feeds2.feedburner.com/forantum" rel="alternate" type="application/rss+xml"><img alt="RSS Feed" style="vertical-align:middle;border:0" src="http://www.feedburner.com/fb/images/pub/feed-icon16x16.png"/> Berlangganan posting via RSS FEED</a><br/><br/>

Atau berlangganan posting via email:<br/><input style="width:190px" value="" name="email" type="text"/><input value="forantum" name="uri" type="hidden"/><input value="en_US" name="loc" type="hidden"/><input value="Berlangganan" type="submit"/><br/><br/>

<a href="http://feeds2.feedburner.com/forantum"><img width="88" style="border:0" alt="" src="http://feeds2.feedburner.com/~fc/forantum?bg=FFFFFF&fg=000000&anim=0" height="26"/></a></form>
</div>

    Catatan :

       1. Ganti http://i647.photobucket.com/albums/uu191/ariamsi/flying_bird.gif (burung terbang) dengan alamat penyimpanan file image kamu.
       2. Ganti forantum dengan nama feed blog kamu.
       3. Ganti nilai width dan height (warna kuning) sesuai dengan ukuran template elemen halaman blog.
       4. Ganti warna feed-count (bg=FFFFFF&fg=000000) sesuai dengan warna blog kamu.

•     Lalu simpan dan,lihat blog kamu....

Sumber: Optimasi-Blog.blogspot.com

Free Template Blogger collection template Hot Deals SEO

Sekarang kita akan mencoba menambahkan icon pada label dan link sidebar. Yang dimaksud dengan icon link list adalah icon kecil di samping daftar link yang biasa kita tempatkan pada sidebar blog kita. Icon ini bisa bermacam-macam. Pertama sekali anda harus sudah menyimpan icon pada image hosting anda. Misalnya di tiniypic.com, photobucket.com atau tempat tempat hosting gambar lainnya. Contohnya icon panah hijau dengan alamat penyimpanan seperti ini:

    http://i35.tinypic.com/2n03mgz.jpg

Nanti bisa anda ganti dengan icon milik anda. Seperti biasa login ke blogger dengan id anda. Cari kode berikut:

    .sidebar li {
    border-bottom:1px dotted #cccccc;
    margin:0;
    padding:0 0 .25em 17px;
    line-height:1.2em;
    }

Mungkin ada perbedaan pada template, fokus saja kode .sidebar li { yang merupakan kode pada daftar link di sidebar atau cari kode yang hampir mirip. Kemudian tambahkan alamat icon anda di bawahnya. Contohnya:

    .sidebar li {
    background:url("http://i35.tinypic.com/2n03mgz.jpg") no-repeat 0px .20em;
    border-bottom:1px dotted #cccccc;
    margin:0;
    padding:0 0 .25em 17px;
    line-height:1.2em;
    }

Lalu klik tombol Simpan Template dan lihat hasilnya. Jika tidak ada masalah, hasilnya akan seperti gambar di bawah ini :


Di sebelah kiri daftar link dan label akan ada icon panah kecil. Oke selamat menambahkan icon pada label dan link sidebar, mudah-mudahan berhasil ya...

Sumber: bangdel.blogspot.com

Free Template Blogger collection template Hot Deals SEO

Sepertinya aksesoris blog tidak pernah habis habisnya selalu ada saja yang baru untuk mempercantik blog /website. Atas apa yang akan saya terangkan disini bahwa di blogspot anda bisa mengganti huruf secara auto anda tinggal memilih sebagian font yang telah ada...atau anda juga bisa menentukan pilihan ukuran font dari ukuran font 12 sampai dengan 18, dan widget untuk merubah font/huruf ini cukup sederhana untuk pemasangannya anda tidak perlu mengubah apapun pada kode script-nya. untuk contohnya silahkan perhatikan gambar berikut


Bagaimana...anda tertarik untuk memasangnya ? silahkan ....

• Login ke Blogger dan masuk ke Dasbor

• Klik Tata Letak

• Pilih Elemen Halaman

Klik Add Gadget

• Pilih HTML/Java Script

• Masukkan Kode dibawah ini:

    <div class='widget-content'>
    <center><script>
    function go1(){
    if (document.selecter2.select2.options
    [document.selecter2.select2.selectedIndex].value != "none") {
    document.getElementById('main').style.fontSize
    =document.selecter2.select2.options
    [document.selecter2.select2.selectedIndex].value
    }
    }

    function go2(){
    if (document.selecter2.select3.options
    [document.selecter2.select3.selectedIndex].value != "none") {
    document.getElementById('main').style.fontFamily
    =document.selecter2.select3.options
    [document.selecter2.select3.selectedIndex].value
    }
    }
    </script>
    <form id="forma" name="selecter2" method="POST">

    <select onchange="go2()" style="font-family:verdana;font-size:8pt" name="select3" size="1">
    <option value="Times New Roman" />Times New Roman
    <option value="Arial" />Arial
    <option selected value="Book Antiqua" />Book Antiqua
    <option value="Bookman Old Style" />Bookman Old Style
    <option value="Century Gothic" />Century Gothic
    <option value="Comic Sans Ms" />Comic Sans Ms
    <option value="Tahoma" />Tahoma

    <option selected value="Trebuchet Ms"//>Trebuchet Ms
    <option value="Verdana" />Verdana
    </select>
    <select onchange="go1()" style="font-family:verdana;font-size:8pt" name="select2" size="1">
    <option value="8px" />8
    <option value="9px" />9
    <option value="10px" />10
    <option value="11px" />11
    <option selected value="12px" />12
    <option value="14px" />14
    <option value="16px" />16
    <option value="18px" />18
    </select></form><center></center></center>
    </div>

• Klik Simpan dan Selesai deh...

Sumber: mastergomaster.com

Free Template Blogger collection template Hot Deals SEO

Wibiya - salah satu website yang menyediakan fasilitas free toolbar untuk blog Anda, toolbar dari wibiya ini sangat canggih. Fitur dari toolbar wibiya ini diantaranya : pencarian langsung, who's online, live video, translate, timeline, Bermacam-macam Facebook widget, twitter, youtube, Live chat dan foto sharing kamu. Hmmm canggih bukan toolbar ini? Untuk demonya silakan lihat blog ini bagian bawah yang melayang, ada tools yang berisi pencarian, who's online, facebook, live chat dll.

Setelah Anda melihat-lihat apakah Anda ingin memasangnya kedalam Blogger Anda? Nah dibawah ini ulasan cara membuatnya.

• Buka website wibiya.com dan klik tombol "Get It Now"

• Pada Form "Create An Account" isi form sesuai dengan data Anda lalu kik tomblol "Next" 

• Lalu milih tema toolbar Anda pada bagian "Select A Theme" Lalu klik tombol "Next"

• Pada bagian "Application Setting" configurasi account-account Anda kedalam toolbar tersebut, Seletlah itu klik tombol "Next" 

• Pada bagian "Add it" atau final installation klik logo "Blogger" atau install on blogger

• Pastikan Anda sudah Log in blogger untuk memasang widgetnya, setelah Anda klik logo blogger pada tahap Final, Anda langsung ditujukan pada "Import page elements" blogger

• Select blog yang Anda ingin pasang Toolbarnya, Lalu klik tombol "Add Widget" maka toolbar akan terpasang otomatis dan melayang di bagian bawah blog Anda.

Nah selesai deh ulasan tentang cara membuat Toolbar canggih wibiya, toolbar ini banyak digunakan oleh para pemilik website untuk mempercanggih websitenya, jadi blog kita jika menggunakan toolbar ini serasa seperti di Facebook.

Sumber: tutorial-jitu.blogspot.com

Free Template Blogger collection template Hot Deals SEO

Bagi anda yang tidak puas dengan tutorial saya tentang Membuat Daftar Isi Otomatis jadi kalau di tutorial yang satu ini saya akan membuat anda lebih puas lagi. Bila di artikel yang saya sebutkan diatas saya hanya membuat daftar isi yang hanya dengan judul artikel tanpa skin seperti punya saya, mungkin ini sangat berguna dan berfungsi sekali untuk blog anda karena akan memperindah blog anda,dalam pencarian juga akan tampil seperti ini nanti,langsung saja dah.

Ikuti langkah-langkah dibawah ini:

• Login ke Blogger kemudian Layout/Tata Letak terus Edit HTML

• Centang pada Expand Template Widget

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

• Cari kode yang berwarna hijau

• Langkah selanjutnya anda hanya perlu mengganti kode yang berwarna hijau dengan kode dibawah ini.

<div style='padding:6px 0 6px 5px;border-right:1px solid #000;border-bottom:1px solid #000;margin-bottom:2px;background:#DCDCDC;color:#000000;'>
<data:post.title/></div></a>

NOTE : Bila anda ingin menggantinya anda hanya perlu merubah kode yang berwarna merah dengan kode warna yang anda sukai. Kode warna bisa dilihat di Mengetahui Kode Warna

Sumber: risz-panic.blogspot.com

Free Template Blogger collection template Hot Deals SEO

Gadget profil adalah gadget dimana Anda bisa manampilkan foto, deskripsi tentang Anda dan link profil blogger Anda kedalam blog Anda. Untuk menambahkan widget ini cukup mudah yaitu dari menu "Layout/tata letak" kemudian klik "Add a gagdet" lalu pilih "Profile". Dan untuk mengedit profil dan foto Anda bisa melalui Dashboard blogger Anda dengan mengklik "Edit Profile" yang ada di sebelah kanan dashboard Anda.

Nah kali ini Saya akan membahas tentang bagaimana caranya menampilkan status yahoo mesengger di gadget profil Anda.

Coba lihat contoh dari modifikasi sederhana ini :
 



Terlihat diatas ada tambahan status Yahoo messenger ke dalam gadget profil saya.

Nah dibawah ini adalah caranya :

• 1. Langkah pertama yang Anda harus lakukan Adalah Log In ke Blogger lalu menuju bagian "Layout" kemudian masuk "Edit HTML"

• 2. Setelah itu centang "Expand Widget Templates"

• 3. Kemudian cari code dibawah ini :

<a class='profile-link' expr:href='data:userUrl'><data:viewProfileMsg/></a>

• 4. Setelah ketemu code diatas lalu tambahkan code dibawah ini diatasnya

<a href='ymsgr:sendIM?tengku_nauf'> <img src='http://opi.yahoo.com/online?u=tengku_nauf&amp;m=g&amp;t=1&amp;l=us'/>
</a><br/>

Code yang berwarna hijau diatas ganti dengan ID YM kamu. Dan angka yang berwarna kuning adalah bentuk dari lambang status YM (tidak usah diganti tidak apa-apa).

• 5. Kalau sudah kemudia SAVE

Nah diatas adalah cara menambah Status Yahoo Messenger kedalam gadget profil, Anda juga bisa Status YM dengan status Camfrog, G-Talk dan lainya.

Cukup disini dulu postingan Saya. Semoga bermanfaat dan silahkan menuliskan komentar dibawah ini untuk tanggapan dan pertanyaan.

Sumber: http://tutorial-jitu.blogspot.com
Share By: ForAntum

Free Template Blogger collection template Hot Deals SEO

Sebelumnya saya pernah posting tentang bagaimana menambahkan tombol buzz ke blog. Namun postingan terdahulu, tombol buzz nya tidak memiliki count atau penghitung. Sekarang bagi Anda yang ingin memasang tombol tersebut disertai penghitung sepereti halnya facebook dan twitter.  Cara menambahakan tombol share ke buzz disertai penghitung di postingan anda adalah sebagai berikut :

- Login ke blogger
- Tata Letak
- Edit HTML
- Centang "Expand Template Widget"
- Cari kode berikut ini <data:post.body/>

- Letakkan kode berwarna kuning di bawah ini sebelum <data:post.body/>

<div style='padding: 4px; float: right;'><script type="text/javascript" src="http://button.njuice.com/buzz.js"></script></div>

Maka hasilnya akan menjadi seperti ini




Semoga bermanfaat dan membuat blog Anda lebih cantik juga memudahkan orang membagi artikel Anda.

Sumber: http://www.masdoyok.co.cc

Share By: For Antum

Free Template Blogger collection template Hot Deals SEO

Sesuai bocoran yang beredar sehari sebelumnya, perusahaan raksasa internet, Google, akhirnya resmi memperkenalkan layanan jejaring sosial dengan nama Google Buzz. Layanan ini tidak berdiri sendiri, tetapi langsung terintegrasi dengan layanan Gmail mulai Selasa (9/2/2010) dan secara bertahap akan tersedia untuk pengguna Gmail di seluruh dunia.

Jadi, buat pengguna Gmail, siap-siap saja mencoba tanpa harus melakukan instalasi. Buat yang belum punya akun Gmail, tentu harus mendaftarnya terlebih dulu untuk mencoba Google Buzz. Tertarik nge-Buzz? Pelajari dulu apa itu Google Buzz.

Google Buzz menyediakan fitur yang memungkinkan para pemakai Gmail kini dapat dengan cepat berbagi pesan, link situs, dan foto dengan rekan mereka sesama pengguna Gmail. Google menyebutnya berbagi ide karena menyediakan fitur seperti pesan Twitter, tetapi tanpa batasan karakter. Selain itu, juga fitur berbagi foto dan video serta update dari berbagai layanan yang sudah dipakai, seperti Twitter, Picasa, Flickr, dan Google Reader.

Salah satu kekuatan promosi blog adalah dari social network seperti facebook dan juga twitter. Yang terbaru tentu saja adalah datang dari google yakni Google Buzz . Kini saatnya bagi Anda memanfaatkan Google Buzz juga karena akan sangat menjanjikan untuk traffic Anda. Pasang tombol buzz this di setiap postingan Anda, dan biarkan orang yang senang dengan postingan Anda promosikan postingan Anda ke Google Buzz dengan lebih mudah hanya dengan menggunakan tombol itu.

Cara menambahakan tombol share ke buzz di postingan anda adalah sebagai berikut :

- Login ke blogger
- Tata Letak
- Edit HTML
- Centang "Expand Template Widget"
- Cari kode berikut ini <data:post.body/>

- Letakkan kode berwarna hijau di bawah ini sebelum <data:post.body/>

<div style='padding: 4px; float: right;'>
<a expr:href='&quot;http://www.google.com/reader/link?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + &quot;&amp;srcTitle=&quot; + data:blog.title+ &quot;&amp;srcURL=&quot; + data:blog.homepageUrl ' rel='nofollow' style='text-decoration:none;' target='_blank'>
<img alt='Buzz It' src='http://i48.tinypic.com/fe19w7.png' style='border:0px;'/></a>
</div>

(Jika anda sudah menggunakan fasilitas readmore, pasang kode berwarna biru tersebut sebelum kode <data:post.body/> yang kedua)

Tombol yang dihasilkan adalah seperti berikut ini



Jika Anda menginginkan tombol seperti ini:



silahkan gunakan kode berikut ini

<div style='padding: 4px; float: right;'>
<a expr:href='&quot;http://www.google.com/reader/link?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + &quot;&amp;srcTitle=&quot; + data:blog.title+ &quot;&amp;srcURL=&quot; + data:blog.homepageUrl ' rel='nofollow' style='text-decoration:none;' target='_blank'>
<img alt='Buzz It' src='http://i46.tinypic.com/2s1wwzm.png' style='border:0px;'/></a>

</div>

Atau anda bisa menggantinya sendiri dengan gambar Anda dengan memasukkan alamat gambar Anda ke bagian berwarna kuning.

Sumber: http://www.masdoyok.co.cc & http://tekno.kompas.com

Share By: For Antum

Free Template Blogger collection template Hot Deals SEO

Membuat Dafatar Isi Otomatis. Ya, kali ini akan membuat Membuat Dafatar Isi Otomatis. Sekali jalan, terus-menerus update sendiri. Jadi, jika kita melakukan postingan baru maka secara otomatis judul blog yang baru akan langsung masuk ke dalam daftar isi tanpa harus melakukan edit pada layout blog kita.

Dengan trik mudah, hemat, praktis, memasang daftar isi pada blog jadi semakin fun dan tanpa konsentrasi yang tinggi. Mau coba, ikuti cara-cara membuat daftar isi berikut :


1. Masuk ke akun blogger
2. Pilih menu tata letak / Layout
3. Pilih tambah gadget
4. Pilih html/javascript
5. COPy-PASte kode di bawah ini :

<a href="http://forantum.blogspot.com/search?max-results=200" target="_blank"><span style="font-weight:bold;">DAFTAR ISI</span>&raquo;</a>

Ket :

* http://forantum.blogspot.com diganti dengan alamat blog anda.
* results=200 diganti dengan jumlah yang anda inginkan, angka 200 menunjukkan jumlah judul yang akan di tampilkan.

6. Klik SAVE

@Tambahan:
Baiknya kode tersebut berada di menu blog. 

Free Template Blogger collection template Hot Deals SEO

cara pasang google search widget di blog ini. Buat anda yang juga pengen widget google search, silahkan baca artikel ini sampe tuntas. Untuk screenshootnya google search itu seperti ini :

<form action="http://www.google.com/search" method="get">

<input onfocus="this.style.background='#fff';" maxlength="255" value=""
type="text"onblur="if(this.value=='')this.style.background='#fff
url(http://tbn1.google.com/images?q=tbn:NTYparYmYXvKAM:http://www.itenas.ac.id/tpls/home/images/logo_google.gif)
3px center no-repeat'" style="height:18px;border: solid 1px black; background:#fff
url(http://tbn1.google.com/images?q=tbn:NTYparYmYXvKAM:http://www.itenas.ac.id/tpls/home/images/logo_google.gif)
3px center no-repeat; position:relative;" size="25" name="q"/>

<input id="btn_undefined" style="position:absolute;padding-left:5px;"
value="Search" src="http://bloggerplugins.googlepages.com/yahoo-search-widget-button.png"
type="image"/><br/>

<div style="margin-top:5px;">

<li style="display:inline;padding-right:10px;margin-top:5px;">
<input checked="checked" value="" name="sitesearch" type="checkbox"/> Web</li>

<li style="display:inline;padding-right:10px;margin-top:5px;">
<input checked="checked" value="http://bloganda.blogspot.com" name="sitesearch"
type="checkbox"/> Blog Anda</li>

</div>
</form>

Nah…setelah copy paste, jangan lupa untuk mengganti text yang berwarna hijau dengan nama blog anda…Ok..silahkan dicoba..

Free Template Blogger collection template Hot Deals SEO

Saat ini hampir setiap blog menyediakan layanan fasilitas berlangganan posting melalui email. Ingin agar blog Anda terkenal? Gunakan layanan berlangganan artikel via email dengan FeedBurner. Beberapa situs yang menyediakan jasa layanan pengantar posting gratis selain Feedburner adalah Feedblitz dan Zookoda. Saya pakai Feedburner karena fitur yang mereka sediakan terbilang lengkap termasuk layanan pengantar posting melalui email. Selain itu, situs ini adalah milik Google sehingga namanya sekarang adalah Google Feedburner. Untuk mendaftar ke Feedburner Anda cukup memiliki email di gmail yang bisa digunakan untuk login ke feedburner. Secara singkat feedburner adalah situs yang memberikan layanan dalam hal sindikasi atau feed. Anda bisa menempatkan kotak yang berisi tempat untuk mengisikan alamat email dan sebuah tombol dengan tulisan Berlangganan Gratis atau Email Subscriber di mana saja pada bagian blog. Bisa pada sidebar, pada bagian akhir setiap posting atau pada header dan footer blog, tinggal disesuaikan dengan template layout blog. Setting tampilan juga tergantung pemilik blog mau dibuat seperti apa sehingga menarik. Fugsi form berlangganan ini adalah untuk memudahkan pembaca blog agar bisa berlangganan atau mendapatkan informasi terbaru dari posting blog kita yang dikirim melalui email mereka. Jika memang ada posting artikel terbaru, maka para pelanggan yang sudah memasukkan email dan mengkonfirmasi di emailnya secara otomatis mendapatkan kiriman email berisi artikel posting terbaru blog. Tertarik untuk menambahkan aksesoris berlangganan posting via email? Silahkan ikuti cara berikut.

Cara membuat form berlangganan Feedburner

1. Kunjungi situs Feedburner (http://www.feedburner.com) dan login dengan akun gmail Anda.

2. Selanjutnya Anda akan ditawarkan kotak untuk mengisikan alamat blog untuk dibakar.

3. Untuk blogger silahkan masukkan alamat feed seperti ini

http://namablog.blogspot.com/feeds/posts/default

Ganti nama blog dengan url blog Anda.

4. Ada kotak kecil bertuliskan "I am a podcaster!" dapat dicentang jika blog Anda hanya berisi video-video. Jika tidak, jangan dicentang. Kemudian klik tombol next.

5. Setelah itu Anda akan ditawarkan untuk mengisi form Feed Title dan Feed Address silahkan diisi. Biasanya Feedburner langsung menyesuaikan dengan judul blog namun Anda dapat menggantinya sesuai kalimat atau kata yang paling cocok. Selanjutnya klik tombol next.

6. Pada halaman berikutnya ada pemberitahuan seperti ini Congrats! Your FeedBurner feed is now live. Want to dress it up a little? Oke sudah selesai dan teruskan dengan mengklik tombol next.

7. Kemudian Anda akan diberi pilihan FeedBurner Stats automatically tracks. Silahkan pilih menu default atau Anda juga dapat menambah menu lain yang ditawarkan. Selanjutnya klik tombol next.

8. Pada halaman berikutnya akan nampak beberapa menu pilihan di bagian atas dan pilih Publicize.

9. Pada menu Publicize Anda akan melihat fitur layanan yang siap Anda gunakan seperti Headline Animator, BuzzBoost, Email Subscriptions, PingShot, FeedCount, Chicklet Chooser dan yang lain. Nah, untuk membuat formulir berlangganan pilih menu Email Subscriptions.

10. Pada halaman Email Subscriptions Anda klik tombol Activate.

11. Selanjutnya feedburner akan memberikan kode html. Yang di atas adalah html yang hasilnya berupa kotak formulir berlangganan melalui email disebut Subscription Form Code dan di bawahnya adalah html yang hasilnya berupa link berlangganan melalui email disebut Subscription Link Code. Saya tawarkan berupa kotak formulir berlangganan melalui email. Pada menu drop down, silahkan pilih use a widget in Blogger (jika blog Anda di blogger). Lalu klik tombol Go! Sebenarnya Anda bisa saja meng-copy kode html tadi ke notepad atau text editor lainnya dan cara pasang ke blogger cukup mudah. Jika ini yang menjadi pilihan, silahkan masuk ke blog Anda dan klik Tata Letak yang membawa Anda ke Elemen Halaman dan klik Tambah Gadget. Pada menu selanjutnya, pilih tambah HTML/Javascript. Nah, Anda paste kode html tadi di situ. Dan klik simpan. Ok, sekarang lihat hasilnya pada blog.

12. Jika mengikuti cara setelah klik Go! tadi, akan terbuka jendela baru pada monitor yang membawa Anda menuju blog yang tadi didaftarkan. Di sana tertulis menambah elemen halaman. Silahkan ganti judul jika perlu dan jika tidak biarkan saja judulnya Subscribe via email. Kemudian klik tombol menambah widget.

13. Widget sudah ditambahkan pada elemen halaman blog. Pilih tempat yang sesuai dengan drag widget tersebut dan tempatkan di bagian blog yang Anda rasa paling cocok.

14. Jika sudah, klik Lihat blog untuk melihat hasilnya. Akan ada form email subscriber.

Nah, kembali ke Feedburner. Hingga saat ini, selain form email subscriber saya juga menggunakan fitur FeedCount yang menunjukkan jumah pembaca blog, Chicklet Chooser dan Optimize serta fitur lain yang membuat blog tampil prima.  Untuk fitur-fitur tersebut, Anda bisa mempelajarinya. Agak capek memang, namun saya yakin blog Anda akan semakin terkenal dengan Feedburner. Kalau saya ketik semuanya, waduh capek juga karena begitu banyaknya fitur feedburner di sana. Jika Anda sudah terbiasa dengan kode-kode html, Anda juga dapat mengutak-atik tampilan form berlangganan feedburner dan fitur lainnya. Ok, selamat berjuang.

Free Template Blogger collection template Hot Deals SEO

Kode warna sangat penting terutama untuk anda yang sering mengotak-atik kode HTML template. Oleh karena itu saya akan membahas cara memasang kode warna blogspot. Ini adalah contoh mesin kode warna yang akan kita buat

Kode warna yang terpilih :

Get it

Cara membuatnya sebagai berikut :

#Langkah 1 :
1. Login ke blogger.

2. kalau sudah masuk ke Dasbor, klik Tata Letak.

3. masuk ke Elemen Halaman

4. Klik Tambah Widget

5. Pilih HTML/Java Sript

6. Masukkan kode JS di bawah ini :

<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]-->

7. Simpan

#Langkah 2 :
1. Buat satu postingan baru.

2. Masukkan kode HTML 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" width="24" height="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><p><a href="http://forantum.blogspot.com/" target="new">Get it</a></p></center>

3. Klik Terbitkan Entri.

Nah Sekarang kita sudah mempunyai mesin kode warna sendiri di blog kita.

Free Template Blogger collection template Hot Deals SEO