Cara Membuat Link Button di Blog

Postingan kali ini saya akan menjelaskan tentang Cara Membuat Link Button di Blog, dengan cara ini maka tampilan Link terlihat lebih menarik dibandingkan dengan hanya tulisan saja. Sehingga postingan kita terlihat rapi ketika kita meletakkan sebuah Link Untuk membuat tombol di Blogger, kita memerlukan tag <button> dan </button> untuk diapit di teks yang akan diberi tombol.tapi sebelum kita menyisipkan kode tersebut postingan kita harus dalam mode HTML ketika kita menyisipkan kode tersebut setelah itu kita boleh kembali ke mode Compose

Contoh:

<button>Klik disini</button>

Maka hasilnya seperti ini :

 

 Bila kita ingin memberi warna biru pada background tombol dan memberi warna putih pada hurufnya agar lebih menarik, maka kita tinggal menambahkan atribut background-color dan color pada tag <button> serta <b> dan </b> pada teks.

Misalnya:

<button style="background-color: blue; color: white;"><b>Klik Disini</b></button>

Maka Hasilnya seperti ini:

 alau ingin menentukan ukuran tombol, tinggal menambahkan atribut width untuk lebar dan height untuk tinggi tombol.

Contoh:

<button style="background-color: blue; color: white; height: 30px; width: 200px;"><b>Klik disini</b></button>

Maka hasilnya seperti ini:

 

Sekarang kita akan memberi link pada tombol tersebut sehingga bila diklik akan tertuju pada link laman yang dimaksud. Untuk menyisipkan link, kita perlu menambah atribut onClick="window.location='URL'".

Contoh:

<button onclick="window.location='http://devilmig.blogspot.com/2012/03/manfaat-buah-buahan-bagi-kesehatan.html'" style="background-color: blue; color: white; height: 30px; width: 200px;"><b>Kilk Disini</b></button>

Maka hasilnya seperti ini :

Atau contoh :

 <a href="http://devilmig.blogspot.com/2012/03/manfaat-buah-buahan-bagi-kesehatan.html"><button>4 Manfaat Buah</button></a>

Atau jika Link nya ingin terbuka di tab baru maka tinggal di tambahkan kode HTML target="blank"> seperti contoh di bawah ini :

<a href="http://devilmig.blogspot.com/2012/03/manfaat-buah-buahan-bagi-kesehatan.html" target="blank"><button>Manfaat Buah</button></a>

Maka Hasilnya akan seperti di bawah ini :

dan ini:

Selamat Mencoba