Mau Jadi Ahli SEO | Mau Tahu Cara Mengoptimasi Website Anda | Mau Toko Online Anda Banjir Pengunjung | Mau Meningkatkan Skil SEO Anda | Klik Banner di Bawah ini dan BUKTIKAN!

18.2.12

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

Pin It

12 Komentar:

  1. Thanks, sobat,, artikelnya juga tipsnya sangat berguna..

    BalasHapus
  2. @Desain kaos

    Ia sama-sama, dan terima kasih sudah berkunjung.

    BalasHapus
  3. makasih broo, artikelnya sangat bermanfaat terutama bagi saya yang baru belajar ini

    BalasHapus
  4. @Yusuf Arseka: Alhamdulillah, terima kasih kunjungannya :)

    BalasHapus
  5. makasih atas infonya. salam kenal dan smg sukses selalu

    BalasHapus
  6. @Hattani: Yo sama-sama, terima kasih ya sudah berkunjung :)

    BalasHapus
  7. mantap gan, terima kasih atas infonya

    BalasHapus
  8. @simplyfresh laundry: Yo sama-sama, terima kasih ya kunjungannya :)

    BalasHapus
  9. Balasan
    1. Baca sini gan:

      http://blogmuhammad23.blogspot.com/2011/11/cara-membuat-link-new-tab.html

      Hapus
  10. om mau nanya kode nya di taruh di mana? di postingan atau di mana?

    BalasHapus

Bila kamu ada pertanyaan silahkan kirim komentar, dan sebelumnya saya mohon maaf bila terlambat membalas karena banyak kesibukan yang lain :)