tag:blogger.com,1999:blog-29915811121314005832024-03-13T18:04:06.113-07:00Belajar Blogspotbelajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.comBlogger23125tag:blogger.com,1999:blog-2991581112131400583.post-81846886736705401872011-07-25T07:09:00.001-07:002011-07-25T07:09:11.073-07:00Datar Isi<script src="http://buka-rahasia-blogspot-code-host.googlecode.com/files/bukarahasiablogspot.txt">
</script><br />
<script src="http://widodo-miniblog.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-63863502212890769022011-07-20T17:54:00.001-07:002011-07-20T20:46:16.571-07:00Membuat Formulir Di Blogspot<a name='more'></a><br />
Ketika kita berkunjung ke sebuah situs profesional penjual product atau jasa, maka disana kita akan menemukan menu contact. Menu “contact” (kontak) tersebut bisa berupa pemberitahuan alamat lengkap situs tersebut baik secara offline ataupun online dengan menyertakan alamat email, tujuannya tentu saja agar pengunjung situs tersebut bisa mencontact atau menghubungi pihak pemilik situs baik dalam rangka pembelian product atau mengirim pesan lainnya.<br />
<br />
Dan yang paling memudahkan, kita pun menemukan menu contact yang di dalamnya berisi sebuah form khusus yang tidak hanya menampilkan alamat email yang bisa kita hubungi melainkan form contact yang tinggal kita isi tanpa harus membuka email terlebih dahulu (untuk mengirim pesan). Sangat memudahkan bukan? Bagaimana cara membuatnya di blogger? Nah tips dan tutorial kali ini kita akan membuat form kontak seperti web profesional itu di blogger/blogspot… :)<br />
<br />
Sekedar pemberitahuan, Hakimtea.Com Hakimtea.Blogspot.Com sebenarnya telah menggunakan form contact ini sejak posting perdana disini yang launching pada tanggal 16 Januari 2008 lalu, karena berbagai hal saya tidak hadirkan pada list menu di atas. Namun karena sekarang saya menulis tips ini, maka saya hadirkan kembali form kontak saya di list menu di atas sana. Klik saja menu KONTAK saya di atas untuk melihat contoh contact form…:)<br />
<br />
Untuk membuat Contact Form ini kita perlu mendaftar di Bravenet.Com karena bravenet merupakan salah satu yang menyediakan jasa contact form ini, tenang saja its free! Gratisan-Dot-Com ko! :) . Oke kita langsung saja,<br />
<br />
LANGKAH PERTAMA – FIRST STEP (REGISTER/DAFTAR)<br />
<br />
* Masuk ke Bravenet, klik disini.<br />
* Klik banner “Get Your Email Forms” (Its Free)<br />
* Kalau belum punya account bravenet Join Bravenet (daftar gratis)<br />
* Isi form pendaftaran yang tersedia.<br />
<br />
<blockquote>* Username: *nama yang akan digunakan ketika login nanti*<br />
* First Name: *Nama depan*<br />
* Last Name: *Nama belakang*<br />
* Email: *email yang aktif*<br />
* Confirm email: *tuliskan lagi alamat email yg aktif*<br />
* Password: *ketikan kata sandi, hanya Anda yang tahu*<br />
* Confirm Password: *Ketikan lagi kata sandi, harus sama dengan kata sandi pertama*<br />
* Masukan karakter (kode verifikasi) yang ada.<br />
* Ceklist “I agree to the Bravenet Terms of Service”<br />
* Klik join bravenet.<br />
* Tunggu sebentar, proses pendaftaran tengah dimasukan database bravenet.<br />
* Setelah tampil “Complete Your Bravenet Registration” ada tawaran dari sponshor bravenet, lewati saja, scroll down window ke bawah.<br />
* Klik tombol “Proceed to Member’s Area”<br />
* Registrasi hampir selesai. Anda akan dikirim email validitas (validation).<br />
* Login ke email Anda.<br />
* Cari email dari bravenet dengan title “membernotify – “Bravenet Account Confirmation”<br />
* Email bravenet tersebut mengingatkan username dan password yang Anda gunakan untuk login.<br />
* Klik link yang ditunjukkan dibawah kalimat, “Please follow the URL…”<br />
* Tampil windows baru dan ucapan selamat (Congratulations!) Anda telah tergabung menjadi member bravenet.<br />
* Scrol down window dan klik tombol “Continue to Members Area”<br />
* “welcome to your account”<br />
<br />
</blockquote>LANGKAH KEDUA – SECOND STEP (MEMBUAT FORM KONTAK)<br />
<br />
<blockquote>* Masih di member area bravenet<br />
* Pada list menu pilih dan klik “web tools”<br />
* Pada “Unregistered Services” cari “Email Forms” dan klik. (kalo Anda sama sekali belum menggunakan tools dari bravenet, biasanya email forms berada di list kedua baris kedua dibawah Chat Rooms. Ketemu? Oke klik “Email Forms”<br />
* Klik banner “Get Your Email Forms” (Its Free)<br />
* Cari “I would like a FREE Email Forms Service” Klik tombol “Continue”<br />
* Pada “Start with a template” Pilih “Contact Form” (urutan pertama)<br />
* Keluar kotak dialog, beri nama Form Anda (Kalo tidak diberi nama, bravenet secara otomatis memberi nama “Contact Form” klik Ok jika sudah.<br />
* Selamat Anda telah mendapatkan “Contact Form” Anda pertama dan cukup sederhana. Biasanya contact form tersebut hanya berisi (1) First and Last Name (2) E-mail Address (3) Message.<br />
* Klik “I will edit this form”<br />
* Kita akan menambah pertanyaan (Add a new question), agar ketika pengunjung blog kita telah selesai mengisi contact form dan mengklik submit, mereka di arahkan kembali masuk ke homepage blog kita dan tidak masuk ke homepage bravenet.<br />
* Oke, klik “Add a new Question”<br />
* Pada “Add Question” pilih “Question Type – Thank You URL”<br />
* Masukan URL blog Anda pada form yang disediakan. kalo sudah klik tombol “Add Field”.<br />
* (Question Type – Thank You URL, tidak terlihat pada form Anda karena telah di setting hidden (tersembunyi) oleh bravenet)<br />
<br />
</blockquote>Anda bisa mengedit dan menambahi form yang diperlukan, misalnya menambah dengan “Your Blog” dan sebagainya.<br />
<br />
Dalam tips ini kita cukupkan dulu sampai disini karena ini hanya sekedar contoh pembuatan Contact Form sederhana, selanjutnya Anda bisa membuat yang lebih dan sesuai keinginan Anda nanti jika tahap latihan pembuatan dan pemasangan form kontak ini telah selesai.<br />
<br />
LANGKAH KETIGA – THIRD STEP (MEMASANG FORM KONTAK PADA POSTINGAN)<br />
<br />
<blockquote>* Setelah Contact Form di atas selesai dan berisi tiga form isian dengan satu form hidden (nama, email, pesan dan Thank You URL yang tersembunyi dan mengarahkan kembali ke blog kita)<br />
* Klik “It’s perfect, let’s see the code”<br />
* Copy seluruh code html yang ditunjukkan.<br />
* Buat postingan dengan judul “Hubungi saya” atau “Kontak”<br />
* Beri muqodimah, kata-kata sambutan pada postingan Anda, misalkan, “Form kontak ini digunakan bagi Anda yang ingin memesan produk kami bla bla bla…”<br />
* Paste kode html dari bravenet di bawah muqodimah postingan Anda tersebut.<br />
* Simpan/Save postingan Anda.<br />
* Lihat postingan “Kontak” Anda dan silahkan dicoba, diisi dan klik submit!</blockquote><br />
<div style="color: blue;"><blink>Contoh Contact form saya :</blink></div><div><div style="margin: 5px;"><div class="bigfont" style="margin-bottom: 2px;"><input onclick="if
(this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
!= '') {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
= ''; this.innerText = ''; this.value = 'Sembunyikan';
} else {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
= 'none'; this.innerText = ''; this.value = 'Tampilkan'; }" style="margin: 0px; padding: 0px; width: 95px;" type="button" value="Tampilkan" /></div><div class="alt2" style="border: 0px inset; margin: 0px; padding: 6px;"><div style="display: none;"><form accept-charset="utf-8" action="http://pub43.bravenet.com/emailfwd/senddata.php" enctype="multipart/form-data" method="post"><input name="usernum" type="hidden" value="3685374935" /><br />
<input name="cpv" type="hidden" value="2" /><br />
<br />
<table align="center" border="0" cellpadding="0" cellspacing="0"><tbody>
<tr> <td><h3 style="border-bottom: 1px solid black;"><span id="pFormTitle">Data Siswa</span></h3></td> </tr>
<tr> <td><br />
<br />
<label for="Induk" style="float: left; width: 140px;">Induk</label><input id="Induk" maxlength="10" name="Induk" style="width: 50px;" type="text" value="12345" /><br />
<div style="clear: left; height: 20px;"></div><br />
<br />
<label for="Nama" style="float: left; width: 140px;">Nama</label><input id="Nama" maxlength="50" name="Nama" style="width: 300px;" type="text" value="Nama Lengkap" /><br />
<div style="clear: left; height: 20px;"></div><br />
<br />
<label for="Kelas" style="float: left; width: 140px;">Kelas</label><select id="Kelas" name="Kelas"><option value="Kelas 9A">9A</option><option value="Kelas 9B">9B</option><option value="Kelas 9C">9C</option><option value="Kelas 9D">9D</option><option value="Kelas 9E">9E</option><option value="Kelas 9F">9F</option><option value="Kelas 9G">9G</option><option value="Kelas 9H">9H</option><option value="Kelas 9I">9I</option><option value="Kelas 9J">9J</option></select><br />
<div style="clear: left; height: 20px;"></div><br />
<br />
<label style="float: left; width: 140px;">Jenis Kelamin</label><span name="JenisKelamin" style="display: block; width: 400px;"><input id="JenisKelamin1radioOption" name="JenisKelamin" style="background-color: transparent; border: 0px none; vertical-align: middle;" type="radio" value="P" /><label for="JenisKelamin1radioOption">Perempuan</label><input checked="checked" id="JenisKelamin2radioOption" name="JenisKelamin" style="background-color: transparent; border: 0px none; vertical-align: middle;" type="radio" value="L" /><label for="JenisKelamin2radioOption">Laki Laki</label></span><br />
<div style="clear: left; height: 20px;"></div><br />
<br />
<label for="Agama" style="float: left; width: 140px;">Agama</label><select id="Agama" name="Agama"><option selected="selected" value="Islam">Islam</option><option value="Kristen">Kristen</option><option value="Katolik">Katolik</option><option value="Hindu">Hindu</option><option value="Budha">Budha</option></select><br />
<div style="clear: left; height: 20px;"></div><br />
<br />
<label for="Email" style="float: left; width: 140px;">Email</label><input id="Email" maxlength="" name="Email" style="width: 200px;" type="text" value="emailmu@email.com" /><br />
<div style="clear: left; height: 20px;"></div><br />
<br />
<label for="Blog" style="float: left; width: 140px;">Blog</label><input id="Blog" maxlength="" name="Blog" style="width: 200px;" type="text" value="blogmu.blogspot.com" /><br />
<div style="clear: left; height: 20px;"></div><br />
<br />
<label for="Pesan" style="display: block; margin-bottom: 5px;">Pesan</label><textarea id="Pesan" name="Pesan" style="height: 300px; width: 400px;"></textarea><br />
<div style="clear: left; height: 20px;"></div><br />
<br />
</td> </tr>
<tr> <td align="right"><br />
<br />
<br />
<br />
<input type="submit" value=" Submit " /> <input type="reset" value=" Reset " /><br />
<br />
</td> </tr>
</tbody></table><br />
<br />
</form></div></div></div></div><br />
Semoga bermanfaat!belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-82125113800179428212011-07-20T17:46:00.001-07:002011-07-20T20:01:45.774-07:00Membuat Formulir Di Wordpress<a name='more'></a><br />
Salah satu fitur yang tersedia di blog WordPress.com adalah membuat formulir kontak. Sehingga pembaca bisa berinteraksi secara pribadi dengan penulis. Sebelumnya formulir hanya simple saja, berupa nama, email, web dan isi pesan. Namun sekarang fitur ini diperlengkap dengan kemampuan menambah item dalam formulir. Sehingga Anda bisa lebih mengembangkannya, tidak hanya sekedar untuk kontak, namun bisa untuk pendaftaran ataupun pemesanan sesuatu.<br />
<br />
Untuk menambah formulir dapat melalui icon Form di paling kanan.<br />
<br />
Akan ada sebuah menu untuk menseting formulir sesuai keinginan Anda. Anda bisa menambahkan item baik berbentuk text, pilihan ganda dll.<br />
<br />
Jika ada yang mengisi formulir maka akan dikirimkan ke alamat email sesuai yang Anda gunakan di blog atau alamat email sesuai keinginan Anda<br />
<br />
Formulir bisa ditempatkan di postingan maupun di sebuah halaman. Contoh Formulirnya seperti ini:<br />
<br />
Namun formulir ini masih sederhana, belum selengkap plugin2 formulir hosting sendiri (wordpress.org). Namun sudah cukup lumayan apabila Anda ingin sekedar membuat formulir sederhana untuk pendaftaran, pemesanan dan sejenisnya.<br />
<br />
Semoga Bermanfaatbelajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-42800493006891684922011-07-20T05:06:00.000-07:002011-07-20T20:02:14.765-07:00Membuat tombol Spoiler<a name='more'></a><br />
Kali ini membahas tentang cara membuat <span style="font-weight: bold;">tombol hide-show</span> atau juga lebih dikenal dengan istilah <span style="color: red; font-weight: bold;">spoiler</span>. manfaat dari <span style="font-weight: bold;">tombol hide-show</span> atau spoiler ini adalah untuk menyingkat suatu tampilan fitur atau <br />
objek lain. Misalnya saja teman-teman punya artikel yang panjaaang sekali, dan takut kalau para pembaca nantinya merasa jenuh, nah teman-teman bisa menggunakan<span style="font-weight: bold;"> tombol spoiler</span> ini, untuk menyingkat beberapa dari bagian artikelnya teman-teman. Selain itu <span style="font-weight: bold;">tombol spoiler</span> ini tidak hanya berguna untuk tulisan atau teks, akan tetapi juga berguna untuk gambar, serta objek-objek yang dapat ditampilkan di blognya teman-teman yang menggunakan jasa javaScript/ kode HTML. Nah kalau penasaran apa itu spoiler, bisa tuh langsung melihat contoh tampilan berikut ini:<a href="http://www.blogger.com/post-create.g?blogID=2991581112131400583" name="more"></a><br />
<div><div style="margin: 5px;"><br />
<div class="bigfont" style="margin-bottom: 2px;"><div class="alert"><span style="font-weight: bold;"></span></div><div><div style="margin: 5px;"><div style="display: none;"><span style="font-weight: bold;"><span style="font-weight: bold;"><br />
</span></span><br />
<span style="font-weight: bold;"><span style="font-weight: bold;"><br />
</span></span><br />
<span style="font-weight: bold;"><span style="font-weight: bold;"><span style="color: #009900; font-weight: bold;">Silahkan </span></span></span><br />
<span style="font-weight: bold;"><span style="font-weight: bold;"><br />
</span></span></div><div><div mce_style="margin: 5px;" style="margin: 5px;"><div class="bigfont" mce_style="margin-bottom: 2px;" style="margin-bottom: 2px;"><input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }" style="margin: 0px; padding: 0px; width: 95px;" type="button" value="Tampilkan" /></div><div class="alt2" mce_style="border: 0px inset ; margin: 0px; padding: 6px;" style="border: 0px inset; margin: 0px; padding: 6px;"><div mce_style="display: none;" style="display: none;"><br />
<blink><h2>Silahkan diisi apa saja di sini, yang memang dirasa perlu tuk disingkat</h2></blink><br />
<br />
</div></div></div></div></div></div><br />
<br />
</div></div></div><br />
Bagaimana, <del></del><br />
imutkan<br />
baguskan?<br />
<br />
Untuk membuat <span style="font-weight: bold;">tombol spoiler</span>, kita hanya membutuhkan script berikut ini:<br />
<br />
<br />
<br />
<div class="alert"><span style="font-weight: bold;"><div><div style="margin: 5px;"></span><br />
<span style="font-weight: bold;"><div style="margin-bottom: 2px;" class="bigfont"><input style="margin: 0px; padding: 0px; width: 95px; " value="</span><span style="color: #000099; font-weight: bold;">Tampilkan</span><span style="font-weight: bold;">"<br />
onclick="if <br />
(this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display<br />
!= '') { <br />
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display<br />
= ''; this.innerText = ''; this.value = '</span><span style="color: #ff6600; font-weight: bold;">Sembunyikan</span><span style="font-weight: bold;">';<br />
} else { <br />
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display<br />
= 'none'; this.innerText = ''; this.value = '</span><span style="color: #000099; font-weight: bold;">Tampilkan</span><span style="font-weight: bold;">'; }" type="button"/></span><br />
<span style="font-weight: bold;"></div></span><br />
<span style="font-weight: bold;"><div style="border: 0px inset ; margin: 0px; padding: 6px;" class="alt2"></span><br />
<span style="font-weight: bold;"><div style="display: none;"></span><br />
<br />
<span style="color: #009900; font-weight: bold;">Silahkan diisi apa saja di sini, yang memang dirasa perlu tuk disingkat</span><br />
<br />
<span style="font-weight: bold;"></div></div></div></div></span></div><br />
<br />
<br />
<br />
Bagi teman-teman yang belum tahu cara memasangnya, bisa dilakukan melalui langkah-langkah berikut ini:<br />
<br />
<br />
<span style="font-size: 130%;"><span style="color: red; font-weight: bold;">1</span></span>. Login ke <a href="http://blogger.com/" style="font-weight: bold;" target="_blank">blogger.com</a>.<br />
<br />
<span style="color: red; font-size: 130%;"><span style="font-weight: bold;">2</span></span>. Klik <span style="font-weight: bold;">Tata Letak</span>.<br />
<br />
<span style="color: red; font-size: 130%;"><span style="font-weight: bold;">3</span></span>. Klik <span style="color: #000099; font-weight: bold;">Tambah Gadget</span>/ <span style="font-weight: bold;">Add Gadget</span>.<br />
<br />
<span style="color: red; font-size: 130%;"><span style="font-weight: bold;">4</span></span>. Pilih <span style="font-weight: bold;">HTML/JavaScript</span>.<br />
<br />
<span style="color: red; font-size: 130%;"><span style="font-weight: bold;">5</span></span>. Masukkan kode berikut ini, dan jangan lupa klik <span style="color: #ff6600; font-weight: bold;">simpan</span>:<br />
<br />
<br />
<div class="alert"><span style="font-weight: bold;"><div><div style="margin: 5px;"></span><br />
<span style="font-weight: bold;"><div style="margin-bottom: 2px;" class="bigfont"><input style="margin: 0px; padding: 0px; width: 95px; " value="</span><span style="color: #000099; font-weight: bold;">Tampilkan</span><span style="font-weight: bold;">"<br />
onclick="if <br />
(this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display<br />
!= '') { <br />
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display<br />
= ''; this.innerText = ''; this.value = '</span><span style="color: #ff6600; font-weight: bold;">Sembunyikan</span><span style="font-weight: bold;">';<br />
} else { <br />
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display<br />
= 'none'; this.innerText = ''; this.value = '</span><span style="color: #000099; font-weight: bold;">Tampilkan</span><span style="font-weight: bold;">'; }" type="button"/></span><br />
<span style="font-weight: bold;"></div></span><br />
<span style="font-weight: bold;"><div style="border: 0px inset ; margin: 0px; padding: 6px;" class="alt2"></span><br />
<span style="font-weight: bold;"><div style="display: none;"></span><br />
<br />
<span style="color: #009900; font-weight: bold;">Silahkan diisi apa saja di sini, yang memang dirasa perlu tuk disingkat</span><br />
<br />
<span style="font-weight: bold;"></div></div></div></div></span></div><br />
<br />
<br />
<br />
<br />
Ket:<br />
-.<span style="color: #000099; font-weight: bold;">Biru</span>: Silahkan anda ganti dengan kata-kata yang anda inginkan misal: Munculkan, atau show!<br />
-.<span style="color: #ff6600; font-weight: bold;">Orange</span>: Anda bisa menggantinya dengan kata yang anda inginkan, misal: Hide, atau hilangkan!<br />
-.<span style="color: #009900; font-weight: bold;">Hijau</span>: Silahkan disisipi dengan teks atau kode yang memang perlu disingkat.belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-69134415539308659372011-07-20T03:59:00.000-07:002011-07-20T20:03:18.989-07:00Kumpulan Kode Warna<a name='more'></a><br />
Bagi teman teman yang membutuhkan kode <span style="font-weight: bold;"><span style="color: red;">w</span><span style="color: #3333ff;">a</span>r<span style="color: #ffcc00;">n</span><span style="color: #ff6666;">a</span></span>, monggo...<br />
<div style="text-align: center;"><div style="text-align: left;"><br />
Biasanya kode-kode ini digunakan tatkala teman-teman sedang mengedit warna template atau suatu kode yang ada unsur warnanya.<br />
<br />
Oh ya, ngomong-ngomong bagaimana ya cara menggunakannya? Caranya gampang, teman-teman bisa langsung meng-kopas kode yang tertera, contoh:<br />
<span class="black" style="font-weight: bold;">#FFFFFF</span> (Untuk warna putih). Nah bagaimana, gampangkan?<br />
<br />
<br />
Selamat mencari-cari warna:<a href="http://www.blogger.com/post-edit.g?blogID=2991581112131400583&postID=6913441553930865937&from=pencil" name="more"></a></div><br />
</div><table border="0" cellpadding="0" cellspacing="1" class="MsoNormalTable"><tbody>
<tr><td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% white; padding: 1.5pt;"><div class="MsoNormal"><span class="black">#FFFFFF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 255, 204); padding: 1.5pt;"><div class="MsoNormal"><span class="black">#FFFFCC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 255, 153); padding: 1.5pt;"><div class="MsoNormal"><span class="black">#FFFF99</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 255, 102); padding: 1.5pt;"><div class="MsoNormal"><span class="black">#FFFF66</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 255, 51); padding: 1.5pt;"><div class="MsoNormal"><span class="black">#FFFF33</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% yellow; padding: 1.5pt;"><div class="MsoNormal"><span class="black">#FFFF00</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 204, 255); padding: 1.5pt;"><div class="MsoNormal">#FFCCFF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 204, 204); padding: 1.5pt;"><div class="MsoNormal">#FFCCCC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 204, 153); padding: 1.5pt;"><div class="MsoNormal">#FFCC99</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 204, 102); padding: 1.5pt;"><div class="MsoNormal">#FFCC66</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 204, 51); padding: 1.5pt;"><div class="MsoNormal">#FFCC33</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 204, 0); padding: 1.5pt;"><div class="MsoNormal">#FFCC00</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 153, 255); padding: 1.5pt;"><div class="MsoNormal">#FF99FF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 153, 204); padding: 1.5pt;"><div class="MsoNormal">#FF99CC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 153, 153); padding: 1.5pt;"><div class="MsoNormal">#FF9999</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 153, 102); padding: 1.5pt;"><div class="MsoNormal">#FF9966</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 153, 51); padding: 1.5pt;"><div class="MsoNormal">#FF9933</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 153, 0); padding: 1.5pt;"><div class="MsoNormal">#FF9900</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 102, 255); padding: 1.5pt;"><div class="MsoNormal">#FF66FF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 102, 204); padding: 1.5pt;"><div class="MsoNormal">#FF66CC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 102, 153); padding: 1.5pt;"><div class="MsoNormal">#FF6699</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 102, 102); padding: 1.5pt;"><div class="MsoNormal">#FF6666</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 102, 51); padding: 1.5pt;"><div class="MsoNormal">#FF6633</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 102, 0); padding: 1.5pt;"><div class="MsoNormal">#FF6600</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 51, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF33FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 51, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF33CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 51, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF3399</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 51, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF3366</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 51, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF3333</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 51, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF3300</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% fuchsia; padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF00FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 0, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF00CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 0, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF0099</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 0, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF0066</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(255, 0, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF0033</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% red; padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#FF0000</span></div></td> </tr>
<tr> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"></div><div style="text-align: center;"><span style="font-weight: bold;"><br />
<br />
2</span><br />
<br />
</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 255, 255); padding: 1.5pt;"><div class="MsoNormal">#CCFFFF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 255, 204); padding: 1.5pt;"><div class="MsoNormal">#CCFFCC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 255, 153); padding: 1.5pt;"><div class="MsoNormal">#CCFF99</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 255, 102); padding: 1.5pt;"><div class="MsoNormal">#CCFF66</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 255, 51); padding: 1.5pt;"><div class="MsoNormal">#CCFF33</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 255, 0); padding: 1.5pt;"><div class="MsoNormal">#CCFF00</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 204, 255); padding: 1.5pt;"><div class="MsoNormal">#CCCCFF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 204, 204); padding: 1.5pt;"><div class="MsoNormal">#CCCCCC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 204, 153); padding: 1.5pt;"><div class="MsoNormal">#CCCC99</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 204, 102); padding: 1.5pt;"><div class="MsoNormal">#CCCC66</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 204, 51); padding: 1.5pt;"><div class="MsoNormal">#CCCC33</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 204, 0); padding: 1.5pt;"><div class="MsoNormal">#CCCC00</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 153, 255); padding: 1.5pt;"><div class="MsoNormal">#CC99FF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 153, 204); padding: 1.5pt;"><div class="MsoNormal">#CC99CC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 153, 153); padding: 1.5pt;"><div class="MsoNormal">#CC9999</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 153, 102); padding: 1.5pt;"><div class="MsoNormal">#CC9966</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 153, 51); padding: 1.5pt;"><div class="MsoNormal">#CC9933</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 153, 0); padding: 1.5pt;"><div class="MsoNormal">#CC9900</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 102, 255); padding: 1.5pt;"><div class="MsoNormal">#CC66FF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 102, 204); padding: 1.5pt;"><div class="MsoNormal">#CC66CC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 102, 153); padding: 1.5pt;"><div class="MsoNormal">#CC6699</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 102, 102); padding: 1.5pt;"><div class="MsoNormal">#CC6666</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 102, 51); padding: 1.5pt;"><div class="MsoNormal">#CC6633</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 102, 0); padding: 1.5pt;"><div class="MsoNormal">#CC6600</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 51, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC33FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 51, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC33CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 51, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC3399</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 51, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC3366</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 51, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC3333</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 51, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC3300</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 0, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC00FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 0, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC00CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 0, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC0099</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 0, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC0066</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 0, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC0033</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 0, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#CC0000</span></div></td> </tr>
<tr> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"></div><div style="text-align: center;"><span style="font-weight: bold;"><br />
<br />
3</span><br />
<br />
</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 255, 255); padding: 1.5pt;"><div class="MsoNormal">#99FFFF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 255, 204); padding: 1.5pt;"><div class="MsoNormal">#99FFCC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 255, 153); padding: 1.5pt;"><div class="MsoNormal">#99FF99</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 255, 102); padding: 1.5pt;"><div class="MsoNormal">#99FF66</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 255, 51); padding: 1.5pt;"><div class="MsoNormal">#99FF33</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 255, 0); padding: 1.5pt;"><div class="MsoNormal">#99FF00</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 204, 255); padding: 1.5pt;"><div class="MsoNormal">#99CCFF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 204, 204); padding: 1.5pt;"><div class="MsoNormal">#99CCCC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 204, 153); padding: 1.5pt;"><div class="MsoNormal">#99CC99</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 204, 102); padding: 1.5pt;"><div class="MsoNormal">#99CC66</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 204, 51); padding: 1.5pt;"><div class="MsoNormal">#99CC33</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 204, 0); padding: 1.5pt;"><div class="MsoNormal">#99CC00</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 153, 255); padding: 1.5pt;"><div class="MsoNormal">#9999FF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 153, 204); padding: 1.5pt;"><div class="MsoNormal">#9999CC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 153, 153); padding: 1.5pt;"><div class="MsoNormal">#999999</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 153, 102); padding: 1.5pt;"><div class="MsoNormal">#999966</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 153, 51); padding: 1.5pt;"><div class="MsoNormal">#999933</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 153, 0); padding: 1.5pt;"><div class="MsoNormal">#999900</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 102, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#9966FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 102, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#9966CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 102, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#996699</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 102, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#996666</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 102, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#996633</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 102, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#996600</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 51, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#9933FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 51, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#9933CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 51, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#993399</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 51, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#993366</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 51, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#993333</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 51, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#993300</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 0, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#9900FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 0, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#9900CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 0, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#990099</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 0, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#990066</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 0, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#990033</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 0, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#990000</span></div></td> </tr>
<tr> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"></div><div style="text-align: center;"><span style="font-weight: bold;"><br />
<br />
4</span><br />
<br />
</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 255, 255); padding: 1.5pt;"><div class="MsoNormal">#66FFFF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 255, 204); padding: 1.5pt;"><div class="MsoNormal">#66FFCC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 255, 153); padding: 1.5pt;"><div class="MsoNormal">#66FF99</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 255, 102); padding: 1.5pt;"><div class="MsoNormal">#66FF66</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 255, 51); padding: 1.5pt;"><div class="MsoNormal">#66FF33</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 255, 0); padding: 1.5pt;"><div class="MsoNormal">#66FF00</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 204, 255); padding: 1.5pt;"><div class="MsoNormal">#66CCFF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 204, 204); padding: 1.5pt;"><div class="MsoNormal">#66CCCC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 204, 153); padding: 1.5pt;"><div class="MsoNormal">#66CC99</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 204, 102); padding: 1.5pt;"><div class="MsoNormal">#66CC66</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 204, 51); padding: 1.5pt;"><div class="MsoNormal">#66CC33</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 204, 0); padding: 1.5pt;"><div class="MsoNormal">#66CC00</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 153, 255); padding: 1.5pt;"><div class="MsoNormal">#6699FF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 153, 204); padding: 1.5pt;"><div class="MsoNormal">#6699CC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 153, 153); padding: 1.5pt;"><div class="MsoNormal">#669999</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 153, 102); padding: 1.5pt;"><div class="MsoNormal">#669966</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 153, 51); padding: 1.5pt;"><div class="MsoNormal">#669933</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 153, 0); padding: 1.5pt;"><div class="MsoNormal">#669900</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 102, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#6666FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 102, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#6666CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 102, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#666699</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 102, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#666666</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 102, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#666633</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 102, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#666600</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 51, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#6633FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 51, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#6633CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 51, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#663399</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 51, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#663366</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 51, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#663333</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 51, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#663300</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 0, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#6600FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 0, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#6600CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 0, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#660099</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 0, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#660066</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 0, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#660033</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(102, 0, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#660000</span></div></td> </tr>
<tr> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"></div><div style="text-align: center;"><span style="font-weight: bold;"><br />
<br />
5</span><br />
<br />
</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 255, 255); padding: 1.5pt;"><div class="MsoNormal">#33FFFF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 255, 204); padding: 1.5pt;"><div class="MsoNormal">#33FFCC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 255, 153); padding: 1.5pt;"><div class="MsoNormal">#33FF99</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 255, 102); padding: 1.5pt;"><div class="MsoNormal">#33FF66</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 255, 51); padding: 1.5pt;"><div class="MsoNormal">#33FF33</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 255, 0); padding: 1.5pt;"><div class="MsoNormal">#33FF00</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 204, 255); padding: 1.5pt;"><div class="MsoNormal">#33CCFF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 204, 204); padding: 1.5pt;"><div class="MsoNormal">#33CCCC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 204, 153); padding: 1.5pt;"><div class="MsoNormal">#33CC99</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 204, 102); padding: 1.5pt;"><div class="MsoNormal">#33CC66</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 204, 51); padding: 1.5pt;"><div class="MsoNormal">#33CC33</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 204, 0); padding: 1.5pt;"><div class="MsoNormal">#33CC00</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 153, 255); padding: 1.5pt;"><div class="MsoNormal">#3399FF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 153, 204); padding: 1.5pt;"><div class="MsoNormal">#3399CC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 153, 153); padding: 1.5pt;"><div class="MsoNormal">#339999</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 153, 102); padding: 1.5pt;"><div class="MsoNormal">#339966</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 153, 51); padding: 1.5pt;"><div class="MsoNormal">#339933</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 153, 0); padding: 1.5pt;"><div class="MsoNormal">#339900</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 102, 255); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#3366FF</span></span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 102, 204); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#3366CC</span></span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 102, 153); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#336699</span></span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 102, 102); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#336666</span></span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 102, 51); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#336633</span></span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 102, 0); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#336600</span></span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 51, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#3333FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 51, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#3333CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 51, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#333399</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 51, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#333366</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 51, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#333333</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 51, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#333300</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 0, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#3300FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 0, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#3300CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 0, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#330099</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 0, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#330066</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 0, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#330033</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(51, 0, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#330000</span></div></td> </tr>
<tr> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"></div><div style="text-align: center;"><span style="font-weight: bold;"><br />
<br />
6</span><br />
<br />
</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% aqua; padding: 1.5pt;"><div class="MsoNormal"><span class="black">#00FFFF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 255, 204); padding: 1.5pt;"><div class="MsoNormal"><span class="black">#00FFCC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 255, 153); padding: 1.5pt;"><div class="MsoNormal"><span class="black">#00FF99</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 255, 102); padding: 1.5pt;"><div class="MsoNormal"><span class="black">#00FF66</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 255, 51); padding: 1.5pt;"><div class="MsoNormal"><span class="black">#00FF33</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% lime; padding: 1.5pt;"><div class="MsoNormal"><span class="black">#00FF00</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 204, 255); padding: 1.5pt;"><div class="MsoNormal">#00CCFF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 204, 204); padding: 1.5pt;"><div class="MsoNormal">#00CCCC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 204, 153); padding: 1.5pt;"><div class="MsoNormal">#00CC99</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 204, 102); padding: 1.5pt;"><div class="MsoNormal">#00CC66</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 204, 51); padding: 1.5pt;"><div class="MsoNormal">#00CC33</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 204, 0); padding: 1.5pt;"><div class="MsoNormal">#00CC00</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 153, 255); padding: 1.5pt;"><div class="MsoNormal">#0099FF</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 153, 204); padding: 1.5pt;"><div class="MsoNormal">#0099CC</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 153, 153); padding: 1.5pt;"><div class="MsoNormal">#009999</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 153, 102); padding: 1.5pt;"><div class="MsoNormal">#009966</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 153, 51); padding: 1.5pt;"><div class="MsoNormal">#009933</div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 153, 0); padding: 1.5pt;"><div class="MsoNormal">#009900</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 102, 255); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#0066FF</span></span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 102, 204); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#0066CC</span></span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 102, 153); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#006699</span></span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 102, 102); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#006666</span></span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 102, 51); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#006633</span></span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 102, 0); padding: 1.5pt;"><div class="MsoNormal"><span class="white"><span style="color: white;">#006600</span></span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 51, 255); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#0033FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 51, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#0033CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 51, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#003399</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 51, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#003366</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 51, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#003333</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 51, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#003300</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% blue; padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#0000FF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 0, 204); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#0000CC</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 0, 153); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#000099</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 0, 102); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#000066</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 0, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#000033</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% black; padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#000000</span></div></td> </tr>
<tr> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"></div><div style="text-align: center;"><span style="font-weight: bold;"><br />
<br />
7</span><br />
<br />
</div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(70, 85, 132); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#465584</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(238, 242, 247); padding: 1.5pt;"><div class="MsoNormal"><span style="color: black;">#EEF2F7</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(58, 79, 108); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#3A4F6C</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 0, 221); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#00D</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(67, 73, 81); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#434951</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(85, 85, 85); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#555</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(119, 119, 119); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#777</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(223, 230, 239); padding: 1.5pt;"><div class="MsoNormal"><span style="color: black;">#DFE6EF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(52, 84, 135); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#345487</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(245, 249, 253); padding: 1.5pt;"><div class="MsoNormal"><span style="color: black;">#F5F9FD</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(56, 96, 187); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#3860BB</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(188, 208, 237); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#BCD0ED</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(194, 207, 223); padding: 1.5pt;"><div class="MsoNormal"><span style="color: black;">#C2CFDF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(240, 245, 250); padding: 1.5pt;"><div class="MsoNormal"><span style="color: black;">#F0F5FA</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(209, 220, 235); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#D1DCEB</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(0, 0, 51); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#003</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(153, 0, 0); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#900 </span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(204, 233, 253); padding: 1.5pt;"><div class="MsoNormal"><span style="color: black;">#CCE9FD</span></div></td> </tr>
<tr> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(228, 234, 242); padding: 1.5pt;"><div class="MsoNormal"><span style="color: black;">#E4EAF2</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(76, 119, 182); padding: 1.5pt;"><div class="MsoNormal"><span style="color: white;">#4C77B6</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(223, 230, 239); padding: 1.5pt;"><div class="MsoNormal"><span style="color: black;">#DFE6EF</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(238, 242, 247); padding: 1.5pt;"><div class="MsoNormal"><span style="color: black;">#EEF2F7</span></div></td> <td style="-moz-background-inline-policy: -moz-initial; background: none repeat scroll 0% 50% rgb(250, 252, 254); padding: 1.5pt;"><div class="MsoNormal"><br />
</div></td> <td style="padding: 1.5pt;"><div class="MsoNormal"><span style="font-size: 10pt;"> </span></div><br />
</td></tr>
</tbody></table><br />
<br />
Pasang Kode2 warna di atas ke blog teman2 dengan mengkopi-paste kode berikut<br />
<br />
<div><div style="margin: 5px;"><div class="bigfont" style="margin-bottom: 2px;"><input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }" style="margin: 0px; padding: 0px; width: 95px;" type="button" value="Tampilkan" /></div><div class="alt2" style="border: 0px inset; margin: 0px; padding: 6px;"><div style="display: none;"><br />
</div><table class="MsoNormalTable" style="" border="0" cellpadding="0" cellspacing="1"><tbody><tr style=""><td style="padding: 1.5pt; background: white none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"><p class="MsoNormal"><span class="black">#FFFFFF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 255, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#FFFFCC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 255, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#FFFF99</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 255, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#FFFF66</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 255, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#FFFF33</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: yellow none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#FFFF00</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(255, 204, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FFCCFF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 204, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FFCCCC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 204, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FFCC99<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 204, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FFCC66<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 204, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FFCC33<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 204, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FFCC00<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(255, 153, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF99FF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 153, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF99CC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 153, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF9999<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 153, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF9966<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 153, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF9933<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 153, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF9900<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(255, 102, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF66FF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 102, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF66CC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 102, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF6699<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 102, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF6666<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 102, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF6633<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 102, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#FF6600<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(255, 51, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF33FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 51, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF33CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 51, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF3399</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 51, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF3366</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 51, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF3333</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 51, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF3300</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: fuchsia none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF00FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 0, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF00CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 0, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF0099</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 0, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF0066</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(255, 0, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF0033</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: red none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#FF0000</span><o:p></o:p></p> </td> </tr> <tr style=""> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"> </div><div style="text-align: center;"><!--[if gte vml 1]><v:shapetype id="_x0000_t75" coordsize="21600,21600" spt="75" preferrelative="t" path="m@4@5l@4@11@9@11@9@5xe" filled="f" stroked="f"> <v:stroke joinstyle="miter"> <v:formulas> <v:f eqn="if lineDrawn pixelLineWidth 0"> <v:f eqn="sum @0 1 0"> <v:f eqn="sum 0 0 @1"> <v:f eqn="prod @2 1 2"> <v:f eqn="prod @3 21600 pixelWidth"> <v:f eqn="prod @3 21600 pixelHeight"> <v:f eqn="sum @0 0 1"> <v:f eqn="prod @6 1 2"> <v:f eqn="prod @7 21600 pixelWidth"> <v:f eqn="sum @8 21600 0"> <v:f eqn="prod @7 21600 pixelHeight"> <v:f eqn="sum @10 21600 0"> </v:formulas> <v:path extrusionok="f" gradientshapeok="t" connecttype="rect"> <o:lock ext="edit" aspectratio="t"> </v:shapetype><v:shape id="_x0000_i1025" type="#_x0000_t75" alt="" style="'width:7.5pt;"><![endif]--><!--[if !vml]--><span style="font-weight: bold;"><br />2</span><br /></div><p class="MsoNormal"><!--[endif]--><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(204, 255, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCFFFF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 255, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCFFCC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 255, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCFF99<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 255, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCFF66<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 255, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCFF33<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 255, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCFF00<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(204, 204, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCCCFF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 204, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCCCCC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 204, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCCC99<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 204, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCCC66<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 204, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCCC33<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 204, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CCCC00<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(204, 153, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC99FF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 153, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC99CC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 153, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC9999<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 153, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC9966<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 153, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC9933<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 153, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC9900<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(204, 102, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC66FF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 102, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC66CC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 102, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC6699<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 102, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC6666<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 102, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC6633<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 102, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#CC6600<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(204, 51, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC33FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 51, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC33CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 51, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC3399</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 51, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC3366</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 51, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC3333</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 51, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC3300</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(204, 0, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC00FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 0, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC00CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 0, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC0099</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 0, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC0066</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 0, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC0033</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 0, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#CC0000</span><o:p></o:p></p> </td> </tr> <tr style=""> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"> </div><div style="text-align: center;"><!--[if gte vml 1]><v:shape id="_x0000_i1026" type="#_x0000_t75" alt="" style="'width:7.5pt;height:1.5pt'/"><![endif]--><!--[if !vml]--><span style="font-weight: bold;"><br />3</span><br /></div><p class="MsoNormal"><!--[endif]--><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(153, 255, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99FFFF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 255, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99FFCC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 255, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99FF99<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 255, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99FF66<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 255, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99FF33<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 255, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99FF00<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(153, 204, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99CCFF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 204, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99CCCC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 204, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99CC99<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 204, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99CC66<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 204, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99CC33<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 204, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#99CC00<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(153, 153, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#9999FF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 153, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#9999CC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 153, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#999999<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 153, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#999966<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 153, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#999933<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 153, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#999900<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(153, 102, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#9966FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 102, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#9966CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 102, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#996699</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 102, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#996666</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 102, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#996633</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 102, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#996600</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(153, 51, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#9933FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 51, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#9933CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 51, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#993399</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 51, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#993366</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 51, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#993333</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 51, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#993300</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(153, 0, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#9900FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 0, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#9900CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 0, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#990099</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 0, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#990066</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 0, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#990033</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 0, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#990000</span><o:p></o:p></p> </td> </tr> <tr style=""> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"> </div><div style="text-align: center;"><!--[if gte vml 1]><v:shape id="_x0000_i1027" type="#_x0000_t75" alt="" style="'width:7.5pt;height:1.5pt'/"><![endif]--><!--[if !vml]--><span style="font-weight: bold;"><br />4</span><br /></div><p class="MsoNormal"><!--[endif]--><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(102, 255, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66FFFF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 255, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66FFCC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 255, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66FF99<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 255, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66FF66<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 255, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66FF33<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 255, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66FF00<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(102, 204, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66CCFF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 204, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66CCCC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 204, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66CC99<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 204, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66CC66<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 204, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66CC33<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 204, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#66CC00<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(102, 153, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#6699FF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 153, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#6699CC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 153, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#669999<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 153, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#669966<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 153, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#669933<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 153, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#669900<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(102, 102, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#6666FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 102, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#6666CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 102, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#666699</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 102, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#666666</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 102, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#666633</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 102, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#666600</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(102, 51, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#6633FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 51, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#6633CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 51, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#663399</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 51, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#663366</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 51, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#663333</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 51, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#663300</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(102, 0, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#6600FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 0, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#6600CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 0, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#660099</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 0, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#660066</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 0, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#660033</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(102, 0, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#660000</span><o:p></o:p></p> </td> </tr> <tr style=""> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"> </div><div style="text-align: center;"><!--[if gte vml 1]><v:shape id="_x0000_i1028" type="#_x0000_t75" alt="" style="'width:7.5pt;height:1.5pt'/"><![endif]--><!--[if !vml]--><span style="font-weight: bold;"><br />5</span><br /></div><p class="MsoNormal"><!--[endif]--><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(51, 255, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33FFFF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 255, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33FFCC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 255, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33FF99<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 255, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33FF66<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 255, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33FF33<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 255, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33FF00<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(51, 204, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33CCFF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 204, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33CCCC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 204, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33CC99<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 204, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33CC66<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 204, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33CC33<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 204, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#33CC00<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(51, 153, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#3399FF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 153, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#3399CC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 153, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#339999<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 153, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#339966<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 153, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#339933<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 153, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#339900<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(51, 102, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#3366FF</span></span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 102, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#3366CC</span></span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 102, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#336699</span></span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 102, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#336666</span></span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 102, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#336633</span></span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 102, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#336600</span></span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(51, 51, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#3333FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 51, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#3333CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 51, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#333399</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 51, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#333366</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 51, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#333333</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 51, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#333300</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(51, 0, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#3300FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 0, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#3300CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 0, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#330099</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 0, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#330066</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 0, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#330033</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(51, 0, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#330000</span><o:p></o:p></p> </td> </tr> <tr style=""> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"> </div><div style="text-align: center;"><!--[if gte vml 1]><v:shape id="_x0000_i1029" type="#_x0000_t75" alt="" style="'width:7.5pt;height:1.5pt'/"><![endif]--><!--[if !vml]--><span style="font-weight: bold;"><br />6</span><br /></div><p class="MsoNormal"><!--[endif]--><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: aqua none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#00FFFF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 255, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#00FFCC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 255, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#00FF99</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 255, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#00FF66</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 255, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#00FF33</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: lime none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="black">#00FF00</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(0, 204, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#00CCFF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 204, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#00CCCC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 204, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#00CC99<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 204, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#00CC66<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 204, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#00CC33<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 204, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#00CC00<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(0, 153, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#0099FF<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 153, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#0099CC<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 153, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#009999<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 153, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#009966<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 153, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#009933<o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 153, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal">#009900<o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(0, 102, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#0066FF</span></span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 102, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#0066CC</span></span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 102, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#006699</span></span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 102, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#006666</span></span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 102, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#006633</span></span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 102, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span class="white"><span style="color:white;">#006600</span></span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(0, 51, 255) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#0033FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 51, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#0033CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 51, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#003399</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 51, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#003366</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 51, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#003333</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 51, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#003300</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: blue none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#0000FF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 0, 204) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#0000CC</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 0, 153) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#000099</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 0, 102) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#000066</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 0, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#000033</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: black none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#000000</span><o:p></o:p></p> </td> </tr> <tr style=""> <td colspan="6" style="padding: 1.5pt;"><div style="text-align: center;"> </div><div style="text-align: center;"><!--[if gte vml 1]><v:shape id="_x0000_i1030" type="#_x0000_t75" alt="" style="'width:7.5pt;height:1.5pt'/"><![endif]--><!--[if !vml]--><span style="font-weight: bold;"><br />7</span><br /></div><p class="MsoNormal"><!--[endif]--><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(70, 85, 132) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#465584</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(238, 242, 247) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:black;">#EEF2F7</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(58, 79, 108) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#3A4F6C</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 0, 221) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#00D</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(67, 73, 81) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#434951</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(85, 85, 85) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#555</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(119, 119, 119) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#777</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(223, 230, 239) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:black;">#DFE6EF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(52, 84, 135) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#345487</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(245, 249, 253) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:black;">#F5F9FD</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(56, 96, 187) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#3860BB</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(188, 208, 237) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#BCD0ED</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(194, 207, 223) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:black;">#C2CFDF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(240, 245, 250) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:black;">#F0F5FA</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(209, 220, 235) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#D1DCEB</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(0, 0, 51) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#003</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(153, 0, 0) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#900 </span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(204, 233, 253) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:black;">#CCE9FD</span><o:p></o:p></p> </td> </tr> <tr style=""> <td style="padding: 1.5pt; background: rgb(228, 234, 242) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:black;">#E4EAF2</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(76, 119, 182) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:white;">#4C77B6</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(223, 230, 239) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:black;">#DFE6EF</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(238, 242, 247) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><span style="color:black;">#EEF2F7</span><o:p></o:p></p> </td> <td style="padding: 1.5pt; background: rgb(250, 252, 254) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"> <p class="MsoNormal"><br /><o:p></o:p></p> </td> <td style="padding: 1.5pt;"> <p class="MsoNormal"><span style="font-size:10pt;"><o:p> </o:p></span></p><br /></td></tr></tbody></table><br />
<br />
<br />
</div></div></div></div>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-48913706609266583902011-07-20T03:01:00.000-07:002011-07-20T03:01:47.355-07:00Teks melayang mengikuti kursor<a name='more'></a>Bagaimana membuat teks melayang mengikuti kursor, seperti contoh didemo ini, Dibawah ini adalah tahap untuk membuatnya:<br />
<br />
Untuk yang pertama kita bisa masuk ke account blog---> Lalu ke menu (tata letak)--->Pilih (tambah gadget)<br />
Kemudian tambah (html/javascript), dan anda bisa copy kode dibawah ini:<br />
<br />
<br />
<blockquote><code><script>//mouse</code><br />
<code>//Circling text trail- Tim Tilton</code><br />
<code>//Website: http://www.tempermedia.com/</code><br />
<code>//Visit http://www.dynamicdrive.com for this script and more</code><br />
<code>function cursor_text_circle(){</code><br />
<code>// your message here</code><br />
<code>var msg='<span mce_style="color: #3366ff;" style="color: #3366ff;">selamat datang</span>'.split('').reverse().join('');</code><br />
<code>var font='Verdana,Arial';</code><br />
<code>var size=3; // up to seven</code><br />
<code>var color='#<span mce_style="color: #3366ff;" style="color: #3366ff;">#0000FF</span>';</code><br />
<code>// This is not the rotation speed, its the reaction speed, keep low!</code><br />
<code>// Set this to 1 for just plain rotation w/out drag</code><br />
<code>var speed=.3;</code><br />
<code>// This is the rotation speed, set it negative if you want</code><br />
<code>// it to spin clockwise</code><br />
<code>var rotation=-.2;</code><br />
<code>// Alter no variables past here!, unless you are good</code><br />
<code>//---------------------------------------------------</code><br />
<code>var ns=(document.layers);</code><br />
<code>var ie=(document.all);</code><br />
<code>var dom=document.getElementById;</code><br />
<code>msg=msg.split('');</code><br />
<code>var n=msg.length;</code><br />
<code>var a=size*13;</code><br />
<code>var currStep=0;</code><br />
<code>var ymouse=0;</code><br />
<code>var xmouse=0;</code><br />
<code>var props="<font face="+font+" color="+color+" size="+size+">";</code><br />
<code>if (ie)</code><br />
<code>window.pageYOffset=0</code><br />
<code>// writes the message</code><br />
<code>if (ns){</code><br />
<code>for (i=0; i < n; i++)</code><br />
<code>document.write('<layer</code><br />
<code> left="0" top="0" width="+a+" name="nsmsg'+i+'" </code><br />
<code> height="+a+"><center>'+props+msg[i]+'</font></center></layer>');</code><br />
<code>}</code><br />
<code>else if (ie||dom){</code><br />
<code>document.write('<div</code><br />
<code> id="outer" </code><br />
<code> style="position:absolute;top:0px;left:0px;z-index:30000;"><div </code><br />
<code> style="position:relative">');</code><br />
<code>for (i=0; i < n; i++)</code><br />
<code>document.write('<div</code><br />
<code> id="iemsg'+(dom&&!ie? i:'')+'" </code><br />
<code> style="position:absolute;top:0px;left:0;height:'+a+'px;width:'+a+'px;text-align:center;font-weight:normal;cursor:default">'+props+msg[i]+'</font></div>');</code><br />
<code>document.write('</div></div>');</code><br />
<code>}</code><br />
<code>(ns)?window.captureEvents(Event.MOUSEMOVE):0;</code><br />
<code>function Mouse(evnt){</code><br />
<code>ymouse = (ns||(dom&&!ie))?evnt.pageY+20-(window.pageYOffset):event.y; // y-position</code><br />
<code>xmouse = (ns||(dom&&!ie))?evnt.pageX+20:event.x-20; // x-position</code><br />
<code>}</code><br />
<code>if (ns||ie||dom)</code><br />
<code>(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;</code><br />
<code>var y=new Array();</code><br />
<code>var x=new Array();</code><br />
<code>var Y=new Array();</code><br />
<code>var X=new Array();</code><br />
<code>for (i=0; i < n; i++){</code><br />
<code>y[i]=0;</code><br />
<code>x[i]=0;</code><br />
<code>Y[i]=0;</code><br />
<code>X[i]=0;</code><br />
<code>}</code><br />
<code>var iecompattest=function(){</code><br />
<code>return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;</code><br />
<code>}</code><br />
<code>var makecircle=function(){ // rotation properties</code><br />
<code>if (ie) outer.style.top=iecompattest().scrollTop+'px';</code><br />
<code>currStep-=rotation;</code><br />
<code>for (i=0; i < n; i++){ // makes the circle</code><br />
<code>var d=(ns)?document.layers['nsmsg'+i]:ie? iemsg[i].style:document.getElementById('iemsg'+i).style;</code><br />
<code>d.top=y[i]+a*Math.sin((currStep+i*1)/3.8)+window.pageYOffset-15+(ie||dom? 'px' : '');</code><br />
<code>d.left=x[i]+a*Math.cos((currStep+i*1)/3.8)*2+(ie||dom? 'px' : ''); // remove *2 for just a plain circle, not oval</code><br />
<code>}</code><br />
<code>}</code><br />
<code>var drag=function(){ // makes the resistance</code><br />
<code>y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);</code><br />
<code>x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);</code><br />
<code>for (var i=1; i < n; i++){</code><br />
<code>y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);</code><br />
<code>x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);</code><br />
<code>}</code><br />
<code>makecircle();</code><br />
<code>// not rotation speed, leave at zero</code><br />
<code>setTimeout(function(){drag();},10);</code><br />
<code>}</code><br />
<code>if (ns||ie||dom)</code><br />
<code>if ( typeof window.addEventListener != "undefined" )</code><br />
<code>window.addEventListener( "load", drag, false );</code><br />
<code>else if ( typeof window.attachEvent != "undefined" )</code><br />
<code>window.attachEvent( "onload", drag );</code><br />
<code>else {</code><br />
<code>if ( window.onload != null ) {</code><br />
<code>var oldOnload = window.onload;</code><br />
<code>window.onload = function ( e ) {</code><br />
<code>oldOnload( e );</code><br />
<code>drag();</code><br />
<code>};</code><br />
<code>}</code><br />
<code>else</code><br />
<code>window.onload = drag;</code><br />
<code>}</code><br />
<code>}</code><br />
<code>cursor_text_circle(); </script></code></blockquote><br />
Untuk teks yang berwarna biru (selamat datang) bisa diganti sesuai yang diinginkan teman-teman dan kode (#0000FF) adalah warna pada teks juga bisa diganti menjadi warna yang berbeda sesuai yang diinginkan juga. Untuk warna yang lain bisa mengunjungi blog teman saya <a href="http://smekanfive.blogspot.com/2009/02/aaaaaaaaaaaaaaa.html" mce_href="http://smekanfive.blogspot.com/2009/02/aaaaaaaaaaaaaaa.html">disini</a><br />
<br />
<blink><b><span style="color: red;">Selamat mencoba</span></b></blink>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-11470335907492021352011-07-19T23:16:00.000-07:002011-07-25T07:15:29.946-07:00Buku Tamu Melayang<a name='more'></a><br />
Pernah tidak melihat sebuah blog yang di samping kanan atas ada gambar bertulisan Buku Tamu, yang kalau diklik akan keluar form isian yang menanyakan Nama, Website dan Message. Buku Tamu tersebut melayang artinya tidak terpengaruh oleh scroll mouse, walaupun mouse digulir kebawah Buku Tamu tersebut tetap nampak. Mau tahu caranya?<br />
<br />
<ol><li>Sign in ke blogger dan silahkan Login dengan Account Anda</li>
<li>Pilih Layout/Tata Letak</li>
<li>Pilih Page Elemen/Elemen Halaman<span class="fullpost"></span></li>
<li>Klik Add a Gadget/Tambah Gadget<span class="fullpost"></span></li>
<li>Lalu pilih "HTML/JavaScript"<span class="fullpost"></span></li>
Kemudian Copy-Paste kode di bawah ini :</ol><blockquote><ol><style type="text/css"> #gb{ position:fixed; top:50px; z-index:+1000; } * html #gb{position:relative;} .gbtab{ height:100px; width:30px; float:left; cursor:pointer; background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat; } .gbcontent{ float:left; border:2px solid #A5BD51; background:#F5F5F5; padding:10px; } </style> <script type="text/javascript"> function showHideGB(){ var gb = document.getElementById("gb"); var w = gb.offsetWidth; gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0); gb.opened = !gb.opened; } function moveGB(x0, xf){ var gb = document.getElementById("gb"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; gb.style.right = x.toString() + "px"; if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} } </script> <div id="gb"> <div class="gbtab" onclick="showHideGB()"> </div> <div class="gbcontent"> <span mce_style="color: red;" style="color: red;">Letakkan disini</span> <br/> Anda berminat buat Buku Tamu seperti ini?<br/> <a href="http://paksi-dirgantara.blogspot.com"> Klik disini </a> <div style="text-align:right"> <a href="javascript:showHideGB()"> [tutup] </a> </div> </div> </div> <script type="text/javascript"> var gb = document.getElementById("gb"); gb.style.right = (30-gb.offsetWidth).toString() + "px"; </script> </ol></blockquote>6. Ganti Tulisan berwarna merah dengan kode shoutmix anda. <br />
<br />
7. Selamat Mencobabelajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-54491889723542499332011-07-19T22:38:00.000-07:002011-07-19T22:44:31.544-07:00Membuat Buku Tamu<a name='more'></a>Memasang sebuah <b>buku tamu</b> (shoutbox/guestbook) pada sebuah blog adalah hal yang cukup lumayan penting,karena buku tamu ini merupakan salah satu sarana untuk berinteraksi antara yang mpunya blog dengan para pengunjung blog. Dengan di pajangnya buku tamu di dalam blog, maka para pengunjung dapat mengungkapkan isi hatinya tentang blog yang anda buat, yang pasti isi dari sebuah buku tamu ini sangatlah bervariasi bisa merupakan pujian, pertanyaan, sekedar iseng, atau ada juga merupakan kritikan terhadap isi blog anda, dan justru dengan adanya variasi itulah membuat blog kita jadi hidup lebih hidu (kaya iklan aja). <br />
<br />
Ok, terlalu lama intermezonya ya, sekarang kita kembali (ke lap...top) ke topikbahasan. Bagaimana caranya mendapatkan sebuah buku tamu. Untuk mendapatkannya sangat mudah, anda tinggal mencarinya pada mesin pencari semisal google ataupun yahoo, silahkan ketikan kata free shoutbox atau free guestbook pada search engine masing-masing situs, maka dalam beberapa detik saja akan muncul berpuluh-puluh situs penyedia buku tamu tadi, anda tinggal klik lalu coba lihat-lihat. Tapi untuk menghemat waktu pencarian anda, maka di sini saya akan langsung memberikan alamat situs penyedia buku tamu yang servernya lumayan bagus dan jarang sekali mengalami down yakni <a href="http://www.shoutmix.com/"><b>http://www.shoutmix.com</b></a>. Untuk caranya silahkan anda ikuti langkah-langkah berikut ini : <br />
<br />
<ol><li>Seperti biasa anda harus daftar terlebih dahulu dengan cara mengklik tulisan Get One noe, free>>, ataupun dengan mengklik tulisan Sign Up, silahkan anda tulis data-data anda pada form yang telah di sediakan. </li>
<li>Jika sudah tedaftar, dan di terima jadi anggota shoutmix, silahkan anda login dengan id anda </li>
<li>Pada kolom yang berjudul <b>Style</b>, klik menu <b>appearance</b>. </li>
<li>Silahkan klik menu <i>pulldown</i> di samping tulisan Load From Preset untuk mengatur tampilan buku tamu anda, silahkan pilih yang sesuai dengan keinginan anda. Jika sudah selesai klik <b>Save Setting</b>.</li>
<li>Untuk mendapatkan kode HTML dari shoutbox anda, silahkan klik <b>Use Shoutbox</b> yang berada di bawah menu <b>Quick Start</b></li>
<li>Klik tulisan <b>Place Shoutbox on web page</b>. Isi lebar dan tinggi shoutbox yang di inginkan </li>
<li>Copy seluruh kode HTML yang ada pada text area yang berada di bawah tulisan <b>Generated Codes</b>, lalu simpan di program Notepad anda</li>
<li>Klik Log out yang berada di atas layar anda untuk keluar dari halaman shoutmix anda. Silahkan close situs tersebut.</li>
<li>Selesai </li>
</ol><br />
Untuk menempatkan kode HTML shoutbox tadi pada blog anda, silahkan ikuti langkah-langkah berikut ini.<br />
<b>Untuk blogger dengan template klasik</b> :<br />
<ol><li>Log in terlebih dahulu ke blogger.com dengan id anda </li>
<li>Klik menu <b>Template</b></li>
<li>Klik <b>Edit HTML</b></li>
<li>Paste kode HTML shoutbox anda yang telah di copy pada notepad tadi di tempat yang anda inginkan</li>
<li>Untuk jelasnya saya ambil contoh dengan shoubox milik saya, untuk menempatkannya tinggal klik Edit pada browser lalu pilih Find (on this page).. trus tuliskan kata buku tamu lalu klik find, maka kita akan langsung di bawa ke tulisan tersebut. Jika sudah ketemu tulisan tadi silahkan paste kode HTML shoutbox nya. </li>
<li>Klik tombol <b>Preview</b> untuk melihat perubahan yang kita buat.</li>
<li>Jika sudah cocok dengan perubahan tadi, klik <b>Save Template Changes</b></li>
<li>Selesai</li>
</ol><br />
Sedikit Clue, agar shoutbox anda sesuai dengan ukuran lebar sidebar , anda bisa merubah ukuran lebar ataupun tinggi dari shoutbox , caranya anda tinggal merubah angka Width (untuk lebar) dan Height (untuk tinggi) dari dalam kode HTML shoutbox tersebut. <br />
<br />
<b>Untuk Blogger baru</b> :<br />
<ol><li>Silahkan Login dengan id anda </li>
<li>Klik menu <b>Layout</b></li>
<li>Klik <b>Page Element</b></li>
<li>Klik <b>Add a Page Element</b></li>
<li>Klik tombol<b> Add to Blog</b> yang berada di bawah tulisan <b>HTML/JavaScript</b> </li>
<li>Tuliskan judul shoutbox anda pada form title. Contoh : Buku tamu ku, atau my guestbook atau apa saja yang anda suka</li>
<li>Copy paste kode HTML shoutbox anda di dalam form <b>Content</b> </li>
<li>Klik tombol <b>Save Changes</b></li>
<li>Drag & Drop element yang telah anda buat tadi di tempat yang di sukai</li>
<li>Tekan tombol <b>Save</b></li>
<li>Selesai</li>
</ol><br />
Selamat mencoba ! <br />
<br />
Sebagai tambahan, guestbook yang sering dipakai para blogger lainnya :<br />
<ol><li><a href="http://oggix.com/" rel="nofollow" target="_blank" title="untuk menuju oggix.com. silahkan klik di sini">http://oggix.com</a></li>
</ol>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-21142240449952785972011-07-19T12:54:00.000-07:002011-07-19T12:55:30.355-07:00Membuat Situs Penyedia Hosting Gratis<div style="text-align: justify;"><a href="http://www.wahyu-winoto.com/2011/07/membuat-situs-penyedia-hosting-gratis.html"><b></b></a><br />
<a name='more'></a><a href="http://www.wahyu-winoto.com/2011/07/membuat-situs-penyedia-hosting-gratis.html"><b><br />
</b><b></b></a></div>Buat teman-teman yang tertarik ingin membuat situs penyedia hosting gratis silahkan simak baik-baik panduan berikut ini.<br />
<div style="text-align: justify;"><br />
</div><div style="text-align: justify;"><b>Langkah 1</b></div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;"><b>Daftar dan Buat Domain untuk situs kamu (gunakan saja domain gratis dari www.co.cc)</b></div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Buat Domain utama yang akan kamu gunakan sebagai alamat situs penyedia layanan hosting gratis punya kamu sendiri.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">-<span class="Apple-tab-span" style="white-space: pre;"> </span>pertama, masuk ke situs www.co.cc</div><div style="text-align: justify;">-<span class="Apple-tab-span" style="white-space: pre;"> </span>lakukan pendaftaran untuk mendapatkan Akun buat kamu.</div><div style="text-align: justify;">-<span class="Apple-tab-span" style="white-space: pre;"> </span>Setelah memiliki Akun di www.co.cc lalu buatlah nama Domain yang kamu inginkan . (dalam hal ini saya pakai contoh situs punya saya yaitu http://freehostindo.co.cc)</div><div style="text-align: justify;">-<span class="Apple-tab-span" style="white-space: pre;"> </span>Setelah berhasil mendapatkan nama domain lalu klik Set Up dan masukkan Name Server untuk domain kamu itu. Name Server-nya adalah:</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">NS1.MAIN-HOSTING.COM</div><div style="text-align: justify;">NS2.MAIN-HOSTING.COM</div><div style="text-align: justify;">NS3.MAIN-HOSTING.COM</div><div style="text-align: justify;">NS4.MAIN-HOSTING.COM</div><div style="text-align: justify;">NS5.MAIN-HOSTING.COM</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;"><br />
</div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://2.bp.blogspot.com/-Rr_EblISkpU/TiSvTnPDLTI/AAAAAAAACdU/Vy-Li-nOdMo/s1600/masukkan+ns+pada+co+cc.JPG" style="margin-left: auto; margin-right: auto;"><img border="0" height="205" src="http://2.bp.blogspot.com/-Rr_EblISkpU/TiSvTnPDLTI/AAAAAAAACdU/Vy-Li-nOdMo/s400/masukkan+ns+pada+co+cc.JPG" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><i>Masukkan Name Server</i></td></tr>
</tbody></table><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">(Dalam langkah pertama ini sebenarnya akan lebih baik jika kamu menggunakan nama domain premium seperti .com atau .net agar situs hosting pribadimu nanti terlihat lebih professional, namun jika sekedar untuk latihan silahkan gunakan .co.cc)</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Setelah semua beres, lalu tutup saja www.co.cc dan lanjut ke langkah ke 2</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;"><b>Langkah ke 2</b></div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;"><b>Daftar Reseller Hosting Gratis dari Youhosting.com dan Buat Situs Layanan Hosting Gratis</b></div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">1.<span class="Apple-tab-span" style="white-space: pre;"> </span>Buka www.youhosting.com</div><div style="text-align: justify;">2.<span class="Apple-tab-span" style="white-space: pre;"> </span>Mendaftarlah disana dengan klik Sign Up, lalu isi form Pendaftarannya, ikuti petunjuknya sampai selesai.</div><div style="text-align: justify;"><br />
</div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLxtzKovt378A5hSR4Lec0WImXru7hBbaJiM6Vo_tSloD27xGGDfOoW98geEEYTr05Y0B_QeVHOiepsiF7gieyvP-Bj1aBocXaKN5jBfNkXrXrNqGCMvG3xAx0eJ7b_HEDs8P18rJvroA/s1600/daftar+ke+youhosting.JPG" style="margin-left: auto; margin-right: auto;"><img border="0" height="350" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLxtzKovt378A5hSR4Lec0WImXru7hBbaJiM6Vo_tSloD27xGGDfOoW98geEEYTr05Y0B_QeVHOiepsiF7gieyvP-Bj1aBocXaKN5jBfNkXrXrNqGCMvG3xAx0eJ7b_HEDs8P18rJvroA/s400/daftar+ke+youhosting.JPG" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><i>Masukkan nama domain sebagai nama situs hosting gratismu</i></td></tr>
</tbody></table><div style="text-align: justify;"> </div><div style="text-align: justify;">3.<span class="Apple-tab-span" style="white-space: pre;"> </span>Setelah selesai pendaftaran, buka email yang kamu gunakan untuk mendaftar, disana seharusnya sudah ada email konfirmasi dari Youhosting, klik saja link konfirmasi untuk mengaktifkan Akun kamu.</div><div style="text-align: justify;">4.<span class="Apple-tab-span" style="white-space: pre;"> </span>Setelah Akun aktif, lalu Log In lah dengan Akun kamu tersebut.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Setelah Log In tugas kamu sekarang adalah melakukan setting dan pembuatan halaman utama situs penyedia hosting gratis punya kamu sendiri.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">1.<span class="Apple-tab-span" style="white-space: pre;"> </span>Install dulu halaman utama situsmu, yaitu dengan masuk ke menu Look and Feel – Install Main Website</div><div style="text-align: justify;"><br />
</div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://1.bp.blogspot.com/-01bLNHbwlT8/TiSs2OcHZGI/AAAAAAAACdE/xWmj6kjYRBE/s1600/install+main+website.JPG" style="margin-left: auto; margin-right: auto;"><img border="0" height="256" src="http://1.bp.blogspot.com/-01bLNHbwlT8/TiSs2OcHZGI/AAAAAAAACdE/xWmj6kjYRBE/s400/install+main+website.JPG" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><i>Buat halaman situsmu (main website)</i></td></tr>
</tbody></table><div style="text-align: center;"><br />
</div><div style="text-align: justify;">Atau jika tidak berhasil, buat saja situs utamanya dengan PHP lalu install/upload-lah melalui File Manager di Control Panel hostingmu. Bagi yang tidak menguasainya ada cara mudah, yaitu mendesain situs utamanya dengan Wordpress. Maksudnya yaitu kita buat situs utama penyedia hosting gratis punya kita tersebut dengan menginstall-nya dengan CMS wordpress (install melalui Control Panel hosting). </div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Caranya; </div><div style="text-align: justify;">Masih dari halaman setting atau pengaturan Youhosting, lalu kamu pilihlah menu Configuration, lalu pilih Master Domains, setelah itu akan tampil Domain utama situs kamu pada kolom sebelah kanan, selanjutnya klik saja pada pilihan Manage. (Lihat gambar dibawah ini sebagai panduan).</div><div style="text-align: justify;"><br />
</div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://2.bp.blogspot.com/-s9HGWaoGwEQ/TiSs-NLOP6I/AAAAAAAACdI/R1cC-9HsXD4/s1600/masuk+cpanel+main+website.JPG" style="margin-left: auto; margin-right: auto;"><img border="0" height="95" src="http://2.bp.blogspot.com/-s9HGWaoGwEQ/TiSs-NLOP6I/AAAAAAAACdI/R1cC-9HsXD4/s400/masuk+cpanel+main+website.JPG" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><i>Klik Manage untuk masuk ke cpanel hosting</i></td></tr>
</tbody></table><div style="text-align: justify;">Setelah itu nanti kamu akan menuju halaman Control Panel hosting.</div><div style="text-align: justify;">Kemudian, dari Cpanel hosting inilah kamu mulai buat situs/website utama untuk situs penyedia hosting gratis punya kamu. Agar proses pembuatannya cepat saya sarankan gunakan saja fasilitas AutoInstaller yang sudah disediakan, lalu nanti pilihlah Wordpress untuk platform situs kamu saat install nanti.</div><div style="text-align: justify;"><br />
</div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhi2yoEgh3H7SjClUJIKROqO3abg05lswsU3dIBH4eSGn4D78cq2VEoCNka3Qbj5H9wdF2yxL99gOm-uZnRkEHiEuil70W0sJyaZY4KzVsGNyPu3Gc-tAz1jenNoQdfTAjHenjUktqC5JM/s1600/auto+installer+pada+cpanel.JPG" style="margin-left: auto; margin-right: auto;"><img border="0" height="261" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhi2yoEgh3H7SjClUJIKROqO3abg05lswsU3dIBH4eSGn4D78cq2VEoCNka3Qbj5H9wdF2yxL99gOm-uZnRkEHiEuil70W0sJyaZY4KzVsGNyPu3Gc-tAz1jenNoQdfTAjHenjUktqC5JM/s400/auto+installer+pada+cpanel.JPG" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><i>Auto Installer pada Cpanel Hosting</i></td></tr>
</tbody></table><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Setelah proses install selesai, lalu coba buka alamat situsnya, apakah sudah jadi?</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Setelah situs utamanya jadi/berhasil dibuat lalu kembali lagi ke halaman pengaturan pada Youhosting untuk melanjutkan ke proses selanjutnya.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">2.<span class="Apple-tab-span" style="white-space: pre;"> </span>Selanjutnya yaitu membuat form untuk Pendaftaran calon User. </div><div style="text-align: justify;">Jadi bagi orang/user yang ingin membuat akun di situs hostingmu nanti mereka itu harus melakukan pendaftaran terlebih dahulu, untuk itu kita harus menyiapkan form pendaftarannya.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Caranya : </div><div style="text-align: justify;">Klik saja pada menu Look and Feel – Client Sign-Up Form, lalu pada halaman sebelah kanan pilihlah pertanyaan apa saja yang akan kamu tampilkan dalam Form pendaftaran hosting di situsmu.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;"><br />
</div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://4.bp.blogspot.com/-uJD9PiZ3HzA/TiSxm9yMecI/AAAAAAAACdc/OGpjIoa9Mho/s1600/setting+form+pendaftaran.JPG" style="margin-left: auto; margin-right: auto;"><img border="0" height="273" src="http://4.bp.blogspot.com/-uJD9PiZ3HzA/TiSxm9yMecI/AAAAAAAACdc/OGpjIoa9Mho/s400/setting+form+pendaftaran.JPG" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><i>Membuat form untuk pendaftaran user</i></td></tr>
</tbody></table><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">3.<span class="Apple-tab-span" style="white-space: pre;"> </span>Setelah merasa cukup, lalu Copy script yang diberikan, selanjutnya Paste-kan script tersebut pada template halaman situs utama yang akan kamu gunakan sebagai situs penyedia hosting. </div><div style="text-align: justify;"><br />
</div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-bottom: 0.5em; margin-left: auto; margin-right: auto; padding-bottom: 6px; padding-left: 6px; padding-right: 6px; padding-top: 6px; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwcdm2vEPo8rTivb9k580f0Zyf0CPrcgCgcJFIK2Vi49Y8ZUAmCQODGeczlroz8XaejhGzlUx6c01-or_1b5g8esAIGqlU9S3ThmppPKOp4UwpLrS981A8u4m55sZWCH2rmFt4XKw-3cY/s1600/membuat+posting+di+wordpress.JPG" style="margin-left: auto; margin-right: auto;"><img border="0" height="133" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwcdm2vEPo8rTivb9k580f0Zyf0CPrcgCgcJFIK2Vi49Y8ZUAmCQODGeczlroz8XaejhGzlUx6c01-or_1b5g8esAIGqlU9S3ThmppPKOp4UwpLrS981A8u4m55sZWCH2rmFt4XKw-3cY/s400/membuat+posting+di+wordpress.JPG" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="font-size: 13px; padding-top: 4px; text-align: center;"><i>Halaman posting Wordpress<br />
</i></td></tr>
</tbody></table><br />
<div style="text-align: justify;">(Seperti saya contohkan tadi, jika membuat situsnya menggunakan CMS Wordpress maka Paste saja pada bagian form seperti ketika membuat Posting, pastikan posisi posting pada pilihan HTML), tentunya sebelumnya kamu harus Log In dulu ke situs wordpress kamu <i>(biasanya log in melalui alamat http://alamatsituskamu.co.cc/wp-admin).</i></div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">4.<span class="Apple-tab-span" style="white-space: pre;"> </span>Sedangkan form Log In dan form “Reset Password” bisa kamu buat dengan cara Copy Script dari halaman pengaturan Client Sign Up Form diatas lalu Paste pada bagian Widget (Text) situs utama kamu (untuk yang menggunakan wordpress seperti contoh saya tadi).</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">5.<span class="Apple-tab-span" style="white-space: pre;"> </span>Setelah itu Save/Simpan, dan lalu lihat hasilnya.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Jika kamu mengikuti panduan saya ini dengan cermat saya yakin sampai langkah ke-2 poin ke-5 diatas maka berarti kamu sudah memiliki sebuah situs penyedia hosting gratis milik kamu sendiri (tentunya merupakan reseller hosting gratis dari Youhosting.Com).</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Selain pengaturan utama seperti diatas, kamu bisa juga mempercantik situs penyedia hosting gratismu dengan tampilan dan logo buatan kamu sendiri agar terkesan lebih professional dan tidak begitu terlihat layaknya reseller hosting gratisan. Saya contohkan, pada situs penyedia hosting gratis punya saya (http://freehostindo.co.cc) disana saya sudah rubah tampilan halaman Log In Control Panel dan halaman Log In webmail dengan tampilan dan logo buatan sendiri.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Jika kamu ingin merubah tampilan situsmu silahkan coba saja edit melalui menu Look and Feel – Logo Header Footer</div><div style="text-align: justify;"><br />
</div><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://2.bp.blogspot.com/-_EHCgjTwAlw/TiS0A6EF4EI/AAAAAAAACds/Eren1LgEKO0/s1600/custom+logo+youhosting.JPG" style="margin-left: auto; margin-right: auto;"><img border="0" height="253" src="http://2.bp.blogspot.com/-_EHCgjTwAlw/TiS0A6EF4EI/AAAAAAAACds/Eren1LgEKO0/s400/custom+logo+youhosting.JPG" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><i>Modifikasi tampilan situs dan logo</i></td></tr>
</tbody></table><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Demikian panduan dan setting utama yang kamu butuhkan untuk membuat sebuah situs penyedia hosting gratis dengan memanfaatkan layanan reseller hosting gratis dari Youhosting.com</div>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-86708752562533637122011-07-19T01:54:00.000-07:002011-07-19T12:34:33.842-07:00Membuat text berjalan<a name='more'></a>Apa itu marquee ? Marquee adalah suatu program HTML untuk membuat teks bisa bergerak atau berjalan. Program marquee ini banyak diminati dan dipakai oleh para blogger di dalam blognya karena sifat program ini yangdinamis serta menarik untuk di lihat disamping untuk menghemat tempatpada halaman blog.<br />
<br />
Marquee ini bisa di buat dengan menggunakan tag <marquee>...</marquee>.<br />
<br />
Atribut yang sering di gunakan adalah :<br />
<br />
BGCOLOR="warna" --> Untuk mengatur warna background (latar belakang) teks<br />
<br />
DIRECTION="left/right/up/down" --> Mengatur arah gerakan teks<br />
<br />
BEHAVIOR="scroll/slide/alternate" --> Untuk mengatur perilaku gerakan<br />
<br />
Scroll --> teks bergerak berputar<br />
<br />
Slide--> teks bergerak sekali lalu berhenti<br />
<br />
Alternate --> teks bergerak dari kiri kekanan lalu balik lagi ( bolak-balik bo)<br />
<br />
TITLE='pesan" --> Pesan akan muncul saat mouse berada di atas teks<br />
<br />
SCROLLMOUNT="angka" --> mengatur kecepatan gerakan dalam pixel, semakin besar angka semajin cepat gerakannya.<br />
<br />
SCROLLDELAY="angka" --> Untuk mengatur waktu tunda gerakan dalam mili detik<br />
<br />
LOOP="angka|-1|infinite" --> Mengatur jumlah loop<br />
<br />
WIDTH="lebar" --> Mengatur lebar blok teks dalam pixel atau persen<br />
<br />
Agar lebih jelas akan saya sertakan contohnya :<br />
<br />
Contoh marquee dari gerakan :<br />
<br />
<code><MARQUEE align="center" direction="right"<br />
height="200" scrollamount="2" width="30%"></code><br />
<br />
<code>marquee dari kanan ke kiri</code><br />
<br />
<code></MARQUEE></code><br />
<br />
hasilnya :<br />
<blockquote><code><marquee align="center" direction="right" height="200" scrollamount="2" width="30%"> <br />
<br />
<code>marquee dari kanan ke kiri</code> <br />
<br />
<code></code></marquee></code> </blockquote><br />
<blockquote>ganti kata "left" dengan keinginan anda yaitu bisa : left, up, down .</blockquote><br />
Contoh marquee dari perilaku gerakan :<br />
<br />
<code><MARQUEE align="center"<br />
direction="left" height="200" scrollamount="3"<br />
width="70%" behavior="alternate"></code><br />
<br />
marquee menurut perilaku<br />
<br />
<code></MARQUEE></code><br />
<br />
<blockquote><br />
<br />
<br />
<code><marquee align="center" behavior="alternate" direction="left" height="200" scrollamount="3" width="70%"> <br />
<br />
marquee menurut perilaku <br />
<br />
<code></code></marquee></code> </blockquote>Contoh marquee dengan variasi hurup dan warna latar belakang :<br />
<br />
<code><div align="left"><FONT FACE="georgia" <br />
color="White"><B><MARQUEE BGCOLOR="RED" width="70%" <br />
scrollamount="3" behavior="alternate"></code><br />
<br />
<code></MARQUEE></b></FONT></div></code><br />
<br />
hasilnya :<br />
<br />
<blockquote><code></code><br />
<div align="left"><code><span style="color: white; font-family: georgia;"><b><marquee behavior="alternate" bgcolor="RED" scrollamount="3" width="70%"><br />
<br />
<blockquote><br />
<code></code></blockquote></marquee></b></span></code></div></blockquote><br />
<br />
<br />
Ada variasi lain dari marquee ini, yakni ketika mouse sedang berada di <br />
area marquee teks akan berhenti dan ketika mouse di geser kembali <br />
ketempat lain maka teks akan bergerak kembali, ini hanya di tambahkan <br />
sedikit program pada kolom marquee.<br />
<br />
<br />
<br />
Contoh, silahkan arahkan mouse anda ke area marquee di bawah ini :<br />
<br />
<br />
<br />
<code><marquee onmouseover="this.stop()" onmouseout="this.start()" <br />
scrollamount="2" direction="up" width="50%" height="200" <br />
align="center"></code><br />
<br />
<br />
<br />
silahkan tunjuk ke sini<br />
<br />
<br />
<br />
<code></marquee></code><br />
<br />
<br />
<br />
<br />
<br />
hasilnya :<br />
<br />
<br />
<br />
<br />
<br />
<br />
<code><marquee align="center" direction="up" height="200" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2" width="50%"> <br />
<br />
silahkan tunjuk ke sini <br />
<br />
<code></code></marquee></code><br />
<br />
<br />
<br />
<br />
<br />
Contoh marquee yang di dalam nya terdapat link :<br />
<br />
<br />
<br />
<code><marquee onmouseover="this.stop()" onmouseout="this.start()" <br />
scrollamount="2" direction="up" width="100%" height="100" <br />
align="center"><br />
<br />
<br />
<br />
<br />
<a href="http://rubrik-elektronik.blogspot.com" target="new">Rubrik Elektronik</a><br/><br />
<br />
<br />
<br />
<br />
<a href="http://electronic-rubric.blogspot.com" target="new">Electronic Rubric </a><br/><br />
<br />
<br />
<br />
<br />
<br />
<a href="http://kolom-iklan.blogspot.com" target="new">Kolom iklan </a><br/><br />
<br />
<br />
<br />
<br />
<br />
</marquee></code><br />
<br />
<br />
<br />
<br />
<br />
<br />
hasilnya :<br />
<br />
<br />
<br />
<code><marquee align="center" direction="up" height="100" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2" width="100%"> <br />
<br />
<a href="http://rubrik-elektronik.blogspot.com/" target="new">Rubrik Elektronik</a><br />
<br />
<br />
<a href="http://electronic-rubric.blogspot.com/" target="new">Electronic Rubric </a><br />
<br />
<br />
<a href="http://kolom-iklan.blogspot.com/" target="new">Kolom iklan </a><br />
<br />
<br />
</marquee></code> <br />
<br />
Mungkin itu saja beberapa contoh yang bisa di berikan, silahkan anda <br />
otak-atik sendiri agar tercipta variasi-variasi dari marquee ini.<br />
<br />
<br />
<br />
Selamat ber eksperimenbelajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-39653929825525122022011-07-19T01:06:00.000-07:002011-07-19T12:35:51.467-07:00Membuat Link (2)<a name='more'></a>Untuk anda pengguna Blogger baru, ada perbedaan dalam membuat link, silahkan ikuti langkah berikut ini :<br />
<br />
<ol><li>Login di blogger dengan ID anda</li>
<li>Klik menu Layout</li>
<li>Klik Page Elements</li>
<span class="fullpost">
<li>Klik Add a Page Element</li>
<li>Klik ADD TO BLOG pada menu Link List</li>
<li>Tulis Judul link pada pada isian di sebelah form Title. Contoh dalam blog saya<br />
Adalah “ Link partner” atau silahkan terserah anda</li>
<li>Isi nomor link yang ingin anda tunjukan di blog anda pada form Number of Links to show in list, jika anda ingin membatasi jumlah link yang akan di tampilkan, jika anda tidak mau membatasi silahkan di <br />
kosongkan saja.</li>
<li>Pada form Sorting, silahkan anda pilih sort Alphabetically bila ingin link anda di urutkan berdasarkan huruf alphabet ( mulai dari A --> Z ), atau pilih sort revers Alphabetically apabila anda menginginkan Link yang anda buat di urutkan secara terbalik ( mulai dari Z --> A ). Bila anda tidak menginginkan keduanya, yakni Link yang tampil sesuai dengan yang anda buat, silahkan pilih Don’t Sort</li>
<li>Tulis alamat URL yang akan di Link pada form New Site URL. Contoh : http;//kolom-tutorial.blogspot.com</li>
<li>Tulis nama atau tulisan yang ingin muncul pada link yang anda buat pada form New site Name. contoh : Blog Tutorial.</li>
<li>Klik Add Link, jika link yang anda buat lebih dari satu. Silahkan isi semua form sesuai dengan langkah di atas.</li>
<li>Klik SAVE CHANGES bila sudah selesai</li>
<li>Bila anda ingin menempatkan Link yang anda buat tadi, silahkan arahkan mouse anda ke kotak link yang baru anda buat, lalu tekan mouse sambil di tahan pindahkan ke tempat yang anda inginkan ( di drag & drop ) .</li>
<li>Klik SAVE. Selesai</li>
</span></ol><b>Membuat link dari gambar atau image</b><br />
<br />
Apabila anda mempunyai sebuah gambar, dan gambar tersebut ingin di jadikan sebuah link. Maka caranya seperti di bawah ini :<br />
<br />
<ol><li>Upload gambar yang anda miliki ke hosting tempat menyimpan gambar, contoh <b>http://www.photobucket.com</b>. </li>
<li>Jika anda sudah mengupload gambar anda, maka gambar tersebut akan di beri alamat URL, copy alamat tersebut pada notepad. Sebagai contoh gambar chicklet blog tutorial di samping mempunyai alamat URL : <br />
<br />
<blockquote>http://i162.photobucket.com/albums/t253/rohman24/animasichicklet.gif</blockquote>Nah jika anda ingin membuat gambar tersebut menjadi sebuah link, maka kode yang di tulis adalah :<br />
<br />
<blockquote><code><a href="http://kolom-tutorial.blogspot.com"><img src="http://i162.photobucket.com</code><br />
<code>/albums/t253/rohman24/animasichicklet.gif"></a></code><br />
<br />
(kode dalam satu baris)</blockquote>jika ingin dalam window baru :<br />
<br />
<blockquote><code><a href="http://kolom-tutorial.blogspot.com" target="_blank"><img src="http://i162.photobucket.com</code><br />
<code>/albums/t253/rohman24/animasichicklet.gif"></a></code><br />
<br />
(kode dalam satu baris)</blockquote></li>
</ol><br />
<b>Link berjudul</b><br />
<br />
Mungkin anda bingung, ko judul bahasan topik ini judulnya Link berjudul ? Untuk memperjelas bahasan ini, silahkan anda kembali ke halaman atas blog ini lalu arahkan mouse anda ke tulisan Resep bisnis, coba diamkan sebentar pada link tersebut, maka tidak lama kemudian akan muncul tulisan <b>Mau belajar bikin website sendiri silahkan klik disini</b><br />
<br />
Nah sekarang mungkin anda sudah mengerti maksud saya, jadi dalam sebuah link ada kata-kata untuk menekankan ajakan anda kepada para pembaca untuk mengklik link tersebut. Untuk membuat judul link ini <br />
sangat mudah, yakni anda hanya harus menambahkan title=" ... " pada link yang anda buat. Contoh seperti yang saya berikan di atas :<br />
<br />
<br />
<blockquote><code><a href="http://www.resepbisnis.com/?id=rohman target="new" </code><br />
<code> title="mau belajar bikin website sendiri silahkan klik di sini">Resep</code><br />
<code> bisnis</a></code><br />
<code></code></blockquote><code> </code><br />
mudah bukan. Selamat mencoba.belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-15372124226683613512011-07-19T00:50:00.000-07:002011-07-19T12:36:30.655-07:00Membuat Link (1)<a name='more'></a>Dalam dunia blog, tentu anda tidak asing lagi dengan yang namanya link. Apabila anda seorang blogger (tukang ngeblog kata orang jakarta mah), tentu saja membuat link adalah sebuah keharusan. Berbeda dengan website pada umumnya, di jagat per blog-an ada yang namanya link exchange atau bertukar link dengan blog lain, jadi kalau anda tidak bisa membuat link, ini dapat berakibat anda akan di asingkan alias <br />
di cuekin oleh blogger lainnya karena di anggap pelit dalam memberikan link. <br />
Dalam topik membuat link ini, saya akan mengulasnya dalam beberapa sub bagian yakni :<br />
<br />
<br />
<b>Link pada posting-an</b><br />
Jika anda membuat sebuah artikel untuk di posting, trus di dalam nya ingin di buatkan sebuah link, <br />
misalkan artikel tersebut bercerita tentang bisnis yang anda ikuti pada sebuah website di internet, <br />
lalu anda ingin mengajak para pembaca artikel tersebut untuk mengunjungi website yang anda ceritakan. <br />
Misalkan dalam artikel tersebut ada kata –kata seperti <i>Jika anda tertarik silahkan anda <a href="http://www.blogger.com/goog_702927989" mce_href="http://www.resepbisnis.com/?id=rohman" rel="nofollow" target="_blank">klik disini</a></i><a href="http://smpn20sby.com/">, </a><br />
nah untuk membuat link dari kata-kata tersebut silahkan ikuti langkah-langkah berikut : <br />
<ol><li>Highlight kata-kata yang ingin di buat link, contoh di atas adalah <i>klik disini</i>.</li>
<li>Klik ikon yang bergambar seperti ini <img mce_src="http://i162.photobucket.com/albums/t253/rohman24/photo-posting_11.gif" src="http://i162.photobucket.com/albums/t253/rohman24/photo-posting_11.gif" /><br />
yang berada pada toolbar, maka setelah itu akan muncul tulisan <b>http://</b> pada window baru yang berbentuk seperti <br />
gambar di bawah ini :</li>
<img mce_src="http://amen24.googlepages.com/http-link.jpg" src="http://amen24.googlepages.com/http-link.jpg" title="window new link" />
<li>Isi kotak yang ada tulisan tersebut dengan alamat situs yang anda inginkan, misalkan : http://www.resepbisnis.com/?id=rohman</li>
<li>Klik OK. Selesai</li>
</ol><br />
<b>Link dengan window baru</b><br />
<br />
Mungkin anda punya pikiran, kalau anda membuat sebuah link trus pembaca mengkliknya, anda kwawatir kalau pengunjung blog kita akan meninggalkan blog kita. Untuk meminimalisir hal tersebut, bisa dilakukan dengan cara membuat window baru, jadi ketika pengunjung mengklik salah satu link yang kita buat, halaman blog kita tidak akan tertimpa dengan halaman baru tapi yang terjadi adalah halaman blog anda tetap ada dan halaman yang baru di klik akan muncul terpisah. Sebagai contoh, silahkan anda klik tulisan Resep Bisnis atau Obral plus pada banner header diatas. Ketika anda mengkliknya, akan tercipta window baru. Untuk membuat link <br />
seperti ini dapat di lakukan dengan cara :<br />
<ol><li>Apabila sudah melakukan cara membuat link seperti keterangan diatas, klik menu <br />
<img alt="Edit HTML tab" mce_src="http://i162.photobucket.com/albums/t253/rohman24/photo-posting_03.gif" src="http://i162.photobucket.com/albums/t253/rohman24/photo-posting_03.gif" /> yang ada pada toolbar.</li>
<li>Pada tulisan yang kita link tadi akan muncul kode seperti ini ( contoh tulisan <b>klik disini</b> di link ke http://www.resepbisnis.com/?id=rohman :<br />
<br />
<blockquote><code><a href="http://www.resepbisnis.com/?id=rohman">klik disini</a></code></blockquote><br />
maka disini anda harus menambahkan embel-embel kode <b>HTML target="new'</b> ataupun <b>target="_blank"</b> pada awal ataupun akhir kode tersebut . Contoh kode yang sudah di modifikasi adalah :<br />
<br />
<blockquote><code><a href="http://www.resepbisnis.com/?id=rohman" target="new">klik di sini</a></code></blockquote>atau :<br />
<br />
<blockquote><code><a href="http://www.resepbisnis.com/?id=rohman" target="new">klik di sini</a></code></blockquote>atau bisa juga seperti ini :<br />
<br />
<blockquote><code><a href="http://www.resepbisnis.com/?id=rohman" target="_blank">klik di sini</a></code></blockquote></li>
</ol><b>Buat Links di sidebar</b><br />
<br />
Bila anda berkeinginan membuat link kepada teman anda di sidebar, cara <br />
termudah adalah seperti ini : ( khusus untuk template klasik)<br />
<ol><li>Sign in di blogger dengan id anda</li>
<li>Klik menu TEMPLATE</li>
<li>Klik Edit HTML</li>
<li>Klik Edit</li>
<li>Klik Find (on this page)… --> untuk mempercepat pencarian</li>
<img alt="find" mce_src="http://amen24.googlepages.com/find.jpg" src="http://amen24.googlepages.com/find.jpg" />
<li>Tuliskan kata dimana anda ingin tempatkan, contoh di blog saya adalah Links para sahabat, klik Find</li>
<li>Tuliskan link yang anda inginkan, contoh jika anda ingin membuat link ke blog saya, maka kode yang di tulis adalah :</li>
</ol><blockquote><code><a href="http://kolom-tutorial.blogspot.com" target="_blank">Blog Tutorial</a></code></blockquote><ol><li>Klik Save Template Changes. Selesai</li>
</ol>Sedikit clue untuk anda. Jika anda sedang mengotak-atik kode Template sebaiknya sebelum di obrak-abrik, sebaiknya anda copy terlebih dahulu seluruh template ke dalam notepad, ini untuk jaga-jaga apabila anda <br />
melakukan kesalahan, anda bisa mengembalikan kesemula karena sudah mempunyai backup data template tersebut. Atau bisa juga sebelum anda klik <b>Save Template Changes</b> sebaiknya anda klik terlebih dahulu tombol <b>preview</b> untuk melihat perubahan yang anda lakukan, apabila sudah cocok dengan perubahan tersebut baru di <b>save Template Changes</b>.belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-23561904745965408772011-07-14T18:34:00.000-07:002011-07-19T12:36:45.401-07:00Memasang Tombol Facebook " Suka "<a name='more'></a>Fungsi dan kegunaan tombol ini adalah sebagai jembatan penghubung antara pengguna facebook dan halaman blog Anda, sehingga akan mudah bagi Anda berbagi konten dengan teman-teman di facebook. Semakin banyak blog Anda disukai oleh pengggemar facebook berarti semakin lebih dikenal pula blog Anda oleh pengguna facebook, dan otomatis akan sangat membantu untuk menaikan traffic dan page rank blog.<br />
Berikut contoh tampilan tombol facebook di blog:<br />
<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrWR7iwqBkmN14n0XAS3sPia8y9gmE-cWk2xpgjrNH27Q1Fp3OsRH-aVSZOv-m_9XHZ7Gwwv-yU-JzBc00W9PVtejjjfiPYBneaK-VGaucho_gCijXd18oYyUa0rYKctcG0fpNljGxmPU/s1600/2010-05-22_23-54.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrWR7iwqBkmN14n0XAS3sPia8y9gmE-cWk2xpgjrNH27Q1Fp3OsRH-aVSZOv-m_9XHZ7Gwwv-yU-JzBc00W9PVtejjjfiPYBneaK-VGaucho_gCijXd18oYyUa0rYKctcG0fpNljGxmPU/s320/2010-05-22_23-54.jpg" /></a><br />
<br />
<br />
<br />
Tertarik bagaimana cara pasangnya, yuk perhatikan kode dibawah ini :<br />
<br />
<br />
<div style="border: 1px solid rgb(255, 51, 51); height: 50px; margin: 10px 0pt 0pt; overflow: auto; padding: 8px; width: 550px;"><br />
<iframe allowTransparency='true'<br />
expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot;<br />
+ data:post.url + &quot;&amp;<span style="color: black;">layout=</span><b style="color: red;">standard</b>&amp;<span style="color: black;">show_faces=</span><b style="color: blue;">false</b>&amp;width=100&amp;<span style="color: black;">action=</span><b style="color: orange;">like</b>&amp;font=<b style="color: magenta;">arial</b>&amp;colorscheme=<b style="color: lime;">light</b>&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/></div><br />
<br />
Anda dapat mengatur atau mengganti teks yang berwarna dengan pilihan Anda<br />
<br />
<br />
<br />
<br />
<div style="color: black;"><span style="font-size: small;">layout=<b style="color: red;">standard</b> menjadi layout=<b style="color: red;">button_count</b><b style="color: red;"> </b>.</span></div><br />
<br />
<br />
<div style="color: black;"><span style="font-size: small;">show_faces=<b style="color: blue;">false</b> menjadi show_faces=<b style="color: blue;">true</b></span></div><div style="color: black;"><br />
<br />
</div><div color="black"><span style="font-size: small;">action=<b style="color: orange;">like</b> </span><span style="font-size: small;">menjadi</span><span style="font-size: small;"> action=<b><span style="color: orange;">recommend</span></b></span></div><div style="color: black;"><br />
<br />
</div><div style="color: black;"><span style="font-size: small;">font=<b style="color: magenta;">arial</b> </span><span style="font-size: small;">menjadi </span><span style="font-size: small;"> font=<b style="color: magenta;">lucida+grande</b> atau font=<b style="color: magenta;">segoe+ui</b> atau font=<b style="color: magenta;">tahoma</b> atau font=<b style="color: magenta;">trebuchet+ms</b> atau font=<b style="color: magenta;">verdana</b></span></div><div style="color: black;"><br />
<br />
</div><span style="color: black; font-size: small;">colorscheme=<b><span style="color: lime;">light</span></b> </span><span style="font-size: small;">menjadi</span><span style="color: black; font-size: small;"> colorscheme=<b><span style="color: lime;">dark</span></b> </span><br />
<br />
<br />
<br />
<span style="color: black; font-size: small;"><b>Cara pemasangannya :</b></span><br />
<br />
<br />
<br />
<span style="color: black; font-size: small;">1.<b>Login</b> ke Blogger ><b> Layout/Tata Letak</b> > <b>Edit HTML </b>> </span><span style="color: #3333ff;">Expand Widget Templates</span><br />
<br />
<span style="color: black; font-size: small;"><br />
<br />
</span><br />
<br />
<span style="color: black; font-size: small;">2.Copy kode diatas dan letakan tepat dibawah kode berikut</span><br />
<br />
<br />
<div style="border: 1px solid rgb(255, 51, 51); height: 50px; margin: 10px 0pt 0pt; overflow: auto; padding: 8px; width: 550px;"><b><div class='post-header-line-1'/></b></div><br />
<br />
atau kalau tidak ada menemukan kode diatas bisa juga diletakan sebelum kode berikut<span style="color: black; font-size: small;"> </span><br />
<br />
<br />
<div style="border: 1px solid rgb(255, 51, 51); height: 50px; margin: 10px 0pt 0pt; overflow: auto; padding: 8px; width: 550px;"><br />
<br />
<b><data:post.body/></b></div><br />
<br />
<br />
<br />
Untuk memudahkan menemukan kode html yang berada diblog Anda, silahkan<br />
tekan tombol CTRL+F dan copy kode yang ingin dicari kemudian paste-kan<br />
didalam kotak pencarian. Saya yakin Anda pasti bisa.<br />
<br />
Demikian sedikit banyak pengetahuan yang saya bagikan tentang bagaimana <b>Memasang Tombol Facebook "suka" di Blog</b>, semoga postingan ini ada manfaatnya , salam...<br />
<br />
<br />
<div style="background-color: transparent; border: medium none; color: black; overflow: hidden; text-align: left; text-decoration: none;"><br />
<br />
</div>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-28254319420032110852011-07-14T17:42:00.000-07:002011-07-21T00:57:35.158-07:00Membuat Menu DTree<div mce_style="text-align: justify;" style="text-align: justify;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg56r7S9QDOzjAqmRUORbuMQxUkPPa8XEfL_eU1fcRrUm35agvxuclpIimW1Ak34NPFmiIByYvIaEpJmDh6DZZu-5vgj7QauAmVjQIXDWK0Swdumxkc_GeyQ0gxLQ6gDI7JV2N8GbeLBP8/s200/dtree_menu_t4belajarblogger.JPG" imageanchor="1" mce_href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg56r7S9QDOzjAqmRUORbuMQxUkPPa8XEfL_eU1fcRrUm35agvxuclpIimW1Ak34NPFmiIByYvIaEpJmDh6DZZu-5vgj7QauAmVjQIXDWK0Swdumxkc_GeyQ0gxLQ6gDI7JV2N8GbeLBP8/s200/dtree_menu_t4belajarblogger.JPG" mce_style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" mce_src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg56r7S9QDOzjAqmRUORbuMQxUkPPa8XEfL_eU1fcRrUm35agvxuclpIimW1Ak34NPFmiIByYvIaEpJmDh6DZZu-5vgj7QauAmVjQIXDWK0Swdumxkc_GeyQ0gxLQ6gDI7JV2N8GbeLBP8/s200/dtree_menu_t4belajarblogger.JPG" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg56r7S9QDOzjAqmRUORbuMQxUkPPa8XEfL_eU1fcRrUm35agvxuclpIimW1Ak34NPFmiIByYvIaEpJmDh6DZZu-5vgj7QauAmVjQIXDWK0Swdumxkc_GeyQ0gxLQ6gDI7JV2N8GbeLBP8/s200/dtree_menu_t4belajarblogger.JPG" /></a><br />
<a name='more'></a><br />
<b>Menu dTree</b> adalah menu yang memiliki tampilan sangat mirip dengan tampilan menu windows explorer (lihat gambar disamping), sehingga pengunjung dapat tertarik dan lebih mudah mencari artikel karena penggunaan menu ini di jumpai di komputer masing-masing (bagi pengguna windows).<br />
<br />
<br />
Langsung saja, bagaimana <b>cara membuat menu dTree di </b><b><a href="http://www.blogger.com/post-edit.g?blogID=2991581112131400583&postID=2825431942003211085&from=pencil" mce_href="http://blogger.anekanews.com/" title="blogspot"><b>blogspot</b></a></b>? Silahkan anda ikuti langkah-langkahnya berikut ini. </div><br />
<div mce_style="text-align: justify;" style="text-align: justify;"><span mce_="" style="font-size: large;"><b>1.</b></span> Masuk pada halaman <b>EDIT HTML</b>, kemudian letakkan kode berikut di atas kode <b></head></b></div><div style="color: blue; text-align: left;"><blockquote><a href="http://www.blogger.com/goog_49479267"><link href="StyleSheet" href="http://sites.google.com/site/t4belajar</a><a href="http://www.blogger.com/goog_49479267" mce_href="http://blogger.anekanews.com/" title="blogger"><b>blogger</b></a><a href="http://www.blogger.com/goog_49479267">/js_t4belajar</a><a href="http://www.blogger.com/goog_49479267" mce_href="http://blogger.anekanews.com/" title="blogger"><b>blogger</b></a><a href="http://www.blogger.com/goog_49479267">/dtree.css" type="text/css" /><script type="text/javascript"src="http://sites.google.com/site/t4belajar</a><a href="http://www.blogger.com/goog_49479267" mce_href="http://blogger.anekanews.com/" title="blogger"><b>blogger</b></a><a href="http://www.blogger.com/goog_49479267">/js_t4belajar</a><a href="http://www.blogger.com/goog_49479267" mce_href="http://blogger.anekanews.com/" title="blogger"><b>blogger</b></a>/createdtree.js"></script></blockquote></div>Kemudian klik <b>SAVE TEMPLATE</b>.<br />
<br />
<br />
<div mce_style="text-align: justify;" style="text-align: justify;"><span mce_="" style="font-size: large;"><b>2.</b></span> Masuk pada <b>RANCANGAN</b> kemudian <b>ELEMEN LAMAN</b> setelah itu klik <b>TAMBAH GADGET</b>, pilihlah <b>GADGET HTML</b>. Setelah itu, pastekan kode berikut ini:</div><div style="text-align: left;"><blockquote><div class="dtree"><br />
<p><a href="javascript: d.openAll();">Buka Semua</a> | <a href="javascript: d.closeAll();">Tutup Semua</a></p><br />
<br />
<script type="text/javascript"><br />
<br />
<!--<br />
<br />
d = new dTree('d');<br />
<br />
d.add(0,-1,'<span style="color: blue;">Belajar Elektronika</span>');<br />
<br />
d.add(1,0,'<span style="color: blue;">Dasar Dasar Listrik</span>','#.html');<br />
<br />
d.add(2,1,'<span style="color: blue;">Teori Atom</span>',' #.html');<br />
<br />
d.add(3,2,'<span style="color: blue;">Teori Atom</span>',<b mce_style="color: red;" style="color: red;">'http://widodo-elektronika.blogspot.com/2011/07/teori-atom.html')</b>;<br />
<br />
d.add(4,2,'<span style="color: blue;">Penghantar Listrik</span>',<b mce_style="color: red;" style="color: red;">'http://widodo-elektronika.blogspot.com/2011/07/penghatar-listrik.html')</b>;<br />
<br />
d.add(5,2,'<span style="color: blue;">Arus Listrik & Satuannya</span>',<b mce_style="color: red;" style="color: red;">'http://widodo-elektronika.blogspot.com/2011/07/arus-listrik-dan-satuannya.html')</b>;<br />
<br />
d.add(6,2,'<span style="color: blue;">Tegangan Listrik & Satuannya</span>',<b mce_style="color: red;" style="color: red;">'http://widodo-elektronika.blogspot.com/2011/07/tegangan-listrik-dan-satuannya.html')</b>;<br />
<br />
d.add(7,2,'<span style="color: blue;">Hambatan Listrik & Satuannya</span>','<span style="color: red;">http://widodo-elektronika.blogspot.com/2011/07/hambatan-listrik-dan-satuannya.html</span>');<br />
<br />
d.add(8,2,'<span style="color: blue;">Hukum OHM</span>','<span style="color: red;">http://widodo-elektronika.blogspot.com/2011/07/hambatan-listrik-dan-satuannya_08.html</span>');<br />
<br />
d.add(9,0,'<span style="color: blue;">Komponen Elektronika</span>',' #.html');<br />
<br />
d.add(10,9,'<span style="color: blue;">Resistor</span>',' #.html');<br />
<br />
d.add(11,10,'<span style="color: blue;">Resistor Tetap</span>','<span style="color: red;">http://widodo-elektronika.blogspot.com/2011/07/jenis-resistor-tetap.html</span>');<br />
<br />
d.add(12,10,'<span style="color: blue;">Resistor Berubah Manual</span>','<span style="color: red;">http://widodo-elektronika.blogspot.com/2011/07/12-resistor-tidak-tetap-variable.html</span>');<br />
<br />
d.add(13,10,'<span style="color: blue;">Resistor Berubah Otomatis</span>','<span style="color: red;">http://widodo-elektronika.blogspot.com/2011/07/13-resistor-berubah-otomatis-ntc-dan.html</span>'); </blockquote><blockquote>d.add(14,9,'<span style="color: blue;">Kapasitor</span>',' #.html');<br />
<br />
d.add(15,14,'<span style="color: blue;">Pengertian & Macam Kapasitor</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-pasif/kapasitor/teori-dasar-kapasitor</span>');<br />
<br />
d.add(16,14,'<span style="color: blue;">Jenis Kapasitor</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-pasif/kapasitor/membaca-nilai-resistor</span>');<br />
<br />
d.add(18,9,'<span style="color: blue;">Dioda</span>',' #.html');<br />
<br />
d.add(19,18,'<span style="color: blue;">Pengertian Dioda</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/diode</span>');<br />
<br />
d.add(20,18,'<span style="color: blue;">Dioda Penyearah</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/diode/diode-penyearah</span>');<br />
<br />
d.add(21,18,'<span style="color: blue;">Dioda Zener</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/diode/diode-zener</span>');<br />
<br />
d.add(22,18,'<span style="color: blue;">LED</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/diode/led</span>');<br />
<br />
d.add(23,18,'<span style="color: blue;">Dioda Foto</span> ','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/diode/diode-foto</span>');<br />
<br />
d.add(24,18,'<span style="color: blue;">SCR</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/diode/scr</span>');<br />
<br />
d.add(25,18,'<span style="color: blue;">DIAC</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/diode/diac</span>');<br />
<br />
d.add(26,18,'<span style="color: blue;">TRIAC</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/diode/triac</span>');<br />
<br />
d.add(27,18,'<span style="color: blue;">VARACTOR</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/diode/dioda-varaktor</span>');<br />
<br />
d.add(28,18,'<span style="color: blue;">Diode Laser</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/diode/dioda-laser</span>');<br />
<br />
d.add(29,9,'<span style="color: blue;">Transisor</span>',' #.html');<br />
<br />
d.add(30,29,'<span style="color: blue;">Transistor</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/transistor</span>');<br />
<br />
d.add(31,29,'<span style="color: blue;">MOSFET</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/transistor/mosfet</span>');<br />
<br />
d.add(32,29,'<span style="color: blue;">FET</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/transistor/fet</span>');<br />
<br />
d.add(33,29,'<span style="color: blue;">IGBT</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/transistor/igbt</span>');<br />
<br />
d.add(34,29,'<span style="color: blue;">Darlington</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-aktif/transistor/darlington</span>');<br />
<br />
<br />
d.add(35,9,'<span style="color: blue;">Kumparan</span>','#.html');<br />
<br />
d.add(36,35,'<span style="color: blue;">Transformator</span>','<span style="color: red;">http://widodo-elektronika.blogspot.com/2011/07/13-resistor-berubah-otomatis-ntc-dan.html</span>');<br />
<br />
d.add(37,35,'<span style="color: blue;">Loudspeaker</span>','<span style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-pasif/kumparan/loudspeaker</span>');<br />
<br />
d.add(38,35,'<span style="color: blue;">Mikrofon</span>','<b mce_style="color: red;" style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-pasif/kumparan/mikrofon')</b>;<br />
<br />
d.add(39,35,'<span style="color: blue;">Induktor</span>','<b mce_style="color: red;" style="color: red;">http://www.smpn20sby.com/index.php/komponen-elektronika/komponen-pasif/kumparan/transformator')</b>;<br />
<br />
d.add(125,0,'<blink>Mau Bikin Menu Begini?</blink>',<b mce_style="color: red;" style="color: red;">'http://widodo-miniblog.blogspot.com/2011/07/membuat-menu-dtree.html')</b>;<br />
<br />
document.write(d);<br />
<br />
//--><br />
<br />
</script><br />
<br />
</div></blockquote><br />
<blockquote>Jika sudah, save kemudian lihat hasilnya. Jika anda belum mengeditnya, tampilannya akan sama persis dengan milik saya. Silahkan sobat mengganti link saya kemudian ganti kata-katanya. Yang <b mce_style="color: blue;" style="color: blue;">berwarna biru</b> ada kata-kata yang saya maksud, sementara yang <b mce_style="color: red;" style="color: red;">berwarna merah</b> adalah link menunya, silahkan ganti sesuai keinginan. Ingin menambahkan menu (folder) baru? Insya Allah akan saya posting, soalnya agak panjang penjelasannya. Jika mengalami masalah, Anda dapat berkomentar...<br />
<br />
Demikianlah <a href="http://www.blogger.com/goog_49479272" mce_href="http://soe86.blogspot.com/2010/11/cara-membuat-menu-dtree-blogspot.html"><b>cara membuat menu dTree di </b></a><b><a href="http://www.blogger.com/post-edit.g?blogID=2991581112131400583&postID=2825431942003211085&from=pencil" mce_href="http://blogger.anekanews.com/" title="blogspot"><b>blogspot</b></a></b> ini, bila ingin tahu demo clik <a href="http://widodotik.blogspot.com/">disini</a> mohon maaf atas segala kekurangan,<br />
semoga bermanfaat :)</blockquote></div>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-23677710948849007862011-07-14T10:54:00.000-07:002011-07-19T19:14:18.541-07:00Membuat Menu Dropdown<div class="post-body entry-content"><br />
<a name='more'></a>Dalam konsep blog, setiap posting kita akan terarsip otomatis secara rapi setiap bulan. Setiap memasuki bulan baru, seperti Januari, maka arsip bulan Desember akan tampil di sidebar. Masalahnya, kalau kita sudah ngeblog setahun, maka arsip dari Januari sampai Desember akan<br />
berjejer di sidebar kita. Bagaimana kalau dua dan tiga tahun lagi?Login ke blogger.com dg id Anda <span class="fullpost"><br />
Langkah praktis mengatasi hal ini adalah dengan membuat pull-down menu seperti di bawah ini:<br />
<br />
<select name="archivemenu" onchange="document.location.href=this.options[this.selectedIndex].value;"> <option selected="selected">- Archives -</option> <option>January 2007</option><option>February 2007</option><option>Mart 2007</option><option>April 2007</option> </select><br />
<br />
Jadi, berapa bulan/tahun kita blogging di blogger/blogspot, menu bulan-bulan tsb tidak akan memenuhi dan berjejer panjang di sidebar kita. Yg tampak hanya nama "Archives", baru setelah di klik, akan muncul nama bulan arsip-arsip kita.<br />
<br />
Untuk membuat arsip pulldown ini ada dua yakni untuk blogger dengan template klasik, dan template baru. Untuk template klasik langkahnya yaitu :<br />
</span><br />
<ol><li><span class="fullpost">Klik Template</span></li>
<span class="fullpost">
<li>Di bagian sidebar blog Anda bagian archives, ada kode html sbb:</li>
<code> </code><pre mce_="" style="font-family: Courier New; font-size: 7pt; line-height: 15.2pt; margin: 0in 0in 0.0001pt; text-align: left;"><span lang="EN" mce_="" style="color: #333333; font-size: 100%;"></span></pre><blockquote style="color: #ff6666;"><pre mce_="" style="font-family: Courier New; line-height: 15.2pt; margin: 0in 0in 0.0001pt; text-align: left;"><span lang="EN" mce_="" style="color: #333333; font-size: small;">&<BloggerArchives>
<a href="<$BlogArchiveURL$"$gt;'><$BlogArchiveName$></a>
</BloggerArchives></span></pre><span style="font-size: 100%;"> </span>
<li><span style="font-size: 100%;"> </span></li>
</blockquote><li><span style="font-size: 100%;"></span>Nah, ganti kode di atas dg kode html di bawah ini: </li>
<code></code><pre mce_="" style="font-family: Courier New; font-size: 7pt; line-height: 15.2pt; margin: 0in 0in 0.0001pt; text-align: left;"><span lang="EN" mce_="" style="color: #333333;"></span></pre><blockquote><pre mce_="" style="font-family: Courier New; line-height: 15.2pt; margin: 0in 0in 0.0001pt; text-align: left;"><span lang="EN" mce_="" style="color: #333333; font-size: small;"><select name="archivemenu"
onchange="document.location.href=this.options[this.selectedIndex].value;">
<option selected>- Archives -</option>
<BloggerArchives>
<option value="<$BlogArchiveURL$>"><$BlogArchiveName$></option>
</BloggerArchives>
</select></span></pre>
<li> </li>
</blockquote><li>Apabila selesai, klik SAVE CHANGES. Bila sudah DONE, klik REPUBLISH.</li>
<li> Selesai.</li>
</span></ol><span class="fullpost"><br />
Untuk anda yang memakai template baru, langkahnya lebih mudah yaitu :<br />
<br />
</span><br />
<ol><li><span class="fullpost">login dulu, tentunya dengan id anda</span></li>
<span class="fullpost">
<li> klik LAYOUT</li>
<li>Klik PAGE ELEMENTS, cari element (kotak) yang bertuliskan Blog Archive</li>
<li>Klik Edit pada kotak Blog Archive tadi</li>
<li>Di samping tulisan Style ada beberapa radio button, pilih radio<br />
button yang bertuliskan Dropdown Menu dengan cara memberi tanda tik/cek </li>
<li>Klik Save Changes </li>
<li>Selesai</li>
</span></ol><span class="fullpost">Nah keterangan di atas tadi merupakan langkah-langkah untuk membuat menu Dropdown untuk Arsip, Sekarang bagai mana caranya membuat menu dropdown yang di dalam nya ada linknya, saya ambil contoh untuk menu Dropdown milik saya pribadi yang berada di sebelah kanan atas yang berisi tulisan “ blog tutorial “. Untuk membuatnya silahkan anda copy kode HTML di bawah :<br />
<br />
<br />
<code></code><blockquote><span xmlns="http://www.w3.org/1999/xhtml"><form><select name="menu"</span><br />
<span xmlns="http://www.w3.org/1999/xhtml">onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1</span><br />
<span xmlns="http://www.w3.org/1999/xhtml">name=menu><option value=0 selected><span mce_="" style="color: blue;">tulisan disini yang akan muncul duluan</span></OPTION><code><option value="<span mce_="" style="color: blue;">isi dengan addres yang ingin di tuju</span>"><span mce_="" style="color: blue;">tulisan di sini yang akan muncul</span></option><br />
</select></form></code></span><br />
<span xmlns="http://www.w3.org/1999/xhtml"><br />
</span><br />
<span xmlns="http://www.w3.org/1999/xhtml"><br />
</span></blockquote><span xmlns="http://www.w3.org/1999/xhtml">Sebagai contoh untuk menu Dropdown milik saya :<br />
<br />
</span></span><br />
<blockquote><span class="fullpost"><span xmlns="http://www.w3.org/1999/xhtml"><code></code></span></span><br />
<br />
<br />
<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1<br />
name=menu><br />
<option>- Blog Tutorial -</option><br />
<option value="http://widodo-miniblog.blogspot.com/2011/07/membuat-blog-di-blogspot.html">Membuat Blog</option><br />
<option value="http://widodo-miniblog.blogspot.com/2011/07/cara-seting-di-blogger.html">setting Blog</option><br />
<option value="http://widodo-miniblog.blogspot.com/2011/07/cara-menggati-template.html">Memilih Template</option><br />
<option value="http://widodo-miniblog.blogspot.com/2011/07/buat-costum-domain.html">Buat Costum Domain</option><br />
<option value="http://widodo-miniblog.blogspot.com/2011/07/cara-mengisiposting-artikel.html">Posting Artikel</option><br />
<option value="http://kolom-tutorial.blogspot.com/2007/04/membuat-text-area.html">Text area</option><br />
<option value="http://widodo-miniblog.blogspot.com/2011/07/membuat-text-area.html">Membuat Teks Area</option><br />
</select></form></blockquote><span class="fullpost"><span xmlns="http://www.w3.org/1999/xhtml"> </span></span><br />
<span class="fullpost"><span xmlns="http://www.w3.org/1999/xhtml"> Hasilnya akan seperti ini :</span></span><span class="fullpost"> </span><br />
<br />
<blockquote><form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')" size="1<br"> <option>- Blog Tutorial -</option><option value="http://widodo-miniblog.blogspot.com/2011/07/membuat-blog-di-blogspot.html">Membuat Blog</option><option value="http://widodo-miniblog.blogspot.com/2011/07/cara-seting-di-blogger.html">setting Blog</option><option value="http://widodo-miniblog.blogspot.com/2011/07/cara-menggati-template.html">Memilih Template</option><option value="http://widodo-miniblog.blogspot.com/2011/07/buat-costum-domain.html">Buat Costum Domain</option><option value="http://widodo-miniblog.blogspot.com/2011/07/cara-mengisiposting-artikel.html">Posting Artikel</option><option value="http://kolom-tutorial.blogspot.com/2007/04/membuat-text-area.html">Text area</option><option value="http://widodo-miniblog.blogspot.com/2011/07/membuat-text-area.html">Membuat Teks Area</option></select></form><span class="fullpost"></span></blockquote> Mudah bukan? Selamat mencoba !<span class="fullpost"><br />
</span></div>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-9213554621212114652011-07-14T10:40:00.000-07:002011-07-19T12:37:51.215-07:00Kumpulan Widget<div style="text-align: justify;"><br />
<a name='more'></a>WEB WIDGET merupakan sekumpulan kode yang disediakan 3rd party, dan dapat diintegrasikan (copy paste) ke dalam website Anda tanpa memerlukan kompilasi tambahan dan prosedur yang rumit. Ya, hanya dengan copy dan paste! </div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Beberapa istilah lain yang juga umum dipergunakan untuk menyebut web widget adalah badge, module, snippet, plugin, dan lain sebagainya. Umumnya web widget menggunakan DHTML, JavaScript, atau Flash. Fitur yang disediakan sangat beragam, dari hit counter sederhana sampai game yang cukup rumit, dapat ditampilkan dengan web widget.</div><br />
<div style="text-align: justify;"></div><div style="text-align: justify;"></div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Penggunaan web widget telah dimulai sejak dimulainya era Word Wide Web, walaupun pada awalnya hanya digunakan untuk hit counter dan banner iklan, tetapi web widget terus berkembang dengan pesat dan menawarkan berbagai widget yang menarik.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Umumnya, web widget saat ini digunakan oleh blogger, pengguna web social network (seperti Facebook, Friendster, dan seterusnya), juga oleh pemilik website pribadi.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Baiklah, kini saatnya kita mencoba beberapa web widget yang dapat membuat website Anda menjadi lebih menarik, tanpa Anda harus menguasai bahasa pemrograman yang rumit!</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">Twitter</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Twitter merupakan sebuah service yang memungkinkan Anda untuk menulis pesan pada website twitter.com, Anda dapat menuliskannya melalui website twitter.com, SMS, instant messaging, atau aplikasi 3rd party yang khusus dibuat untuk mengelola pesan twitter.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Untuk apa pesan yang ditulis pada twitter? Seperti slogan twitter yang berbunyi “What are you doing?”, pesan-pesan pada twitter ditujukan pada rekan, keluarga, dan segenap koneksi Anda yang ingin mengetahui apa yang sedang Anda kerjakan, dan Anda memberitahukan mereka melalui twitter.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Pesan-pesan yang Anda tulis pada twitter, dapat Anda tampilkan ulang pada website Anda dengan menggunakan script atau web widget yang tersedia.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Untuk keperluan ini, mula-mula Anda harus melakukan registrasi pada website twitter.com, dan memilih sebuah nama atau screen name yang unik. Setelah sukses melakukan registrasi, Anda dapat mencoba menuliskan beberapa pesan yang akan terlihat tampil pada website twitter.com.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Sekarang, bagaimana caranya menghubungkan twitter dengan website Anda? Tersedia berbagai cara, salah satunya melalui website http://www.bloggerbuster.com/2008/04/add-customized-twitter-widget-to-your.html, di mana Anda dapat menampilkan twitter pada website/<a href="http://nafasku.com/category/internet/blog" title="blog"><span style="color: #2255aa;">blog</span></a> Anda dengan widget yang disediakan, komplit dengan icon yang menarik.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Setelah melewati tahap ini, pengunjung website Anda dapat membaca pesan-pesan twitter yang tertulis pada website Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Pastinya Anda tidak puas sampai di sini, selanjutnya Anda pasti akan berpikir bagaimana untuk mengupdate pesan pada twitter dengan mudah.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Melalui website http://twitter.com/devices, Anda dapat mendaftarkan nomor handphone atau account Instant Messenger (yang didukung oleh twitter.com adalah melalui GTalk, LiveJournal, dan Jabber) yang memungkinkan Anda melakukan update pesan twitter melalui SMS atau instant messaging yang didukung.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Untuk meng-update twitter melalui aplikasi desktop 3rd party, Anda dapat menggunakan berbagai software seperti pwytter (http://www.pwytter.com), twitterlicious (http://www.ejecutive. co.uk/projects/twitterlicious), dan masih banyak lagi.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"></div></blockquote><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">Alexa</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Alexa.com merupakan website yang menawarkan fitur untuk menampilkan peringkat/ranking website Anda, website dengan rank 1 berarti website yang memiliki ranking paling tinggi di dunia menurut versi alexa.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Anda dapat menggunakan web widget yang disediakan oleh alexa, dengan mengunjungi situs http://www.alexa.com/site/devcorner, halaman ini menampilkan fitur-fitur untuk developer, salah satunya adalah fitur widgets. Pilih bagian widgets dan Anda akan diberikan tiga pilihan widget, yaitu Traffic Graph, Site Stats Button, dan Traffic Rank Button.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Jika Anda memilih Site Stats Button atau Traffic Rank Button, Anda hanya perlu memasukkan alamat website, maka secara otomatis alexa akan menghasilkan kode program yang dapatlangsung di-copy paste ke dalam website Anda. Hasilnya adalah informasi peringkat website Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Pilihan Traffic Graph akan menampilkan statistik website dalam bentuk grafik, Anda perlu menginput alamat website, range (berkisar dari 7 hari sampai dengan maksimum), dan type (tersedia pilihan Reach, Rank, atau Page Views). Untuk Traffic Graph ini, statistik website baru akan tampil jika website Anda masuk ke dalam peringkat top 100.000.</div></blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">Poll dan Survai</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Poll merupakan sebuah pertanyaan singkat beserta pilihan jawaban untuk mengetahui opini umum, hasilnya dapat diketahui secara langsung. Sedangkan, survai lebih bertujuan untuk mengum pulkan data yang akan dianalisis lebih lanjut, dan bisa jadi memerlukan data seperti informasi responden, dan seren-tetan pertanyaan yang berkaitan dengan topik yang dibahas.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Baik poll maupun survai merupakan salah satu bentuk interaksi terhadap pengunjung website, tersedia web widget yang mengizinkan Anda menciptakan dan menampilkan sebuah poll/survai.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Salah satu penyedianya adalah website http://polldaddy.com. Untuk keperluan ini, Anda harus mendaftarkan diri terlebih dahulu pada website tersebut, lalu dengan beberapa langkah mudah, Anda dapat membuat poll atau survai, menciptakan pertanyaan beserta pilihan jawaban yang tersedia, dan seterusnya.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Berikutnya Anda akan mendapatkan kode program yang dapat di-copy paste langsung ke dalam website Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"></div></blockquote><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">Flickr</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Bagi Anda yang menyukai fotografi, tentunya sudah tidak asing lagi dengan website flickr.com, sebuah komunitas online yang terkenal dengan penyimpanan dan sharing file foto, dan juga file berbentuk video.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Bagi Anda yang ingin menampilkan foto atau video yang berasal dari flickr pada website, maka Anda dapat memanfaatkan fitur web widget yang telah disediakan flickr. Satu-satunya syarat adalah Anda harus memiliki account flickr atau account Yahoo!. Untuk mendapatkan kode widget, mula-mula arahkan browser pada alamat http://flickr.com/badge.gne, Anda akan diminta untuk memasukkan account Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Langkah berikutnya, Anda diminta untuk memilih antara HTML badge atau Flash badge (flickr menggunakan istilah badge), selanjutnya Anda diminta memilih konten gambar/video yang ingin ditampilkan.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Konten gambar/video tidak selalu berasal dari koleksi Anda, tetapi dapat juga berasal dari konten yang di-upload orang lain untuk konsumsi publik, bahkan Anda dapat menentukan tag tertentu untuk menyaring topik konten yang ditayangkan dalam widget.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Selanjutnya, Anda akan diminta menentukan kustomisasi warna background, link, dan text, lalu selesailah sudah pengaturan widget, selanjutnya akan tampil preview konten yang telah Anda tentukan beserta sederet kode yang siap diintegrasikan (copy paste) ke dalam website Anda!</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"><a href="http://nafasku.com/category/internet/google" title="Google"><span style="color: #2255aa;"></span></a></div></blockquote><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"><a href="http://nafasku.com/category/internet/google" title="Google"><span style="color: #2255aa;">Google</span></a> AdSense</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Google AdSense merupakan web widget popular untuk pelayanan iklan, dan dapat menghasilkan revenue bagi website Anda. AdSense menggunakan kode JavaScript yang harus Anda sisipkan pada website Anda, setelah Anda melakukan registrasi yang telah disetujui oleh Google. Keberadaan Google AdSense sering mengundang sebagian orang yang hanya ingin mengejar keuntungan semata, dan menimbulkan berbagai praktek untuk memanipulasi hasilnya.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Bagi Anda yang memang memiliki website berkualitas, tentunya tidak perlu menggunakan cara-cara yang tidak benar, sudah pasti Google AdSense akan lebih mungkin menghasilkan keuntungan bagi website dengan konten yang menarik pengunjung.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Untuk memulai Google AdSense, Anda dapat mendaftarkan website Anda pada alamat http://www.google.com/adsense dan melakukan registrasi. Google akan melakukan verifikasi dan mungkin Anda tidak akan langsung mendapatkan approval dariGoogle, tunggu hingga Anda mendapatkan instruksi lebih lanjut dan script untuk ditambahkan pada website Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"></div></blockquote><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">FeedBurner</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">FeedBurner merupakan penyedia manajemen web feed, yang digunakan agar pengunjung website Anda dapat mengikuti perkembangan konten melalui program Feed Reader, tanpa harus mengunjungi website untuk melihat perubahan terbaru. Untuk memasang fitur ini, kunjungi terlebih dahulu website http://www.feedburner.com, dan isikan URL website Anda, selanjutnya Anda akan diberikan pilihan untuk menggunakan Atom ataukah RSS. Ikuti terus instruksi yang meminta Anda memasukkan alamat feed, username, dan password (jika Anda belum login), FeedBurner akan menyediakan tombol Activate Feed untuk mengaktifkan alamat feed Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Langkah selanjutnya adalah memasang web widget pada website Anda agar pengunjung dapat melakukan subscribe feed, caranya adalah kembali pada halaman dashboard Anda pada feedburner.com, pilih button Publicize, klik pada link friendly graphic yang akan mengarahkan Anda pada halaman Chicklet</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Chooser. Di sini Anda dapat menentukan icon, dan mendapatkan kode program yang dapat di-copy paste ke dalam website Anda, atau melakukan import widget tersebut jika Anda memiliki blog pada blogger.com.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"></div></blockquote><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">MyBlogLog</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">MyBlogLog (http://www.mybloglog.com) menawarkan web widget yang menampilkan blogger lain yang mengunjungi website Anda, dalam jaringan MyBlogLog. Untuk menggunakan MyBlogLog, mula-mula Anda harus melakukan registrasi pada website MyBlogLog. Jika Anda me-miliki account Yahoo!, Anda dapat menggunakannya untuk login dan menciptakan account MyBlogLog yang baru. Hal ini dimungkinkan karena MyBlogLog telah melakukan akuisisi dengan Yahoo!.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Setelah Anda memiliki account MyBlogLog, Anda dapat menambahkan berbagai widget pada URL http://www.mybloglog.com/buzz/e_widget_newwithme.php, beberapa widget yang ditawarkan adalah widget New With Me Sidebar, New With Me Full Page, About Me, dan Email Signature.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Masing-masing widget telah disertai dengan fitur kustomisasi, kode script yang siap di-copy paste, dan preview dari widget yang bersangkutan.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"></div></blockquote><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">YouTube</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Tentunya rata-rata pengguna <a href="http://nafasku.com/tag/internet" title="Internet"><span style="color: #2255aa;">Internet</span></a> telah mengetahui website yang satu ini, bisa dikatakan bahwa YouTube mempelopori era baru pada dunia Internet dalam menciptakan komunitas sharing video.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">YouTube menyediakan web widget yang memungkinkan Anda untuk menampilkan video bar pada website Anda. Caranya adalah dengan membuat account (atau login dengan account Google) pada website http://www.youtube.com. Kemudian pilih menu Community – blog, atau mengarahkan browser Anda pada URL http://www.youtube.com/blog. Klik link add a video bar, dan Anda akan diarahkan pada halaman kustomisasi untuk menampilkan video bar pada website Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Kustomisasi yang dapat dilakukan antara lain adalah bentuk orientasi (vertikal atau horizontal), channel video yang dipilih, expression yang berbentuk keyword untuk melakukan penya ringan topik lebih lanjut. Kode program untuk mengintegrasikan video bar YouTube pada website Anda akan langsung tersedia pada halaman yang sama.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"></div></blockquote><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">Shoutbox</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Kalau pada web widget twitter, Anda dapat meninggalkan pesan untuk pengunjung website, maka dengan shoutbox, Anda dapat memberikan fasilitas pada pengunjung website untuk mening-galkan pesan pada halaman website Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Cukup banyak web widget shoutbox (umum juga disebut tagboard, shoutout, chatbox) yang dapat Anda peroleh di Internet, salah satunya adalah ShoutMix (http://www.shoutmix.com),</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Anda harus terlebih dahulu melakukan tahapan registrasi yang disediakan website ShoutMix, selanjutnya Anda akan diberikan berbagai pilihan style shoutbox yang menarik.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Setelah Anda memilih salah satu style yang Anda inginkan, Anda akan diarahkan untuk masuk ke dalam halaman control panel, di mana Anda dapat melakukan pengaturan lebih lanjut.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Untuk meletakkan shoutbox pada website Anda, mula-mula klik pada link Get codes yang terdapat pada halaman control panel, lalu pilih link Place shoutbox on webpage, dan Anda akan mendapatkan kode script yang siap untuk di-copy paste ke dalam website Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Eksplorasi halaman control panel, dan Anda akan mendapatkan ShoutMix memiliki fitur-fitur gratis seperti menghapus danmelakukan blokir pesan. ShoutMix juga menyediakan akses premium untuk fitur-fitur tambahan seperti bandwidth dan storage penyimpanan pesan yang lebih besar, arsip pesan, dan lain sebagainya.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"></div></blockquote><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">Kalender</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Salah satu web widget menarik lainnya adalah web widget kalender, yang memungkinkan Anda menampilkan jadwal dan event tertentu pada website Anda. Salah satu website yang menyediakan web widget kalender adalah http://www.widgetbox.com/widget/google-calendar, web widget ini diambil dari Google Calendar, yang memungkinkan Anda untuk sharing kalender dengan pengguna lainnya.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Pada alamat URL di atas, Anda dapat melakukan kustomisasi style kalender dan mendapatkan kode script untuk diintegrasikan ke dalam website/blog Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"></div></blockquote><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">Cuaca</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Menampilkan cuaca di berbagai kota melalui website Anda merupakan daya tarik tersendiri, salah satu penyedia web widget untuk keperluan ini adalah AccuWeather, yang dapat Anda akses pada alamat URL http://netweather.accuweather.com.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Pada halaman utama website tersebut, klik pada tombol Get My NetWeather, Anda akan di minta untuk menentukan konfi gurasi awal seperti tampilan unit (English atau Metric), bahasa, dan lokasi. Tahap selanjutnya Anda akan diminta menentukan ukuran widget, kategori, dan theme.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Langkah terakhir, akan tampil script yang siap untuk ditambahkan pada website Anda, terdapat pilihan script untuk Web Page Code dan MySpace Code. Gunakan MySpace Code jika Anda memiliki halaman pada MySpace, selain itu gunakan Web Page Code untuk ditambahkan secara manual pada website Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;"></div></blockquote><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">Data Saham</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"></div><blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Jika Anda seorang investor/trader, tentu sering mengamati be-berapa saham yang menjadi watch list favorit Anda. Bagaimana jika data tersebut tampil pada website Anda? Bahkan Anda dapat melihat pergerakan harganya pada saat bursa buka. Salah satu penyedianya dapat Anda temukan pada alamat URL http://www.widgetbox.com/widget/livestockquotes, di sini Anda dapat menentukan style tampilan web widget seperti warna, lebar, tinggi, dan tentunya simbol saham-saham port-folio Anda, juga disediakan pilihan apakah Anda mengizinkan pengunjung website untuk dapat berinteraksi ikut memasukkan simbol saham.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Selanjutnya, Anda dapat langsung menambahkan web widget tersebut pada halaman website, seperti Facebook, Blogspot, WordPress, TypePad, dan seterusnya dengan memilih icon website yang Anda kehendaki. Juga disediakan embed code yang siap diintegrasikan pada website Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"><span style="font-weight: bold;"></span></div></blockquote><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;"><span style="font-weight: bold;">Kumpulan Web Widget</span></div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Jika Anda adalah seorang blogger dan telah membuat blog pada website yang menyediakan host dan tools untuk menciptakan blog (misalnya blogspot.com, wordpress.com, dan sebagainya) Anda juga akan menemukan berbagai web widget menarik yangtelah disediakan dan dapat Anda tambahkan sebagai elemen tambahan pada halaman blog Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Terdapat keuntungan utama dari menggunakan web widget yang berasal dari host yang sama dengan website/blog Anda, yaitu website Anda tidak perlu mengambil konten dari website lain, yang berarti mengurangi beban website Anda.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Karena itu, pelajari terlebih dahulu web widget yang telah disediakan pada hosting yang Anda pergunakan, kemudian pertimbangkan web widget dari website lain jika diperlukan.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Juga terdapat website yang mengkhususkan diri menyediakan koleksi web widget dan memungkinkan Anda menciptakan web widget sendiri, misalnya ClearSpring (http://www.clearspring.com) dan WidgetBox (http://www.widgetbox.com). 7×24 jam nonstop tidak akan cukup bagi Anda untuk mencoba seluruh web widget yang tersedia pada website-website ini.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="font-weight: bold; margin: 0pt 0pt 10pt; text-align: justify;">Tetap Selektif</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Masih terdapat banyak variasi web widget lain yang dapat Anda peroleh di Internet, jika Anda perhatikan dari sisi bisnis Internet, maka terlihat service-service yang menarik dan mampu mengum-pulkan komunitas yang luas menjadi incaran perusahaan-perusahaan besar, sehingga terjadi akuisisi dan kerjasama.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Menggunakan web widget bisa jadi mengasyikkan, tetapi hati-hati karena web widget dapat digunakan oleh sebagian pihak untuk tujuan yang kurang baik. Salah satu contoh adalah web widget bernama Secret Crush, yang ternyata dapat menginstal malware, hal ini ditemukan oleh perusahaan Fortinet.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Seperti telah disinggung pada Google AdSense, web widget sebagai sarana marketing juga cukup marak digunakan, hal ini tidak mengherankan mengingat sedemikian banyak pengguna Internet dan luasnya jaringan yang dapat tercipta melalui website social network dan blog, tetapi penggunaan web widget marketing tetap perlu disesuaikan dengan konten Anda agar kenyamanan pengunjung tetap terjaga. Juga perhatikan isu kom-patibilitas web browser, sebaiknya lakukan uji coba web widget pada browser-browser yang popular dan umum digunakan.</div><div style="text-align: justify;"></div><div class="MsoNormal" style="margin: 0pt 0pt 10pt; text-align: justify;">Menggunakan web widget pada website Anda merupakan pekerjaan yang relatif mudah, tetapi memilih web widget seefektif mungkin untuk dipasang pada website Anda, bisa jadi merupakan pekerjaan yang lebih sulit.</div><div style="text-align: justify;"></div>Tidak semua web widget yang telah dicoba dan diketahui, harus berakhir dengan bertengger pada salah satu sudut halaman website Anda. Bisa jadi website Anda sama sekali tidak mem-butuhkan beberapa web widget, jangan merasa rugi jika tidak menggunakan web widget yang telah dicoba, karena selektif terhadap teknologi, merupakan salah satu cara untuk mengikuti teknologi.<br />
<br />
<div style="text-align: justify;"></div>Sumber: Majalah PC Media | Indonesiabelajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-3434231185911170602011-07-13T02:24:00.000-07:002011-07-19T19:32:35.597-07:00Membuat Text Area<div style="text-align: justify;"><br />
<a name='more'></a>Apa itu <b>text area</b>?. Text area adalah area atau tempat untuk menyimpan text atau tulisan dengan membentuk area baru. Biasanya text area ini di gunakan untuk menyimpan kode-kode <b>HTML</b> ataupun text lainnya agar bisa di copy oleh para pengunjung.<span class="fullpost"></span><br />
<span class="fullpost"><br />
Untuk membuat <b>text area</b>, silahkan anda Copy kode di bawah ini :</span><br />
<blockquote><span style="background-color: cyan;"><p align="center"><textarea name="code" rows="6" cols="20"> Tulis text ataupun kode-kode yang anda inginkan di sini, maka nanti tulisan anda akan tampil di dalam text area </textarea></p></span><span class="fullpost"> </span></blockquote><span class="fullpost"> Sebagai contoh :</span></div><div style="text-align: justify;"><textarea name="code" rows="6"><a href="http://kolom-tutorial.blogspot.com" target="_blank"><img src="http://i162.photobucket.com/albums/t253/rohman24/animasichicklet.gif" border="0" alt="Blog Tutorial" /></a></textarea></div><div style="text-align: justify;"><br />
Keterangan : rows="6", menunjukan tinggi dari text area, jadi jika anda menginginkan text area yang tinggi maka silahkan ganti angka " 6 tadi dengan angka yang lebih tinggi nilainya.<br />
<br />
Cols="20", menunjukan lebar dari text area. Jika anda menginginkan text area yang lebar maka silahkan ganti angka " 20 " tadi dengan angka yang lebih tinggi nilainya.<br />
<br />
<b>Text Area dengan memakai HighLight</b><br />
<br />
Ada variasi lain dari membuat text area ini, yakni text area dengan menggunakan tombol <b><i>highlight</i></b>. dengan adanya tombol <b><i>highlight</i></b> ini akan memudahkan bagi para pengunjung untuk mengcopy seluruh text ataupun kode-kode yang di berikan, karena dengan hanya sekali tekan saja pada tombol <b><i>highlight</i></b> tadi, maka seluruh text ataupun kode-kode yang ada di dalamnya akan di highlight dan tinggal di copy saja. Fasilitas ini sangat berguna tatkala text ataupun kode-kode yang di berikan dalan jumlah yang sangat banyak dan ini akan mengurangi resiko tertinggalnya suatu text ataupun kode-kode untuk di copy. Untuk membuat text area dengan menggunakan <b><i>highlight</i></b> ini silahkan anda copy kode <b>HTML</b> di bawah :</div><div style="text-align: justify;"><span class="fullpost"><br />
</span><br />
<blockquote style="background-color: lime;"><span class="fullpost"><code><div><form name="copy"><div</code></span><br />
<span class="fullpost"><code> align="center"><input</code></span><br />
<span class="fullpost"><code> onclick="javascript:this.form.txt.focus();this.form.txt.select();"</code></span><br />
<span class="fullpost"><code> type="button" value="Highlight All"> </div><div</code></span><br />
<span class="fullpost"><code> align="center"></div><p</code></span><br />
<span class="fullpost"><code> align="center"><textarea style="WIDTH: 300px; HEIGHT: 144px"</code></span><br />
<span class="fullpost"><code> name="txt"</code></span><br />
<span class="fullpost"><code> rows="100" wrap="VIRTUAL" cols="55"><span style="color: #722d32;">simpan tulisan anda di sini, maka tulisan yang anda tulis akan muncul di sini dan siap di copy oleh para pengunjung</span></textarea></p></div></form></code></span></blockquote><span class="fullpost"> Sebagai contoh :<br />
</span></div><div style="text-align: justify;"><form name="copy"><div align="center"><textarea cols="55" name="txt" rows="100" style="height: 120px; width: 300px;" wrap="VIRTUAL"><script language="JavaScript"> function clickIE() { if (document.all) { return false; } } function clickNS(e) { if (document.layers(document.getElementById&&!document.all)) { if (e.which==2e.which==3) { return false; } } } if (document.layers) { document.captureEvents(Event.MOUSEDOWN); document.onmousedown=clickNS; } else{ document.onmouseup=clickNS; document.oncontextmenu=clickIE; } document.oncontextmenu=new Function("return false") </script></textarea> </div></form><br />
<br />
Agar anda lebih memahami kode di atas, sedikit akan saya uraikan. Kode di atas mempunyai dua elemen bagian, yakni elemen kode untuk membuat tombol yang bertuliskan <b>Highlight All</b>, dan yang kedua adalah elemen kode untuk membuat text area.<br />
<br />
Elemen tombol <b><i>highlight All</i></b> :<br />
<br />
</div><ol style="text-align: justify;"><li> <span style="color: #722d32;"><div align="center"></span> --> kata <b>center</b><br />
menunjukan bahwa posisi tombol akan berada di tengah, jadi jika anda ingin posisi tombol berada di tepi sebelah kiri, tinggal ganti dengan kata <b>left</b>. Dan jika ingin berada di tepi sebelah kanan, tinggal ganti dengan kata <b>right</b>. </li>
<li><span style="color: #722d32;"><input onclick="javascript:this.form.txt.focus();this.form.txt.selec()"></span><br />
--> kode ini artinya ketika tombol highlight di klik, maka seluruh text yang ada di dalamnya akan di highligt (di tandai atau di blok), jadi anda jangan merubah tulisan ini.</li>
<li><span style="color: #722d32;">Value="Highlight All"</span> --> kata <i>Highlight All</i> adalah kata yang akan muncul di dalam tombol, jadi jika anda ingin merubah tulisan ini silahkan ganti dengan kata yang anda inginkan.</li>
</ol><div style="text-align: justify;">Element <b>text area</b> :<br />
<br />
</div><ol style="text-align: justify;"><li> <span style="color: #722d32;"><p align="center"></span> --><br />
ini menunjukan bahwa text area akan berada di tengah, nah jika anda ingin text area anda berada di tepi kiri, ganti kata <i>center</i> dengan kata <i>left</i>, bila ingin di tepi kanan, ganti dengan kata <i>right</i>.</li>
<li> <span style="color: #722d32;"><text style="WIDTH: 300px">--></span>kata "WIDTH:300px" menunjukan lebar dari text area tersebut sebanyak 300 pixel, jadi jika anda ingin memperpendek atau memperpanjang lebar text area, anda tinggal menggantinya dengan angka yang anda inginkan. misal:<br />
"WIDTH:700px;"</li>
<li> <span style="color: #722d32;">HEIGHT: 144px </span>--> angka "144px" menunjukan bahwa text area akan mempunyai tinggi sebesar 144 px, jadi jika anda ingin merubahnya tinggal ganti angka tersebut dengan angka yang anda inginkan. Misal : HEIGHT:160px.</li>
</ol><div style="text-align: justify;"><br />
Contoh text area yang memakai tombol <i>highlight</i> diatas, memuat skript untuk melindungi dari <i>right click</i> para pengunjung. skript ini di pakai apabila anda tidak ingin tulisan-tulisan anda di copy paste oleh pengunjung. bagi yang berminat silahkan copy lalu pasang pada kode HTML anda antara kode <HEAD> dan </HEAD><br />
selamat mencoba.<br />
<br />
<br />
</div><div style="text-align: justify;"></div>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-38129764447379888912011-07-13T02:16:00.000-07:002011-07-19T12:38:22.820-07:00Cara Mengisi/posting Artikel<a name='more'></a>Bagi anda yang mengalami sedikit kendala tentang tata cara memposting suatu artikel kedalam blog, maka kali ini akan di bahas tentang tata cara posting di blogger.com. Di dalam menu posting ada beberapa toolbar yang bisa anda gunakan.Jika anda sudah terbiasa menggunakan microsoft Word ataupun microsoft Excel tentu barangkali tidak akan mengalami kesulitan ketika memposting suatu artikel, tapi mungkin tidak ada salahnya bila saya bahas sekilas tentang ini, barangkali ada di antara teman kita yang masih bingung.<br />
<br />
<br />
Toolbar yang ada ketika posting :<br />
<br />
--> Untuk merubah jenis hurup yang di gunakan<br />
<br />
--> Untuk merubah ukuran hurup (heading)<br />
<br />
--> Untuk Menebalkan hurup<br />
<br />
--> Untuk memiringkan hurup<br />
<br />
--> Untuk merubah warna hurup<br />
<br />
--> Untuk membuat link<br />
<br />
--> Untuk membuat artikel menjadi rata kiri<br />
<br />
--> Untuk membuat tulisan menjadi di tengah<br />
<br />
--> Untuk membuat artikel menjadi rata kanan<br />
<br />
--> Untuk membuat artikel menjadi rata kiri dan rata kanan<br />
<br />
--> Untuk membuat sub bahasan oleh angka<br />
<br />
--> Untuk membuat sub bahasan oleh bullet<br />
<br />
--> Untuk mengecek spelling<br />
<br />
--> Untuk memasukan gambar(upload gambar)<br />
<br />
--> Untuk membuat artikel dalam kode HTML<br />
<br />
--> Untuk membuat artikel dalam mode Compose (biasa)<br />
<br />
--> Untuk me review (melihat) artikel<br />
<br />
Cara penggunaan toolbar di atas adalah blok (beri tanda) terlebih dahulu tulisan yang akan di edit, kemudian tekan tombol toolbar yang di inginkan.<br />
<br />
Langkah-langkah dalam memposting suatu artikel:<br />
<br />
Sebaiknya klik terlebih dahulu “ Edit HTML”,jika langsung di mode “Compose”, sering terjadi hang pada komputer (pengalaman saya pribadi). Copy artikel yang telah anda buat sebelumnya, kemudian paste di area posting. Edit sesuai dengan kemauan anda.<br />
<br />
<br />
Klik tombol “ compose “ untuk melakukan editing (jika anda masih bingung dengan kode HTML).<br />
<br />
<br />
Klik tombol tool yang berlambang “ panorama” berwarna biru, jika anda ingin memasukan gambar ataupun photo untuk menghiasi posting-an anda.<br />
<br />
<br />
Klik tombol “ Preview “ untuk melihat hasil posting-an anda yang nantinya akan tampil di dalam blog, barangkali masih ada yang perlu di edit.<br />
<br />
<br />
Klik tombol “ publish “. Selesai. Tulisan hasil karya anda akan bisa dilihat dan di baca oleh seluruh dunia.belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-50394179121666840932011-07-13T02:13:00.002-07:002011-07-19T12:38:39.846-07:00Cara Menggati Template<a name='more'></a>Sekilas tentang template blog, Template website atau blog adalah desain-desain halaman web ataupun blog beserta seluruh komponennya (misal : gambar, stylesheet, dsb) baik berupa file statis maupun file dinamis yang berupa program atau aplikasi yang berjalan sebagai aplikasi web. Seperti yang anda lihat saat ini, bahwa terlihat tatanan gambar serta tulisan di layar monitor anda, itulah yang dinamakan template.<br />
<br />
<br />
Di blogger atau blogspot, anda dapat dapat mengganti template blog anda secara leluasa sesuai dengan selera dan keinginan masing-masing. Jika anda telah mahir membuat template sendiri, anda dapat menggunakan template tersebut untuk blog anda. Namun, jika anda masih awam dalam membuat template, blogger atau blogspot sendiri telah menyediakan beberapa template yang bisa anda pilih sesuai dengan keinginan. Selain itu, anda dapat pula mengunduh atau mendownload template blogger gratis dari penyedia template blogger, salah satu contoh website yang menyediakan template blogger tersebut adalah beralamat di http://blogtemplate4u.com, disana terdapat ratusan template blogger yang bisa anda gunakan secara gratis. namun, jika anda menggunakan template gratis, syarat yang harus ditaati adalah tidak boleh menghapus atau menghilangkan credit link dari pembuat template tersebut. Dengan tidak membuang link credit pembuat template, itu adalah sebagai apresiasi atas kerja keras mereka dalam menyediakan template secara gratis.<br />
<br />
Langsung ke topik utama, Cara mengganti template di blogspot atau blogger ada dua cara, yaitu mengganti template dengan template yang disediakan blogspot, atau mengganti template dengan template yang didapat dari penyedia template. kita. Berikut ulasannya :<br />
Mengganti Template dengan Template yang disediakan blogger<br />
<br />
Berikut cara-cara untuk mengganti template dengan template yang telah disediakan blogger:<br />
<br />
Silahkan login ke blogger dengan ID anda.<br />
Klik Rancangan. <br />
<br />
rancangan<br />
Klik menu Perancang Template. Selanjutnya akan muncul jendela perancang template blogger.<br />
<br />
perancang template<br />
Klik pada pilihan template yang tersedia (saat tartikel ini ditulis template yang terdia berjumlah 6 template). Selain itu, anda dapat pula memilih background atau gambar latar belakang dari template tersebut. Jika sudah cocok dengan salah satu template, klik APPLY TO BLOG.<br />
<br />
blogger template designer<br />
Selesai.<br />
<br />
Mengganti Template dengan template dari penyedia template<br />
<br />
Berikut cara-cara untuk mengganti template dengan template dari penyedia template :<br />
<br />
Download terlebih dahulu template yang anda sukai pada website penyedia template blog gratis. Salah satu contoh anda bisa download di blogger templates.<br />
File template yang didownload, biasanya masih dalam bentuk terkompresi (zip atau rar), oleh karenanya anda perlu mengekstrak atau menguraikan file tersebut dengan software ekstraktor seperti WinZip atau WinRar, Namun jika anda tidak memiliki software tersebut, anda bisa mengekstraknya secara online di Wobzip.<br />
<br />
ekstrak template<br />
Yang nanti di upload atau di unggah ke blogger hanyalah file yang berekstensi .xml.<br />
Silahkan login ke blogger dengan ID anda.<br />
Klik Rancangan.<br />
<br />
rancangan<br />
Klik menu Edit HTML.<br />
<br />
edit html<br />
Disarankan untuk membuat backup terlebih dahulu, klik pada tulisan Download Template Lengkap.<br />
<br />
download template lengkap<br />
<br />
Klik tombol Browse.., pilih file template yang tadi didownload dan telah diekstrak ( file ekstensi .xml saja ). Kemudian klik tombol Unggah.<br />
<br />
unggah template<br />
Apabila ada muncul peringatan tentang widget, klik pada tombol PERTAHANKAN WIDGET.<br />
<br />
pertahankan-widget<br />
Selesai.belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-58001528023026465832011-07-13T02:13:00.001-07:002011-07-19T12:38:53.427-07:00Buat Costum Domain<a name='more'></a>Hal pertama yang penting anda lakukan agar blog anda di blogger mempunyai performa yang baik adalah melakukan beberapa Setting atau pengaturan. Sebagai bahan inspirasi bagaimana cara melakukan setting blog di blogger, berikut Kolom Tutorial tuliskan cara pengaturan blog di blogger (pastikan anda (pastikan anda memilih bahasa indonesia agar sesuai dengan tutorial dibawah) :<br />
<br />
<br />
<br />
* Silahkan login ke blogger dengan ID anda.<br />
<br />
* Klik Pengaturan.<br />
<br />
pengaturan blog di blogger <br />
<br />
* Akan terlihat tab-tab menu berisi hal-hal yang harus anda atur :<br />
<br />
menu pengaturan blog di blogspot<br />
Dasar<br />
<br />
Beberapa pengaturan dalam menu Dasar:<br />
<br />
Alat Blog : Impor blog → ini adalah faslitas untuk mengimpor data dari komputer anda ( ini biasanya dilakukan ketika transfer blog) tidak usah di klik, biarkan saja. Ekspor blog > ini adalah fasilitas untuk mengekspor data blog dari server blogger ke komputer anda. Fasilitas ini disebut juga sebagai fasilitas Backup blog. Disarankan agar anda membuat backup data ke komputer anda, minimal satu minggu sekali. Data backup tersebut sewaktu-waktu bisa bermanfaat ketika anda ingin mentransfer ke blog lain di blogger, atau bisa juga untuk migrasi ke mesin blog yang lain seperti Wordpress. Hapus blog > Fasilitas untuk menghapus blog anda. Jika anda tidak berniat untuk menghapus blog, maka jangan sekali-sekali klik link ini.<br />
Judul : isi dengan judul blog yang anda inginkan. Contoh : My personal blog<br />
Uraian : isi dengan deskripsi blog yang ingin ditampilkan, sebaiknya ini diisi jangan dikosongkan. Contoh : catatan kecil hidupku yang unik.<br />
Tambahkan blog Anda ke daftar kami? : disarankan untuk memilih opsi Ya.<br />
Biarkan mesin pencari menemukan blog Anda? : Pilih Ya, agar blog anda dapat di index oleh mesin pencari seperti Google, Yahoo atau Bing.<br />
Tampilkan Editing Cepat di Blog Anda? : Boleh pilih Ya atau Tidak.<br />
Tampilkan Link Posting Email? : Ini berupa icon email, jika anda menginginkan agar pengunjung blog dengan mudah mengirimkan email ke teman mereka tentang blog anda, maka Pilih Ya. Namun jika tidak, silahkan pilih Tidak.<br />
Konten Dewasa? : Jika blog anda nantinya akan berisi hal-hal yang besifat dewasa seperti menampilkan artikel, gambar, atau video wanita seksi, dll maka pilih Ya. Namun, jika blog anda berisi hal-hal yang aman diakses oleh anak kecil, pilih Tidak. Sebagai catatan, jika anda memilih opsi Ya, maka nantinya ketika diakses blog anda akan ada peringatan bahwa berisi konten dewasa.<br />
Pilih editor entri : Ini adalah pilihan untuk post editor. Editor yang diperbarui → ini adalah post editor terbaru yang dimiliki oleh blogger, banyak fasilitas baru yang terintegrasi dalam post editor ini seperti tombol More untuk memotong artikel di blog anda. Editor lama → ini adalah post editor lama yang dimiliki blogger namun masih bisa anda gunakan, ada beberapa toolbar terdapat dalam post editor lama, namun tidak disediakan lagi di post editor baru, jadi silahkan pilih mana yang anda mau. Sembunyikan mode penyusunan → pilihan ini khusus bagi anda yang sudah mahir dengan kode HTML, jika anda tidak menguasai tentang HTML, jangan gunakan post editor ini.<br />
Aktifkan transliterasi? : Pilih Aktifkan jika post editor anda ingin mendukung ke translasi Hindi, Kannada, Malayalam, Tamil, atau Telugu. Pilih Nonaktifkan jika post editor anda tidak ingin ada translasi bahasa tersebut.<br />
Akhiri pengaturan menu Basic dengan klik tombol SIMPAN SETELAN.<br />
<br />
Publikasikan<br />
<br />
Ini adalah fasilitas untuk mengubah nama domain anda di blogger dengan nama domain milik anda sendiri. Misal : http://namabloganda.blogspot.com menjadi http://namabloganda.com.<br />
<br />
Untuk sementara waktu jangan lakukan apa-apa pada menu publikasikan ini. Tutorial tentang custom domain di blogger bisa anda baca pada artikel Cara Custom Domain di Blogger.<br />
<br />
<br />
Format<br />
<br />
Beberapa pengaturan dalam menu Format :<br />
<br />
Tampilkan sebanyak mungkin : tulis jumlah post yang ingin tampil di halaman depan blog anda. Contoh : 5. Untuk pilihan dropdown disarankan untuk memilih opsi posting, jangan hari.<br />
Format Header Tanggal : Pilih format tampilan tanggal yang anda sukai.<br />
Format Tanggal Index Arsip : pilih format tampilan arsip yang anda inginkan.<br />
Format Timestamp : Pilih format tampilan jam yang anda sukai. Jam disini adalah catatan waktu ketika artikel anda di publikasikan di blog.<br />
Zona Waktu : Sesuikan dengan zona waktu dimana tempat anda berada.<br />
Bahasa : Pilih bahasa yang dipakai untuk blog anda.<br />
Konversi ganti baris : ini adalah fasilitas line break secara otomatis ketika anda klik enter ketika membuat sebuah posting. Fasilitas ini di pakai apabila anda kedepannya tidak akan memposting tentang kode-kode semisal HTML dan lain sebagainya. Pilih Tidak, jika anda berniat nantinya akan memasukkan kode-kode HTML kedalam posting posting anda, misal jika konten blog anda berisi tutorial bahasa HTML, PHP dan lain sebagainya.<br />
Tampilkan Field Judul : Pilih Ya ataupun Tidak juga tidak ada masalah.<br />
Tampilkan kolom Link : Pilih Tidak atau Ya juga tidak ada masalah.<br />
Aktifkan perataan float : Pilih Ya, ini adalah agar gambar bisa diatur posisinya dalam postingan. Namun jika pilihan ini mengganggu tampilan blog anda nantinya, pilih saja Tidak.<br />
Templat Entri : ini adalah fasilitas agar isi dari Templat Entri ini akan selalu muncul pada saat membuat posting. Biasanya fasilitas ini sering di gunakan untuk signature blog, yaitu tulisan atau kode signature disimpan dalam Templat Entri, sehingga ketika anda membuat posting, kode signature tersebut akan secara otomatis muncul tanpa harus menuliskannya secara berulang-ulang.<br />
Akhiri Pengaturan menu Format dengan klik tombol SIMPAN SETELAN<br />
<br />
Komentar<br />
<br />
Beberapa pengaturan dalam menu Komentar :<br />
<br />
Komentar: Pilih Tampilkan, jika anda menginginkan agar postingan ada bisa di komentari oleh pengunjung. Pilih Sembunyikan, jika artikel yang anda posting tidak ingin di komentari oleh pengunjung.<br />
Siapa yang Bisa Berkomentar ? : Siapa pun - termasuk Pengguna Anonim → untuk pilihan ini, maka siapa saja dapat berkomentar, termasuk Pengguna Anonim atau tanpa identitas jelas. Pengguna Terdaftar - termasuk OpenID → hanya user yang teregistrasi saja yang bisa berkomentar terhadap artikel anda, yang termasuk Pengguna Terdaftar adalah mereka yang mempunya akun di Google, Live Journal, Wordpress, Type pad, AIM, serta OpenID. Pengguna dengan Google Account → Yang bisa berkomentar hanyalah mereka yang mempunyai akun google. Hanya anggota blog ini → Hanya anggota dari blog anda saja yang bisa berkomentar, ini biasanya dipakai jika blog anda adalah untuk komunitas tertentu, misal komunitas pendidikan.<br />
Penempatan Formulir Komentar : Halaman penuh → halaman blog anda akan di timpa oleh kotak komentar ketika ada pengunjung klik link komentar. Jendela munculan → Kotak komentar akan muncul dalam jendela baru apabila ada pengunjung yang klik link komentar. Disemat di bawah entri → kotak komentar akan langsung ditampilkan langsung dibawah artikel posting anda, sehingga pengunjung dapat langsung memeberikan komentar tanpa harus klik link komentar. Format kotak komentar yang paling banyak disukai oleh blogger adalah Disemat di bawah entri.<br />
Default Komentar untuk Entri : pilih Entri baru memiliki komentar jika artikel post anda ingin ada kotak komentarnya, namun sewaktu-waktu anda bisa saja mematikan fungsi ini ketika melakukan posting. Pilih Entri baru tidak memiliki komentar jika artikel post anda tidak ingin mempunyai kotak komentar, namun sewaktu-waktu anda bisa saja memunculkan fungsi ini ketika melakukan posting.<br />
Tautbalik : Pilih Tampilkan jika anda ingin menampilkan link ke website yang membuat link ke artikel yang anda buat. Pilih Sembunyikan jika anda tidak ingin menampilkan link ke website yang membuat link ke artikel yang anda buat.<br />
Bawaan Tautbalik untuk Posting : pilih Entri baru memiliki Tautbalik jika setiap artikel yang di posting memiliki Backlinks. Pilih Entri baru tidak memiliki Tautbalik jika setiap artikel yang di posting tidak ingin memiliki Backlinks.<br />
Format Timestamp Komentar : pilih format tampilan tanggal komentar yang anda sukai.<br />
Pesan Formulir Komentar : Tulis pesan yang ingin muncul diatas kotak komentar. Misal : Silahkan anda berkomentar, namun tetap jaga kesopanan dengan tidak melakukan komentar spam.<br />
Moderasi komentar : Pilih Selalu jika setiap komentar yang masuk ingin di moderasi terlebih dahulu oleh anda. Pilih Hanya pada entri yang lebih lawas dari jika komentar ingin di moderasi terlebih dahulu terhadapat posting yang umurnya telah anda tentukan. Pilih Tidak pernah, jika komentar yang masuk tidak ingin di moderasi terlebih dahulu dan akan langsung muncul diblog anda. Jangan lupa untuk memasukkan alamat email anda, apabila ketika ada orang yang berkomentar anda akan mengetahuinya melalui email. Atau kosongkan saja apabila anda tidak ingin menerima email pemberitahuan tentang komentar.<br />
Tampilkan verifikasi kata untuk komentar? : Pilih Ya jika ingin menampilkan huruf verifikasi ketika ada yang berkomentar, pilihan ini adalah untuk mencegah terhadap script robot spam yang bisa membombardir blog anda dengan komentar, walaupun begitu pilihan ini mempunyai kekurangan yaitu pengunjung blog anda biasanya malas untuk berkomentar karena merasa ribet ketika berkomentar. Pilih Ya jika tidak ingin menampilkan huruf verifikasi, pilihan ini sedikit rentan terhadap script robot spam, namun biasanya pengunjung akan lebih suka berkomentar karena mudah dilakukan.<br />
Tampilkan gambar profil dalam komentar? : Pilih Ya jika dalam kometar ingin ditampilkan gambar profile yang berkomentar. Pilih Tidak jika tidak ingin menampilkan gambar profile pemberi komentar.<br />
Email Pemberitahuan Komentar : Masukkan alamat email yang ingin dikirim notifikasi apabila ada yang berkomentar. Jumlah maksimal email yang dapat menerima adalah 10 email.<br />
Akhiri pengaturan menu Komentar dengan klik tombol SIMPAN SETELAN.<br />
<br />
Arsipkan<br />
<br />
Beberapa pengaturan dalam menu Arsipkan :<br />
<br />
Frekuensi Arsip : pilih arsip yang ingin di tampilkan apakah Arsip tidak ada, Harian,Mingguan, atau Tiap Bulan. Disarankan untuk memilih Tiap Bulan.<br />
Aktifkan Halaman Posting? : Silahkan pilih Ya atau Tidak.<br />
Akhiri pengaturan menu Arsipkan dengan klik tombol SIMPAN SETELAN.<br />
<br />
Feed Situs<br />
<br />
Beberapa pengaturan dalam menu Feed Situs :<br />
<br />
Izinkan Feed Blog : Silahkan pilih Tak satupun, Singkat, atau Penuh. Disarankan untuk memilih opsi Penuh.<br />
Posting URL Pengubahan Arah Feed : isi dengan alamat feed milik anda, ini adalah jika anda telah melakukan burner feed seperti misalnya dengan feedburner. Namun jika belum punya, silahkan dikosongkan saja terlebih dahulu. Untuk pembahasan feed burner akan di posting pada posting selanjutnya.<br />
Post Feed Footer : Isi dengan kode yang ingin tampil pada footer post feed. Jika belum mengerti dikosongkan saja terlebih dahulu.<br />
Akhiri Pengaturan menu Feed Situs dengan klik tombol SIMPAN SETELAN.<br />
<br />
Email & Seluler<br />
<br />
Untuk memposting sebuah artikel kedalam blog anda, tidak hanya melalui post editor yang ada di blogger. Namun, anda pun bisa posting artikel melalui email ataupun perangkat seluler anda.<br />
<br />
Beberapa pengaturan dalam menu Email & Seluler :<br />
<br />
Alamat BlogSend : tulis alamat email yang ingin dikirim notifikasi apabila anda mempublikasikan sebuah artikel. Maksimal jumlah yang bisa di kirim adalah sampai 10 buah email, format penulisan email di pisahkan dengan tanda koma ( , ).<br />
<br />
Alamat Pengeposan via Email : buatlah alamat email blogger untuk mengirimkan posting dari email atau perangkat seluler dengan cara menuliskan pada kotak yang tersedia. Misalkan alamat email anda adalah contohsaja@gmail.com maka anda bisa membuat email blogger menjadi contohsaja.post@blogger.com atau contohsaja.blog@blogger.com atau apa saja menurut anda yang bagus. Tapi ingat, rahasiakan alamat email ini agar orang lain tidak bisa posting ke blog anda<br />
<br />
alamat pengeposan via email<br />
<br />
Untuk mengaktifkan fitur ini, anda harus memilih opsi Publikasikan segera email, artinya apabila anda mengirimkan email ke alamat diatas, isinya akan langsung diposting ke blog. Jika opsi yang dipilih adalah Simpan email sebagai entri konsep, maka email yang dikirimkan tidak akan langsung di publikasikan, melainkan akan masuk ke post konsep.<br />
<br />
Namun, apabila anda tidak ingin mempublikasikan melalui email, pilih opsi Dinonaktifkan. Fungsi ini banyak juga dipilih dengan alasan keamanan.<br />
<br />
Jangan lupa akhiri pengaturan menu Email & Seluler dengan klik tombol SIMPAN SETELAN.<br />
OpenID<br />
<br />
Disini tidak ada yang harus di atur, melainkan pemberitahuan bahwa alamat blog anda bisa digunakan sebagai alamat OpenID. Apa itu OpenID? Mungkin lain kali akan dibahas.<br />
Izin<br />
<br />
Pada menu ini anda dapat menambahkan penulis dengan cara di undang ke email yang anda anggap layak untuk ikut serta menjadi penulis di blog anda.<br />
<br />
Pada Siapa yang bisa melihat blog ini? Anda dapat memilih siapa saja yang dapat mengakses blog anda. Opsi Siapapun berarti blog anda terbuka untuk umum atau bisa dibuka oleh siapa saja. Hanya Orang-orang yang saya pilih yaitu hanya orang-orang yang di undang oleh anda yang dapat mengakses blog anda dengan cara login terlebih dahulu. Hanya penulis blog berarti hanya penulis saja yang bisa mengakses isi halaman blog anda, Opsi Hanya penulis blog terkadang di gunakan juga pada saat mengganti template, agar blog anda tidak terlihat semrawut ketika mengganti template.<br />
<br />
Untuk pembahasan Cara Pengaturan Blog Di blogger sepertinya sudah cukup, apa opini anda tentang ini?belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-8361676921608040142011-07-13T02:10:00.000-07:002011-07-19T12:39:08.243-07:00Cara Seting di Blogger<a name='more'></a>Hal pertama yang penting anda lakukan agar blog anda di blogger mempunyai performa yang baik adalah melakukan beberapa Setting atau pengaturan. Sebagai bahan inspirasi bagaimana cara melakukan setting blog di blogger, berikut Kolom Tutorial tuliskan cara pengaturan blog di blogger (pastikan anda (pastikan anda memilih bahasa indonesia agar sesuai dengan tutorial dibawah) :<br />
<br />
<br />
<br />
* Silahkan login ke blogger dengan ID anda.<br />
<br />
* Klik Pengaturan.<br />
<br />
pengaturan blog di blogger <br />
<br />
* Akan terlihat tab-tab menu berisi hal-hal yang harus anda atur :<br />
<br />
menu pengaturan blog di blogspot<br />
Dasar<br />
<br />
Beberapa pengaturan dalam menu Dasar:<br />
<br />
Alat Blog : Impor blog → ini adalah faslitas untuk mengimpor data dari komputer anda ( ini biasanya dilakukan ketika transfer blog) tidak usah di klik, biarkan saja. Ekspor blog > ini adalah fasilitas untuk mengekspor data blog dari server blogger ke komputer anda. Fasilitas ini disebut juga sebagai fasilitas Backup blog. Disarankan agar anda membuat backup data ke komputer anda, minimal satu minggu sekali. Data backup tersebut sewaktu-waktu bisa bermanfaat ketika anda ingin mentransfer ke blog lain di blogger, atau bisa juga untuk migrasi ke mesin blog yang lain seperti Wordpress. Hapus blog > Fasilitas untuk menghapus blog anda. Jika anda tidak berniat untuk menghapus blog, maka jangan sekali-sekali klik link ini.<br />
Judul : isi dengan judul blog yang anda inginkan. Contoh : My personal blog<br />
Uraian : isi dengan deskripsi blog yang ingin ditampilkan, sebaiknya ini diisi jangan dikosongkan. Contoh : catatan kecil hidupku yang unik.<br />
Tambahkan blog Anda ke daftar kami? : disarankan untuk memilih opsi Ya.<br />
Biarkan mesin pencari menemukan blog Anda? : Pilih Ya, agar blog anda dapat di index oleh mesin pencari seperti Google, Yahoo atau Bing.<br />
Tampilkan Editing Cepat di Blog Anda? : Boleh pilih Ya atau Tidak.<br />
Tampilkan Link Posting Email? : Ini berupa icon email, jika anda menginginkan agar pengunjung blog dengan mudah mengirimkan email ke teman mereka tentang blog anda, maka Pilih Ya. Namun jika tidak, silahkan pilih Tidak.<br />
Konten Dewasa? : Jika blog anda nantinya akan berisi hal-hal yang besifat dewasa seperti menampilkan artikel, gambar, atau video wanita seksi, dll maka pilih Ya. Namun, jika blog anda berisi hal-hal yang aman diakses oleh anak kecil, pilih Tidak. Sebagai catatan, jika anda memilih opsi Ya, maka nantinya ketika diakses blog anda akan ada peringatan bahwa berisi konten dewasa.<br />
Pilih editor entri : Ini adalah pilihan untuk post editor. Editor yang diperbarui → ini adalah post editor terbaru yang dimiliki oleh blogger, banyak fasilitas baru yang terintegrasi dalam post editor ini seperti tombol More untuk memotong artikel di blog anda. Editor lama → ini adalah post editor lama yang dimiliki blogger namun masih bisa anda gunakan, ada beberapa toolbar terdapat dalam post editor lama, namun tidak disediakan lagi di post editor baru, jadi silahkan pilih mana yang anda mau. Sembunyikan mode penyusunan → pilihan ini khusus bagi anda yang sudah mahir dengan kode HTML, jika anda tidak menguasai tentang HTML, jangan gunakan post editor ini.<br />
Aktifkan transliterasi? : Pilih Aktifkan jika post editor anda ingin mendukung ke translasi Hindi, Kannada, Malayalam, Tamil, atau Telugu. Pilih Nonaktifkan jika post editor anda tidak ingin ada translasi bahasa tersebut.<br />
Akhiri pengaturan menu Basic dengan klik tombol SIMPAN SETELAN.<br />
<br />
Publikasikan<br />
<br />
Ini adalah fasilitas untuk mengubah nama domain anda di blogger dengan nama domain milik anda sendiri. Misal : http://namabloganda.blogspot.com menjadi http://namabloganda.com.<br />
<br />
Untuk sementara waktu jangan lakukan apa-apa pada menu publikasikan ini. Tutorial tentang custom domain di blogger bisa anda baca pada artikel Cara Custom Domain di Blogger.<br />
<br />
<br />
Format<br />
<br />
Beberapa pengaturan dalam menu Format :<br />
<br />
Tampilkan sebanyak mungkin : tulis jumlah post yang ingin tampil di halaman depan blog anda. Contoh : 5. Untuk pilihan dropdown disarankan untuk memilih opsi posting, jangan hari.<br />
Format Header Tanggal : Pilih format tampilan tanggal yang anda sukai.<br />
Format Tanggal Index Arsip : pilih format tampilan arsip yang anda inginkan.<br />
Format Timestamp : Pilih format tampilan jam yang anda sukai. Jam disini adalah catatan waktu ketika artikel anda di publikasikan di blog.<br />
Zona Waktu : Sesuikan dengan zona waktu dimana tempat anda berada.<br />
Bahasa : Pilih bahasa yang dipakai untuk blog anda.<br />
Konversi ganti baris : ini adalah fasilitas line break secara otomatis ketika anda klik enter ketika membuat sebuah posting. Fasilitas ini di pakai apabila anda kedepannya tidak akan memposting tentang kode-kode semisal HTML dan lain sebagainya. Pilih Tidak, jika anda berniat nantinya akan memasukkan kode-kode HTML kedalam posting posting anda, misal jika konten blog anda berisi tutorial bahasa HTML, PHP dan lain sebagainya.<br />
Tampilkan Field Judul : Pilih Ya ataupun Tidak juga tidak ada masalah.<br />
Tampilkan kolom Link : Pilih Tidak atau Ya juga tidak ada masalah.<br />
Aktifkan perataan float : Pilih Ya, ini adalah agar gambar bisa diatur posisinya dalam postingan. Namun jika pilihan ini mengganggu tampilan blog anda nantinya, pilih saja Tidak.<br />
Templat Entri : ini adalah fasilitas agar isi dari Templat Entri ini akan selalu muncul pada saat membuat posting. Biasanya fasilitas ini sering di gunakan untuk signature blog, yaitu tulisan atau kode signature disimpan dalam Templat Entri, sehingga ketika anda membuat posting, kode signature tersebut akan secara otomatis muncul tanpa harus menuliskannya secara berulang-ulang.<br />
Akhiri Pengaturan menu Format dengan klik tombol SIMPAN SETELAN<br />
<br />
Komentar<br />
<br />
Beberapa pengaturan dalam menu Komentar :<br />
<br />
Komentar: Pilih Tampilkan, jika anda menginginkan agar postingan ada bisa di komentari oleh pengunjung. Pilih Sembunyikan, jika artikel yang anda posting tidak ingin di komentari oleh pengunjung.<br />
Siapa yang Bisa Berkomentar ? : Siapa pun - termasuk Pengguna Anonim → untuk pilihan ini, maka siapa saja dapat berkomentar, termasuk Pengguna Anonim atau tanpa identitas jelas. Pengguna Terdaftar - termasuk OpenID → hanya user yang teregistrasi saja yang bisa berkomentar terhadap artikel anda, yang termasuk Pengguna Terdaftar adalah mereka yang mempunya akun di Google, Live Journal, Wordpress, Type pad, AIM, serta OpenID. Pengguna dengan Google Account → Yang bisa berkomentar hanyalah mereka yang mempunyai akun google. Hanya anggota blog ini → Hanya anggota dari blog anda saja yang bisa berkomentar, ini biasanya dipakai jika blog anda adalah untuk komunitas tertentu, misal komunitas pendidikan.<br />
Penempatan Formulir Komentar : Halaman penuh → halaman blog anda akan di timpa oleh kotak komentar ketika ada pengunjung klik link komentar. Jendela munculan → Kotak komentar akan muncul dalam jendela baru apabila ada pengunjung yang klik link komentar. Disemat di bawah entri → kotak komentar akan langsung ditampilkan langsung dibawah artikel posting anda, sehingga pengunjung dapat langsung memeberikan komentar tanpa harus klik link komentar. Format kotak komentar yang paling banyak disukai oleh blogger adalah Disemat di bawah entri.<br />
Default Komentar untuk Entri : pilih Entri baru memiliki komentar jika artikel post anda ingin ada kotak komentarnya, namun sewaktu-waktu anda bisa saja mematikan fungsi ini ketika melakukan posting. Pilih Entri baru tidak memiliki komentar jika artikel post anda tidak ingin mempunyai kotak komentar, namun sewaktu-waktu anda bisa saja memunculkan fungsi ini ketika melakukan posting.<br />
Tautbalik : Pilih Tampilkan jika anda ingin menampilkan link ke website yang membuat link ke artikel yang anda buat. Pilih Sembunyikan jika anda tidak ingin menampilkan link ke website yang membuat link ke artikel yang anda buat.<br />
Bawaan Tautbalik untuk Posting : pilih Entri baru memiliki Tautbalik jika setiap artikel yang di posting memiliki Backlinks. Pilih Entri baru tidak memiliki Tautbalik jika setiap artikel yang di posting tidak ingin memiliki Backlinks.<br />
Format Timestamp Komentar : pilih format tampilan tanggal komentar yang anda sukai.<br />
Pesan Formulir Komentar : Tulis pesan yang ingin muncul diatas kotak komentar. Misal : Silahkan anda berkomentar, namun tetap jaga kesopanan dengan tidak melakukan komentar spam.<br />
Moderasi komentar : Pilih Selalu jika setiap komentar yang masuk ingin di moderasi terlebih dahulu oleh anda. Pilih Hanya pada entri yang lebih lawas dari jika komentar ingin di moderasi terlebih dahulu terhadapat posting yang umurnya telah anda tentukan. Pilih Tidak pernah, jika komentar yang masuk tidak ingin di moderasi terlebih dahulu dan akan langsung muncul diblog anda. Jangan lupa untuk memasukkan alamat email anda, apabila ketika ada orang yang berkomentar anda akan mengetahuinya melalui email. Atau kosongkan saja apabila anda tidak ingin menerima email pemberitahuan tentang komentar.<br />
Tampilkan verifikasi kata untuk komentar? : Pilih Ya jika ingin menampilkan huruf verifikasi ketika ada yang berkomentar, pilihan ini adalah untuk mencegah terhadap script robot spam yang bisa membombardir blog anda dengan komentar, walaupun begitu pilihan ini mempunyai kekurangan yaitu pengunjung blog anda biasanya malas untuk berkomentar karena merasa ribet ketika berkomentar. Pilih Ya jika tidak ingin menampilkan huruf verifikasi, pilihan ini sedikit rentan terhadap script robot spam, namun biasanya pengunjung akan lebih suka berkomentar karena mudah dilakukan.<br />
Tampilkan gambar profil dalam komentar? : Pilih Ya jika dalam kometar ingin ditampilkan gambar profile yang berkomentar. Pilih Tidak jika tidak ingin menampilkan gambar profile pemberi komentar.<br />
Email Pemberitahuan Komentar : Masukkan alamat email yang ingin dikirim notifikasi apabila ada yang berkomentar. Jumlah maksimal email yang dapat menerima adalah 10 email.<br />
Akhiri pengaturan menu Komentar dengan klik tombol SIMPAN SETELAN.<br />
<br />
Arsipkan<br />
<br />
Beberapa pengaturan dalam menu Arsipkan :<br />
<br />
Frekuensi Arsip : pilih arsip yang ingin di tampilkan apakah Arsip tidak ada, Harian,Mingguan, atau Tiap Bulan. Disarankan untuk memilih Tiap Bulan.<br />
Aktifkan Halaman Posting? : Silahkan pilih Ya atau Tidak.<br />
Akhiri pengaturan menu Arsipkan dengan klik tombol SIMPAN SETELAN.<br />
<br />
Feed Situs<br />
<br />
Beberapa pengaturan dalam menu Feed Situs :<br />
<br />
Izinkan Feed Blog : Silahkan pilih Tak satupun, Singkat, atau Penuh. Disarankan untuk memilih opsi Penuh.<br />
Posting URL Pengubahan Arah Feed : isi dengan alamat feed milik anda, ini adalah jika anda telah melakukan burner feed seperti misalnya dengan feedburner. Namun jika belum punya, silahkan dikosongkan saja terlebih dahulu. Untuk pembahasan feed burner akan di posting pada posting selanjutnya.<br />
Post Feed Footer : Isi dengan kode yang ingin tampil pada footer post feed. Jika belum mengerti dikosongkan saja terlebih dahulu.<br />
Akhiri Pengaturan menu Feed Situs dengan klik tombol SIMPAN SETELAN.<br />
<br />
Email & Seluler<br />
<br />
Untuk memposting sebuah artikel kedalam blog anda, tidak hanya melalui post editor yang ada di blogger. Namun, anda pun bisa posting artikel melalui email ataupun perangkat seluler anda.<br />
<br />
Beberapa pengaturan dalam menu Email & Seluler :<br />
<br />
Alamat BlogSend : tulis alamat email yang ingin dikirim notifikasi apabila anda mempublikasikan sebuah artikel. Maksimal jumlah yang bisa di kirim adalah sampai 10 buah email, format penulisan email di pisahkan dengan tanda koma ( , ).<br />
<br />
Alamat Pengeposan via Email : buatlah alamat email blogger untuk mengirimkan posting dari email atau perangkat seluler dengan cara menuliskan pada kotak yang tersedia. Misalkan alamat email anda adalah contohsaja@gmail.com maka anda bisa membuat email blogger menjadi contohsaja.post@blogger.com atau contohsaja.blog@blogger.com atau apa saja menurut anda yang bagus. Tapi ingat, rahasiakan alamat email ini agar orang lain tidak bisa posting ke blog anda<br />
<br />
alamat pengeposan via email<br />
<br />
Untuk mengaktifkan fitur ini, anda harus memilih opsi Publikasikan segera email, artinya apabila anda mengirimkan email ke alamat diatas, isinya akan langsung diposting ke blog. Jika opsi yang dipilih adalah Simpan email sebagai entri konsep, maka email yang dikirimkan tidak akan langsung di publikasikan, melainkan akan masuk ke post konsep.<br />
<br />
Namun, apabila anda tidak ingin mempublikasikan melalui email, pilih opsi Dinonaktifkan. Fungsi ini banyak juga dipilih dengan alasan keamanan.<br />
<br />
Jangan lupa akhiri pengaturan menu Email & Seluler dengan klik tombol SIMPAN SETELAN.<br />
OpenID<br />
<br />
Disini tidak ada yang harus di atur, melainkan pemberitahuan bahwa alamat blog anda bisa digunakan sebagai alamat OpenID. Apa itu OpenID? Mungkin lain kali akan dibahas.<br />
Izin<br />
<br />
Pada menu ini anda dapat menambahkan penulis dengan cara di undang ke email yang anda anggap layak untuk ikut serta menjadi penulis di blog anda.<br />
<br />
Pada Siapa yang bisa melihat blog ini? Anda dapat memilih siapa saja yang dapat mengakses blog anda. Opsi Siapapun berarti blog anda terbuka untuk umum atau bisa dibuka oleh siapa saja. Hanya Orang-orang yang saya pilih yaitu hanya orang-orang yang di undang oleh anda yang dapat mengakses blog anda dengan cara login terlebih dahulu. Hanya penulis blog berarti hanya penulis saja yang bisa mengakses isi halaman blog anda, Opsi Hanya penulis blog terkadang di gunakan juga pada saat mengganti template, agar blog anda tidak terlihat semrawut ketika mengganti template.<br />
<br />
Untuk pembahasan Cara Pengaturan Blog Di blogger sepertinya sudah cukup, apa opini anda tentang ini?belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-32812349430987325092011-07-13T02:03:00.001-07:002011-07-19T12:39:22.080-07:00Membuat Scroll<a name='more'></a>Menanggapi salah satu pertanyaan dari pembaca blog ini tentang<br />
“bagaimana cara membuat elemen halaman yang mempunyai fungsi scroll seperti milik kang Rohman tentang <b>Blog Tutorial untuk pemula</b> yang ada di bagian atas blog ini?” Jawabannya boleh di bilang<br />
sederhana, sebab untuk membuat halaman seperti itu tidaklah harus membuat kode <b>html</b> yang sangat banyak, melainkan hanya sedikit kode untuk membuatnya. Penasaran seperti apa kodenya, ini dia yang di maksud.<br />
Untuk membuat halaman seperti itu, anda hanya membuat kode seperti ini :<br />
<br />
<a href="http://www.blogger.com/post-edit.g?blogID=2991581112131400583&postID=3281234943098732509" name="more"></a><br />
<div style="overflow:auto;width:300px;height:200px;padding:10px;border:1px solid #eee"><br />
<span style="color: red;">isi halaman</span><br />
</div><br />
Contoh :<br />
<pre><code><div style="overflow:auto;width:300px;height:200px;padding:10px;border:1px solid #eee">
<ol>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/bikin-blog.html"> Panduan membuat blog</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/cara-setting-blog.html">Cara setting blog</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/memilih-template.html">Memilih template</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/mengatur-hurup-dan-warna.html">Mengatur huruf dan warna</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/cara-memposting-artikel.html">Cara memposting artikel</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-read-more-1.html">buat Read more pada template klasik</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-text-area.html">Cara membuat Text Area</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-menu-dropdown.html">Cara membuat menu dropDown</a><li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/upload-gambar-dan-foto-profile.html">cara Upload foto</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-link-1.html">Cara membuat Link(1)</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-link-2.html">Cara membuat Link(2)</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-marquee.html">Cara membuat marquee (text berjalan)</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-refresh.html">Cara membuat efek Refresh</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/kode-html-tampil-di-posting.html">Kode HTML tampil pada postingan</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/masalah-posting-artikel.html">Masalah posting artikel</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/yahoo-messenger-emoticons.html">Simbol Yahoo! Emoticons</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/blogger-emoticons.html">Simbol Blogger Emoticons</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/pasang-jam-blog-di-sidebar.html">Cara Pasang jam </a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/membuat-banner-animasi.html">Cara membuat banner animasi</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/pasang-buku-tamu-di-sidebar.html">Cara membuat buku tamu</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/tutorial-html.html">HTML Tutorial</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/download-gratis.html">Free Download</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/membuat-foto-animasi.html">Foto animasi</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/pasang-statistik-tarcker.html">Cara pasang Statistik &amp; Tracker</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/ie-firefox-dalam-satu-komputer.html">Perlunya IE dan FireFox</a></li>
</ol>
</div>
</code></pre>Maka hasilnya akan seperti ini :<br />
<div style="border: 1px solid #eee; height: 200px; overflow: auto; padding: 10px; width: 300px;"><ol><li><a href="http://kolom-tutorial.blogspot.com/2007/04/bikin-blog.html"> Panduan membuat blog</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/cara-setting-blog.html">Cara setting blog</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/memilih-template.html">Memilih template</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/mengatur-hurup-dan-warna.html">Mengatur huruf dan warna</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/cara-memposting-artikel.html">Cara memposting artikel</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-read-more-1.html">buat Read more pada template klasik</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-text-area.html">Cara membuat Text Area</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-menu-dropdown.html">Cara membuat menu dropDown</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/upload-gambar-dan-foto-profile.html">cara Upload foto</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-link-1.html">Cara membuat Link(1)</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-link-2.html">Cara membuat Link(2)</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-marquee.html">Cara membuat marquee (text berjalan)</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/membuat-refresh.html">Cara membuat efek Refresh</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/kode-html-tampil-di-posting.html">Kode HTML tampil pada postingan</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/masalah-posting-artikel.html">Masalah posting artikel</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/yahoo-messenger-emoticons.html">Simbol Yahoo! Emoticons</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/blogger-emoticons.html">Simbol Blogger Emoticons</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/pasang-jam-blog-di-sidebar.html">Cara Pasang jam </a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/membuat-banner-animasi.html">Cara membuat banner animasi</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/pasang-buku-tamu-di-sidebar.html">Cara membuat buku tamu</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/tutorial-html.html">HTML Tutorial</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/04/download-gratis.html">Free Download</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/membuat-foto-animasi.html">Foto animasi</a> </li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/pasang-statistik-tarcker.html">Cara pasang Statistik & Tracker</a></li>
<li><a href="http://kolom-tutorial.blogspot.com/2007/05/ie-firefox-dalam-satu-komputer.html">Perlunya IE dan FireFox</a></li>
</ol></div>Sedikit saya terangkan agar sedikit jelas.<br />
Didalam kode tersebut, yang berperan besar adalah kode yang ada dalam <b>style.</b> Dengan style itulah kita bisa membuat apa yang kita inginkan. Berikut adalah perintah-perintah yang di pakai :<br />
<b>overflow:auto;</b> <b>» </b>kode ini agar tercipta scrolling atau penggulung halaman apabila isi dari halaman tersebut sudah melampaui batas tinggi atau lebar yang telah di tentukan.<br />
<b>width:300px;</b> <b>»</b> adalah lebar bidang yang di inginkan, dalam hal ini adalah sebesar 300 pixel, nilai ini tentunya di sesuaikan dengan keinginan atau di sesuaikan dengan lebar sidebar yang ada. namun, agar selalu sesuai dengan sidebar maka sebaiknya memakai nilai 100% (width:100%).<br />
<b>height:200px;</b> <b>»</b> adalah tinggi bidang yang di inginkan, nilai ini bisa di ubah sesuai keinginan, misal jadi 250px atau nilai yang lainnya.<br />
<b>padding:10px;</b> <b>»</b> adalah kode pembuat jarak agar tulisan yang ada dalam halaman tersebut tidak menabrak dinding halaman, nilai ini tentu saja bisa di ubah sesuai keinginan. misal : padding:5px;<br />
<b>border:1px solid #eee</b> <b>»</b> agar bidang tersebut terlihat ada kotaknya, jika anda tidak menginginkan ada terlihat kotaknya, maka tinggal di hapus saja.<br />
Selain kode-kode tersebut, tentu saja anda bisa menambahkan berbagai variasi sesuai dengan keinginan, misalkan backgroundnya berbentuk gambar, fontnya yang berbeda atau apa saja sesuai dengan keinginan anda.<br />
Isi dari halaman tersebut tentu saja bukan hanya berisi link seperti yang kang Rohman contohkan, anda bisa mengisinya dengan yang anda inginkan. Misalkan tulisan biasa, gambar, iklan atau apa saja.<br />
Saya masih bingung di mana nyimpen kode di atasss? hiksss…. seperti biasanya, anda tinggal masuk ke halaman <b>dashbord</b> » <b>Rancangan</b> » <b>Elemen Halaman</b> » <b>Tambah Gadget</b> » Pilih untuk <b>JavaScript/HTML</b> » Masukan kodenya » <b>Simpan</b> » selesai.<br />
Selamat bereksperimen !<br />
<pre></pre>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0tag:blogger.com,1999:blog-2991581112131400583.post-17932147064003521592011-07-13T01:56:00.000-07:002011-07-19T12:39:36.279-07:00Membuat Blog di Blogspot<h2><a name='more'></a>1. Apa itu Blog ?</h2><div class="post-body entry-content" style="line-height: 1.6em; margin-bottom: 0.75em; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;"><b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Blog</b> merupakan sigkatan dari “Web log” adalah salah satu aplikasi web berupa tulisan-tulisan yang umum disebut sebagai posting pada halaman web. Tulisan-tulisan tersebut seringkali diurut dari yang terbaru dan diikuti oleh yang lama.</div><br />
<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;">Awalnya, blog dibuat adalah sebagai catatan pribadi yang disimpan secara online, namun kini isi dari sebuah blog sangat bervariatif ada yang berisi tutorial ( contoh blog ini ), curhat, bisnis dan lain sebagainya. Secara umum, blog tidak ada bedanya dengan situs yang ada di internet.</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;">Flatform blog atau seringkali disebut juga dengan mesin blog dibuat sedemikian rupa oleh para designer blog agar mudah untuk digunakan. Dulu, untuk membuat aplikasi web diperlukan pengetahuan tentang pemrograman HTML, PHP, CSS dan lain sebagainya, dengan blog semuanya menjadi mudah semudah menyebut angka 1 2 3.</div><h3>2. Cara membuat blog di blogspot</h3><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;">Salah satu<i style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"> penyedia blog gratis</i> yang cukup populer saat ini adalah <b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">blogspot</b> atau <b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">blogger, </b>dimana ketika mendaptar adalah melalui situs blogger.com namun nama domain yang akan anda dapatkan adalah sub domain dari blogspot, contoh : contohsaja.blogspot.com</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;">Kenapa harus membuat blog di blogger.com bukan pada situs penyedia blog lainnya? Sebenarnya tidak ada keharusan untuk <b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">membuat blog di blogger</b>, namun ada banyak kelebihan yang dimiliki blogger di banding dengan penyedia blog lain. Beberapa contoh kelebihan blogspot di banding yang lain yaitu mudah dalam pengoperasian sehingga cocok untuk pemula, lebih leluasa dalam mengganti serta mengedit template sehingga tampilan blog anda akan lebih fresh karena hasil kreasi sendiri, custom domain atau anda dapat mengubah nama blog anda dengan nama domain sendiri misalkan <span style="color: red; margin: 0px; padding: 0px;">contohsaja.blogspot.com</span> di ubah menjadi<span style="color: red; margin: 0px; padding: 0px;">contohsaja.com</span>,sedangkan hosting tetap menggunakan blogspot dan masih tetap gratis.</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;">Perlu ditekankan dari awal bahwa internet itu sifatnya sangat dinamis, sehingga mungkin saja dalam beberapa waktu kedepan panduan membuat blog di blogspot ini akan sedikit berbeda dengan apa yang anda lihat di blogger.com</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;">Untuk mengurangi hal yang tidak perlu di tulis, berikut cara membuat blogger di blogger.com</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;"><br />
</div><h2>Membuat Email</h2><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;">Salah satu syarat yang harus dipenuhi dalam membuat blog adalah anda memiliki alamat email yang masih aktif atau di gunakan. Jika anda belum mempunyai alamat email, silahkan daftar terlebih dahulu di gmail karena blogger adalah salah satu layanan dari Google maka ketika mendaftar ke blogger sebaiknya gunakan email<b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">gmail</b>. Jika anda belum paham bagaimana cara membuat email, silahkan gunakan mesin pencari google untuk mencari panduannya.</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;"><span class="Apple-style-span" style="color: #191919; font-family: Times; font-size: 21px; line-height: normal; text-transform: capitalize;">Daftar Blog Di Blogger</span></div><ol style="margin-bottom: 0px; margin-left: 5px; margin-right: 0px; margin-top: 0px; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><li style="margin-bottom: 0px; margin-left: 27px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Silahkan kunjungi situs http://www.blogger.com</li>
<li style="margin-bottom: 0px; margin-left: 27px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Setelah halaman pendaftaran terbuka, alihkan perhatian ke sebelah kanan atas, ubah bahasa ke Indonesia agar lebih mudah difahami. Silahkan langsung login dengan menggunakan <b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">username </b>serta<b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">password gmail</b> anda ( akun email anda bisa untuk login ke blogger).<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;"><img alt="login blogger" border="0" height="120" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkR-OEVGzIQVgBe_9vaRVcI7N1QR_K2OuAEa7XKkw-7knQQgN25flh67FTR-aEDPErYN2fmVUBSrfXNGhUxreBjyqnbJ-VhsTXHUqVsobgiIpi1pyHy9HtCuWmdemrX9gtBol2QzAYADU/" style="border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="login blogger" width="266" /></div></li>
<li style="margin-bottom: 0px; margin-left: 27px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Klik tombol bertuliskan CIPTAKAN BLOG ANDA.<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;"><img alt="ciptakan blog anda" border="0" height="95" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimhQn8W2BRtN4ubSsz-0hB8a9OvkgYfeLGRgq06QpHsyNZJO6c2JHVebLmf5VrUEexImTf-A-RqZxMpHXadGd-EjVVNcBcvjy_wZwCztU0meJgbUkBckltss39J1i6z_nUKBGYCv6O_Gs/" style="border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="ciptakan blog anda" width="213" /></div></li>
<li style="margin-bottom: 0px; margin-left: 27px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Isilah nama judul blog serta alamat blog yang di inginkan. Ingat! dalam membuat alamat blog harus benar-benar serius karena itu permanen tidak dapat digantikan lagi (kecuali nanti ganti dengan custom domain). Jika alamat yang diinginkan ternyata tidak bisa digunakan, masukkan kembali alamat lain yang masih tersedia. Jika alamat blog yang diinginkan masih tersedia, silahkan klik anak panah bertuliskan<b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">LANJUTKAN</b>.<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;"><img alt="nama-blog" border="0" height="249" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixBQAZG-K5v98GEI2doy9aQGV2ZtzYd4RByhPdqAcqt_i4FCGbadzxII-1NUwuwCbGjUMvT67MaQ_vQkvciXJzhY06UJzgRIwrFpcaGmsxSEFvtsvukxgRC3TLvt9e00GZqRwzv2ZpDhU/" style="border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="nama-blog" width="400" /></div></li>
<li style="margin-bottom: 0px; margin-left: 27px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Silahkan pilih template yang anda sukai ( template ini nanti bisa diubah lagi kapan saja anda mau), kemudian klik <b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">LANJUTKAN</b>.<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;"><img alt="pilih template di blogger" border="0" height="322" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOslrktl3bZk2fUUxJdwhkXVIypZek2stxF_q5jYSly8C5DvY9k-IK0oBa46M9Kz6IHeMfRJKAwD9YRW4HsHlH0qiU61fHnz7ixdLiNUqWKh2RuG4qUQjNxEDYfCThDTrvnwTTWU134Xo/" style="border-bottom-width: 0px; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; display: inline; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="pilih template di blogger" width="400" /></div></li>
<li style="margin-bottom: 0px; margin-left: 27px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Akan ada tulisan “<b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Blog Anda Sudah Jadi!</b>”. Silahkan lanjutkan dengan klik tombol <b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">MULAI BLOGGING</b>.<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;"><img alt="mulai blogging" height="160" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEif8tMW6znAaGIYPuyN2eRzRQYmLx-Fg_JJDb3c2kd7Zj06tpfPjQB19GefmXfWZ7hZmboiuroK8ZNXPlA5PJ9ixxB7Vw3Hz4V92m6KXV01TIJbvCa5FF3iOdWxSJs6_z0Kv6PtI8Qs8Yo/" style="display: inline; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="mulai blogging" width="400" /></div></li>
<li style="margin-bottom: 0px; margin-left: 27px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Setelah masuk <b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">post editor</b>, silahkan isi apa saja ( disarankan untuk langsung mengisi posting, biasanya jika tidak langsung posting akan terjaring robot anti spam milik blogger, dan blog anda akan di lock). Contoh : hello world. Klik Tombol <b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">PRATINJAU</b> untuk melihat tampilan yang nanti akan muncul di blog, klik tombol <b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">TERBITKAN ENTRI</b> jika posting anda mau dipublikasikan ke publik.<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 10px;"><img alt="terbitkan entri" border="0" height="284" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikbbUGlj0AZF81N-0yduCGiLDdrmL2rE3B4E8eqzP5zbRZ6iqO9Zvm-8nICsHFq9jONhHnhcyCjv1jUEcOoGj1I4haO_MFVjkpfoBynt6IJ8QbWKPac1Xtxbb0R4AlJWq4NfEkImtUWL8/" style="border-bottom-style: none; border-bottom-width: 0px; border-color: initial; border-left-style: none; border-left-width: 0px; border-right-style: none; border-right-width: 0px; border-top-style: none; border-top-width: 0px; display: inline; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" title="terbitkan entri" width="400" /></div></li>
<li style="margin-bottom: 0px; margin-left: 27px; margin-right: 0px; margin-top: 0px; padding-bottom: 5px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Selesai.</li>
</ol></div><div class="post-body entry-content" style="line-height: 1.6em; margin-bottom: 0.75em; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Untuk tahap awal, blog anda sudah jadi dan bisa diakses dimana saja. Untuk pembahasan lebih dalam tentang bagaimana blogging dengan <b style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">blogger</b>, akan di bahas pada posting berikutnya.</div>belajarhttp://www.blogger.com/profile/16474114009218999745noreply@blogger.com0