Membuat favicon

 Buka http://tools.dynamicdrive.com/favicon/
atau klik
Klik Browser untuk memasukan gambar yang diinginkan (Maksimum ukuran gambar 150 kB)
Berilah tanda ceklist untuk ukuran gambar icon
Kemudian Klik Create Icon
Lihat hasil dibawahnya ….. (Sebagai Contoh)

Kemudian Klik download untuk menyimpan hasilnya di komputer ….




selamt mencoba yaaaaaaaaaaaaaaaaaaaaaaaaaa?


Sumber : http://illtorro.blogspot.com

Membuat text area

Pengertian Text Area

Text area merupakan tempat text atau tulisan untuk memudahkan dalam tuker link, menaruh text yang berisi kode-kode HTML agar bisa di copy oleh para pengunjung.

Untuk membuat text area, Copy kode di bawah ini :

<textarea name="code" rows="6" cols="10" style="border-style: solid; border-color: rgb(100, 100, 117); border-width: 3px 3px 5px 20px; padding: 5px; background: rgb(101, 99, 195) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: rgb(202, 61, 217); line-height: 1.5em; -moz-border-radius-topleft: 7px; -moz-border-radius-topright: 7px; -moz-border-radius-bottomright: 7px; -moz-border-radius-bottomleft: 7px;">$ TULISAN ANDA $</textarea> 

Contohnya seperti ini


<font size="16px"><font size="2"><font size="16px"> </font>Bagus tidak</font> </font>




Selamat mencoba ya dan bermanfaat ..............................!


Sumber : http://illtorro.blogspot.com

Membuat Text Area dengan Tombol Pilih Semua

Text area merupakan salah satu hal penting untuk meperingkas sebuah posting dalam blog, apalagi text kode yang begitu panjang apabila tidak dimuat dalam text area maka akan memanjang kebawah, dan pastinya membuat susah pengunjung blog untuk mecopy text tersebut.

 Lah kali ini saya ingin mencoba memaparkannya bagaimna membuat text area dengan tombol pilih semua Tips ini saya dapat dari illtorro.blogspot.com. Kronologinya, pada saat lagi jalan-jalan di blog para master yang sudah ber PR tinggi saya melihat text area yang saya anggap keren, saya cari-cari akhirbya ketemu juga nih kode HTML untuk membuat text area dengan tombol pilih semua / Select all,

 Bagi sobat yang berminat bisa mencobanya pada blognya sendiri oke

 <code><span ><div><form name="copy"><div align="center"><input value="Pilih Semua&quot; onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button"> </div><div align="center"></div><p align="center"><textarea rows="3" cols="20" style="border: 8px inset rgb(104, 104, 204); padding: 0pt 1px; background: rgb(100, 100, 200) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: rgb(255, 255, 255); line-height: 1.5em; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px;" name="txt" wrap="VIRTUAL"> Masukan text / kode sobat di sini </textarea></form></div></span></code>
 Keterangan:
Text warna hijau: bisa sobat ganti dengan select all / block all / tandai semua dan lain-lain sesuai selera sobat.
 Text warna kuning: adalah ketinggian text area tersebut, silakan sobat sesuaikan sendiri.
Text warna putih: adalah panjang kolom text area tersebut, silakan sobat sesuaikan sendiri.
text warna merah: merupakan tempat untuk kode yang inggin sobat taruh di dalam text area tersebut.

Seperti ini contohnya <

Masukan text / kode sobat di sini

moga bermanfaaaaaaaaaaaaaaaat ya dan selamta mencoba.............!

Membuat Tombol Show dan Hide di Blog

Berikut ini saya akan belajar tentang gimana membuat tombol show agar menampilkan tulisan seperti ini

Klik show untuk melihat

Masukkan tulisanmu di sini

sekian lama saya mencari tutoriallnya di internet ketemu juga akhirnya caranya gini ikuti saya ya gampang kok Teman-teman hanya perlu mengcopy paste kode HTML di bawah ini:

 <div><div style="margin-bottom: 2px;"><b><small>Klik show untuk melihat</small></b> <input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"></div> <div style="border: 1px inset; margin: 0px; padding: 6px;"><div style="display: none;"> Masukkan tulisanmu di sini </div></div></div>

Entri melalui HTML Jangan melalui Compose seperti tanda panah pada gambar di bawah:






 Lalu paste code di atas dan jangan lupa mengganti kata yang digaris tengah yang berwarna merah dengan kata atau kode yang ingin teman-teman masukkan. Teman-teman juga bisa mengganti kata yang berwarna biru dengan kata yang diinginkan. 
Masukkan kode di atas ke dalam postingan atau di sidebar blog teman-teman, maka hasilnya bisa dilihat di atas dana .

Membuat Menu Horizontal Yang Keren

Menu Horizontal Drop down yang sperti ini

Klik show untuk melihat

• Home
• Categories
  • CSS
  • Graphic design
  • Development tools
  • Web design
• Work
• About
• Contact

