Mungkin sebagian dari Anda para pengunjung atau rekan Blogger, tahu yang dimaksud dengan "Button" ?
Sebuah visualisasi tombol yang muncul dalam layar monitor Anda, dan apabila di klik, maka akan terjadi proses yang sudah kita rumuskan berbentuk kode HTML dan dia akan melakukan sesuatu seperti yang kita perintahkan.
Dan kali ini, Saya akan memberikan informasi mengenai Cara Membuat Button dalam Blog atau Website kita.
Sebuah visualisasi tombol yang muncul dalam layar monitor Anda, dan apabila di klik, maka akan terjadi proses yang sudah kita rumuskan berbentuk kode HTML dan dia akan melakukan sesuatu seperti yang kita perintahkan.
Dan kali ini, Saya akan memberikan informasi mengenai Cara Membuat Button dalam Blog atau Website kita.
Untuk kode HTML yang Saya maksudkan tadi, tulislah kode ini :
<button type="button">Ketik teks Anda di sini</button>
Maka, hasilnya akan seperti dibawah ini :
Ada beberapa kode lainnya juga agar Button yang kita buat bisa lebih menarik, seperti contoh dibawah ini :
dan untuk menghasilkan tombol button seperti diatas, Anda bisa membuat kode HTML seperti dibawah ini :
<button type="button" style="background:#000000; color:#FFFFFF; font:bold 20px Verdana, Geneva, sans-serif; margin:5px 0 5px 0; padding: 0 10px 0 10px;">Klik Disini !</button>
Keterangan :
- background : warna latar button.
- color : warna tulisan/text.
- padding : Jarak tepi button dengan teks di dalamnya, 0 10px 0 10px artinya padding atas bernilai atau = 0; kanan = 10px; bawah = 0; kiri = 10px.
- margin : jarak button dengan tepi bidang gambar ke luar, 5px 0 5px 0 artinya margin atas = 5px; kanan = 0; bawah = 5px; kiri = 0.
- font : huruf teks.
Mungkin Anda memerlukan lebih dari satu button untuk mengisi blog Anda, dan apabila isi dari button yang ingin ditambahkan, sama dengan button yang sudah ada, tentunya Anda akan berulangkali menuliskan kode yang sama. Dan tentunya dengan penulisan Kode HTML yang berulang-ulang, itu menyebabkan pekerjaan kita jadi kurang efisien bukan ?
Oleh sebab itu, kita harus mengatur kode html tersebut bisa mencakup keseluruhan button yang akan dibuat dengan menggunakan CSS, dimana kumpulan elemen dari HTML, dijadikan dalam bentuk CSS seperti kode dibawah ini :
#buttonku {
background:#000000;
color:#FFFFFF;
font:bold 20px Verdana, Geneva, sans-serif;
margin:5px 0 5px 0;
padding: 0 10px 0 10px; }
color:#FFFFFF;
font:bold 20px Verdana, Geneva, sans-serif;
margin:5px 0 5px 0;
padding: 0 10px 0 10px; }
Dan kode CSS biasanya berada diantara kode :
<b:skin><![CDATA[ ... ]]></b:skin>
<button id="buttonku" type="button">Tekan Disini !</button>
<button id="buttonku" type="button">Klik Disini !</button>
<button id="buttonku" type="button">Klik Sekali lagi !</button>
Hasilnya akan nampak seperti dibawah ini :
Bila Anda ingin menyisipkan sebuah link dalam button tersebut, maka tuliskanlah Kode HTML link seperti dibawah ini :
<a href="...alamat yang dituju..." target="blank"><button type="button">Tulis teks kamu di sini</button></a>
Keterangan :
target="blank" dapat diartikan, link akan diarahkan ke tab baru.
Contoh button yang menggunakan link :
<a href="http://www.tentang-komputer-internet.co.cc/"><button type="button">Tentang Komputer Internet</button></a>
<a href="http://dreamlandhost.com/" target="blank"><button type="button">Hosting Murah Berkualitas</button></a>
<a href="http://dreamlandhost.com/" target="blank"><button type="button">Hosting Murah Berkualitas</button></a>
Hasilnya :
Oke, sampai disini pembahasan mengenai cara membuat button dalam blogspot kita, semoga bermanfaat, dan trik ini sebenarnya dapat Anda kembangkan lebih jauh, sehingga tampilannya sesuai dengan yang Anda inginkan.
Selamat mencoba dan,
Terimakasih.
thnks infonya sob..bermanfaat banget bagi saya khususnya..keep posting sob..sukses selalu yah happy blogging sob..kalau berkenan kita tukeran link sob yah..kalau mau komment di blogku yah sob..thnks sebelumnya sob
ReplyDeleteinfo yang berguna sekali friend saya boleh coba ya bikin di blog saya.
ReplyDeleteSekedar Berbagi Info buat temen2...
ReplyDeleteWah andai website saya bisa punya 1000 pengunjung tiap hari……hehehe
Tapi Ndak usah khawatir jangankan 1000 Pengunjung, 5000 Pengunjung/hari juga bisa...hehehe
Nih saya punya Trik Mujarabnya, Monggo di Baca di sini :
http://www.kangociem.com/2010/08/trik-gila-5000-pengunjunghari-dan.html
Semoga Bermanfaat khususnya untuk Blogger Indonesia, Tetap semangat menjadi Blogger Indonesia jangan menyerah karena Blog tidak ada Pengunjungnya..Hehehe
Terimaksih, Happy Blogwalking....
tips menarik. kalo untuk button yang glossy harus pakai hosting. gimana caranya tuh yah lewat blogspot.
ReplyDeleteIndonesia, Tetap semangat menjadi Blogger Indonesia jangan menyerah karena Blog tidak ada Pengunjungnya..
ReplyDeleteMantab........Gan
ReplyDeletekeren-keren ni buttonya
ReplyDeletemakasih ...
ReplyDeletekeren , ini yg sangat saya butuhin tuk mempercantik blogku. :)
mohon sarannya .
numpang lewat izin nyimak,di bookmark dulu site nya...
ReplyDelete