Cara Mudah Membuat Tombol Button Link pada Postingan Blog

Cara Membuat Tombol / Button Link Pada Postingan Blog - Dalam sebuah postingan / artikel yang kita tulis lalu publish di blog, terkadang kita mengambil referensi dari blog atau situs lain, misalnya saja dari Wikipedia, ini bertujuan untuk memperkuat argumen atau memperjelas maksud dan tujuan dari artikel yang kita tulis.

Link tersebut biasanya ditautkan kedalam sebuah gambar ataupun kalimat / kata tertentu, ketika diklik oleh pengunjung maka pengunjung akan dialihkan ke alamat URL tersebut. Nah agar pengunjung tidak bingung ketika akan mengklik tautan yang seharusnya diklik, kita bisa memanfaatkan button (tombol) yang ditautkan dengan alamat URL yang dimaksud (link).
Button link ini bisa juga digunakan sebagai tombol download pada blog apabila kamu memiliki blog dengan niche atau tema download film, download mp3, download template dan lain-lain.

Tutorial cara membuat button link pada blog

Button link yang akan saya share ini cukup sederhana karena kamu hanya perlu mengetikkan kode HTML dan sedikit CSS ketika menulis artikel di blogspot, jadi kode HTML dan CSS ini tidak perlu dimasukkan kedalam template.

Untuk membuat button link caranya kamu harus login ke dasbor Blogger ~> lalu klik menu Postingan ~> kemudian klik Entri Baru untuk membuat postingan baru, untuk membuat button link pada postingan blog, kamu harus beralih dari mode Compose ke mode HTML.

Untuk membuat tombol (button) tanpa link caranya sangat simple, berikut kode HTML yang digunakan.

<button>Button Tanpa Link</button>

Hasilnya akan terlihat seperti ini.

Button Tanpa Link

2. Button dengan link

Kode HTML yang digunakan untuk membuat button dengan link.

<a href="https://tips-edit-blog.blogspot.com/"><button>Button Dengan Link</button></a>

Berikut hasilnya, silahkan klik untuk demo.

Button Dengan Link

3. Button dengan link dan new tab

Maksudnya adalah ketika pengunjung mengklik tombol ini, maka secara otomatis link yang dituju akan terbuka di tab baru.

Kode HTML yang digunakan.

<a href="https://tips-edit-blog.blogspot.com/" target="_blank"><button>Button Dengan Link & New Tab</button></a>

Hasilnya masih sama seperti pada nomor 2, namun bedanya tautan / link yang dituju akan otomatis terbuka di tab baru.

Button Dengan Link & New Tab

4. Button link dengan background berwarna

Untuk membuat button link dengan background yang berwarna, berikut kode HTML yang digunakan.

<button onclick="window.location=
'https://tips-edit-blog.blogspot.com/' "style="background-color: #7ae6c9; color: white; height: 35px; width: 200px;">
<b>Button Link Berwarna</b>
</button>  

Berikut hasilnya.

Button Link Berwarna

Mudah bukan? Begitulah langkah-langkah cara membuat button / tombol pada postingan blogspot, menurut saya penggunaan button link ini sangat penting sekali agar artikel yang kita tulis lebih user friendly.

Selamat mencoba dan semoga bermanfaat.