Menu Navigasi Horizontal adalah menu yang ditampilkan secara mendatar. Biasanya Menu Navigasi Horizontal diletakkan di atas atau di bawah header blog. Akan tetapi, tidak sedikit juga blog yang memasang Menu Navigasi Horizontal di atas footer. Horizontal Navigation yang Rinjani Lovers share malam ini adalah Menu Navigasi yang sangat bagus. Menu Navigasi ini sangat mudah untuk diterapkan atau di pasang di blog karena sobat blogger tidak perlu melakukan Edit template. Menu Horizontal ini merupakan Menu Horizontal Drop Down tanpa gambar dan scripts. Cara buat Menu Navigasi Horizontal : Silahkan Sobat blogger log in terlebih dahulu di blog sobat Klik Design dan klik Add a gadget. Copy kode yang ada di bawah ini dan paste pada kolom yang tersedia :

Klik show untuk melihat

<style> /*------ CSS3 Drop Down Menu By RL (rinjanilovers.blogspot.com)---------*/ #rl-menu, #rl-menu ul { margin: 0; padding: 0; list-style: none; } #rl-menu { width: 960px; margin: 60px auto; border: 1px solid #222; background-color: #111; background-image: -moz-linear-gradient(#444, #111); background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111)); background-image: -webkit-linear-gradient(#444, #111); background-image: -o-linear-gradient(#444, #111); background-image: -ms-linear-gradient(#444, #111); background-image: linear-gradient(#444, #111); -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 0 1px 1px #777; -webkit-box-shadow: 0 1px 1px #777; box-shadow: 0 1px 1px #777; } #rl-menu:before, #rl-menu:after { content: ""; display: table; } #rl-menu:after { clear: both; } #rl-menu { zoom:1; } #rl-menu li { float: left; border-right: 1px solid #222; -moz-box-shadow: 1px 0 0 #444; -webkit-box-shadow: 1px 0 0 #444; box-shadow: 1px 0 0 #444; position: relative; } #rl-menu a { float: left; padding: 12px 30px; color: #999; text-transform: uppercase; font: bold 12px Arial, Helvetica; text-decoration: none; text-shadow: 0 1px 0 #000; } #rl-menu li:hover > a { color: #fafafa; } *html #rl-menu li a:hover { /* IE6 only */ color: #fafafa; } #rl-menu ul { margin: 20px 0 0 0; _margin: 0; /*IE6 only*/ opacity: 0; visibility: hidden; position: absolute; top: 38px; left: 0; z-index: 9999; background: #444; background: -moz-linear-gradient(#444, #111); background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444)); background: -webkit-linear-gradient(#444, #111); background: -o-linear-gradient(#444, #111); background: -ms-linear-gradient(#444, #111); background: linear-gradient(#444, #111); -moz-box-shadow: 0 -1px rgba(255,255,255,.3); -webkit-box-shadow: 0 -1px 0 rgba(255,255,255,.3); box-shadow: 0 -1px 0 rgba(255,255,255,.3); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } #rl-menu li:hover > ul { opacity: 1; visibility: visible; margin: 0; } #rl-menu ul ul { top: 0; left: 150px; margin: 0 0 0 20px; _margin: 0; /*IE6 only*/ -moz-box-shadow: -1px 0 0 rgba(255,255,255,.3); -webkit-box-shadow: -1px 0 0 rgba(255,255,255,.3); box-shadow: -1px 0 0 rgba(255,255,255,.3); } #rl-menu ul li { float: none; display: block; border: 0; _line-height: 0; /*IE6 only*/ -moz-box-shadow: 0 1px 0 #111, 0 2px 0 #666; -webkit-box-shadow: 0 1px 0 #111, 0 2px 0 #666; box-shadow: 0 1px 0 #111, 0 2px 0 #666; } #rl-menu ul li:last-child { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #rl-menu ul a { padding: 10px; width: 130px; _height: 10px; /*IE6 only*/ display: block; white-space: nowrap; float: none; text-transform: none; } #rl-menu ul a:hover { background-color: #0186ba; background-image: -moz-linear-gradient(#04acec, #0186ba); background-image: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba)); background-image: -webkit-linear-gradient(#04acec, #0186ba); background-image: -o-linear-gradient(#04acec, #0186ba); background-image: -ms-linear-gradient(#04acec, #0186ba); background-image: linear-gradient(#04acec, #0186ba); } #rl-menu ul li:first-child > a { -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } #rl-menu ul li:first-child > a:after { content: ''; position: absolute; left: 40px; top: -6px; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #444; } #rl-menu ul ul li:first-child a:after { left: -6px; top: 50%; margin-top: -6px; border-left: 0; border-bottom: 6px solid transparent; border-top: 6px solid transparent; border-right: 6px solid #3b3b3b; } #rl-menu ul li:first-child a:hover:after { border-bottom-color: #04acec; } #rl-menu ul ul li:first-child a:hover:after { border-right-color: #0299d3; border-bottom-color: transparent; } #rl-menu ul li:last-child > a { -moz-border-radius: 0 0 3px 3px; -webkit-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; } </style> <ul id="rl-menu"> <li><a href="#">Home</a></li> <li> <a href="#">Categories</a> <ul> <li><a href="#">CSS</a></li> <li><a href="#">Graphic design</a></li> <li><a href="#">Development tools</a></li> <li><a href="#">Web design</a></li> </ul> </li> <li><a href="#">Work</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul>

LALU KLIK SAVE Tambahan : Jangan lupa mengganti tanda # dengan Link blog sobat Mudahkan....................................?