Assalamu'alaikum, kawan bagaimana kabarnya, baik? Kawan pada tutorial kali ini saya akan share sebuah trik simpel cara membuat tombol button pada postingan yang akan kita buat, biasanya tombol button ini digunakan untuk membuat sebuah tombol yang pada tombol tersebut disisipi link yang menuju pada halaman lain, seperti contohnya link download, supaya link download ini lebih menarik maka dibuatlah tombol pada link tersebut, supaya lebih jelas apa yang dimaksud tombol button ini, mari kita baca tutorial cara membuat tombol button pada posting, selamat membaca.
Contoh tombol button >>
Sekarang kita cari tahu resep cara pembuatan tombol button ini, lihat kode dibawah ini.
<button>Download</button>
Ternyata mudah sekali cara membuatnya, bila kita sudah tahu cara pembuatan tombol button ini, sekarang bagaimana kita buat menjadi lebih menarik lagi, seperti memberi warna, serta ukuran tombol ini, baik lebar dan tingginya.
Memberi Warna
Untuk memberi warna pada tombol button ini kita membutuhkan kode warna untuk backround dan warna untuk text, dan juga kita sisipi kode diantara text dengan kode <b>text</b> seperti dibawah ini.
<button style="background-color: #000000; color: #ffffff;"><b>Download</b></button>
Contoh :
Mengatur Lebar dan Tinggi
Untuk menggatur lebar dan tinggi tombol ini maka kita membutuhkan kode "width" dan "height", untuk lebih jelasnya lihat kode dibawah ini.
<button style="background-color: #000000; color: #ffffff; width: 150px; heigth: 25px;"><b>Download</b></button>
Contoh :
Menyisipkan Link
Bila sudah kita setting mulai dari warna dan juga ukuran, sekarang waktunya tombol button ini kita sisipi dengan link, dan butuh kode onClick="window.location='URL'", untuk lebih jelas lihat kode dibawah ini.
<button onClick="window.location=' http://blogmuhammad23.blogspot.com/2012/02/cara-membuat-tombol-button-pada-posting.html '" style="background-color: #000000; color: #ffffff; width: 150px; heigth: 25px;"><b>Download</b></button>
Contoh :
* * *
Selesai sudah trik cara membuat tombol button pada posting, semoga tutorial ini bermanfaat untuk kamu.
Contoh tombol button >>
Sekarang kita cari tahu resep cara pembuatan tombol button ini, lihat kode dibawah ini.
<button>Download</button>
Ternyata mudah sekali cara membuatnya, bila kita sudah tahu cara pembuatan tombol button ini, sekarang bagaimana kita buat menjadi lebih menarik lagi, seperti memberi warna, serta ukuran tombol ini, baik lebar dan tingginya.
Memberi Warna
Untuk memberi warna pada tombol button ini kita membutuhkan kode warna untuk backround dan warna untuk text, dan juga kita sisipi kode diantara text dengan kode <b>text</b> seperti dibawah ini.
<button style="background-color: #000000; color: #ffffff;"><b>Download</b></button>
Contoh :
Mengatur Lebar dan Tinggi
Untuk menggatur lebar dan tinggi tombol ini maka kita membutuhkan kode "width" dan "height", untuk lebih jelasnya lihat kode dibawah ini.
<button style="background-color: #000000; color: #ffffff; width: 150px; heigth: 25px;"><b>Download</b></button>
Contoh :
Menyisipkan Link
Bila sudah kita setting mulai dari warna dan juga ukuran, sekarang waktunya tombol button ini kita sisipi dengan link, dan butuh kode onClick="window.location='URL'", untuk lebih jelas lihat kode dibawah ini.
<button onClick="window.location=' http://blogmuhammad23.blogspot.com/2012/02/cara-membuat-tombol-button-pada-posting.html '" style="background-color: #000000; color: #ffffff; width: 150px; heigth: 25px;"><b>Download</b></button>
Contoh :
* * *
Selesai sudah trik cara membuat tombol button pada posting, semoga tutorial ini bermanfaat untuk kamu.
Thanks, sobat,, artikelnya juga tipsnya sangat berguna..
BalasHapus@Desain kaos
BalasHapusIa sama-sama, dan terima kasih sudah berkunjung.
makasih broo, artikelnya sangat bermanfaat terutama bagi saya yang baru belajar ini
BalasHapus@Yusuf Arseka: Alhamdulillah, terima kasih kunjungannya :)
BalasHapusmakasih atas infonya. salam kenal dan smg sukses selalu
BalasHapus@Hattani: Yo sama-sama, terima kasih ya sudah berkunjung :)
BalasHapusmantap gan, terima kasih atas infonya
BalasHapus@simplyfresh laundry: Yo sama-sama, terima kasih ya kunjungannya :)
BalasHapuskalo mau open new tab gimana gan.?
BalasHapusBaca sini gan:
Hapushttp://blogmuhammad23.blogspot.com/2011/11/cara-membuat-link-new-tab.html
om mau nanya kode nya di taruh di mana? di postingan atau di mana?
BalasHapusDiposting, pada halaman HTML.
Hapus