Cara Menciptakan Tombol Button Link Pada Postingan Blog

Sudah usang sekali aku tidak menulis artikel / tutorial yang membahas mengenai blogging, khususnya platform blogging yang cukup fenomenal yaitu Blogspot. Maklum saja, alasannya yaitu tema utama pembahasan di blog ini bukan kesitu.

Tema utama pembahasan di blog ini yaitu GNU/Linux dan Tutorial Networking khususnya mikrotik, namun sesekali aku akan membahas tutorial mengenai blogging, tujuannya yaitu sebagai dokumentasi apa yang telah aku pelajari, biar nantinya ketika aku membutuhkannya tinggal mencarinya saja di blog aku ini.

Ini alasannya yaitu hingga dikala ini aku masih setia dengan Blogspot sebagai platform yang aku gunakan untuk aktivitas blogging, selain untuk dokumentasi pribadi ya semoga saja bermanfaat juga untuk para blogger yang lain.

Yang akan aku bahas pada kesempatan kali ini yaitu bagaimana cara menciptakan tombol button link pada postingan blog yang kita publish.

Dalam sebuah postingan / artikel yang kita tulis kemudian publish di blog, terkadang kita mengambil tumpuan dari blog / situs lain, contohnya saja 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 biar pengunjung tidak resah ketika akan mengklik tautan yang seharusnya diklik, kita dapat memanfaatkan button (tombol) yang ditautkan dengan alamat URL yang dimaksud.

Credit : www.smashingmagazine.com

Button link ini dapat juga dipakai sebagai tombol download pada blog apabila sahabat mempunyai blog dengan niche download film, download mp3, download template dan lain-lain.

Tutorial cara menciptakan button link pada blog

Button link yang akan aku share ini cukup sederhana alasannya yaitu sahabat hanya perlu mengetikkan arahan HTML dan CSS tertentu pribadi ketika menulis artikel di blogspot, jadi arahan HTML dan CSS ini tidak perlu dimasukkan kedalam template.

Untuk menciptakan button link caranya sahabat login ke dasbor Blogger > kemudian klik hidangan Postingan > kemudian klik Entri Baru untuk menciptakan postingan baru, untuk menciptakan button sahabat harus beralih dari mode Compose ke mode HTML.

1. Button tanpa link

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

<button>Button Tanpa Link</button>

Hasilnya akan terlihat menyerupai ini.

2. Button dengan link

Kode HTML yang dipakai untuk menciptakan button dengan link.

<a href=""><button>Button Dengan Link</button></a>

Berikut hasilnya, silahkan klik untuk demo.

3. Button dengan link dan new tab

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

Kode HTML yang digunakan.

<a href="" target="_blank"><button>Button Dengan Link & New Tab</button></a>

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



4. Button link dengan background berwarna

Untuk menciptakan button link dengan background yang berwarna, berikut arahan HTML yang digunakan.

<button onclick="window.location=
''" style="background-color: #444444; color: white; height: 35px; width: 150px;">
<b>
Button Link Warna</b>
</button>

Berikut hasilnya.




Praktis bukan ? silahkan mencoba dan semoga bermanfaat.


Sumber referensi :
https://scrapdesignsbydonna.blogspot.com//search?q=membuat-tombol-button-link-pada

Share this post