Cara Membuat Tombol Demo dan Download Keren dan Responsive di Blog

Halo sobat Blogger, bagaimana kabarnya ? Semoga baik - baik saja ya. Pada kesempatan kali ini, Admin akan membahas mengenai cara untuk membuat tombol demo dan download di Blogger.

Bagi kamu yang sering mengupload postingan atau membuat artikel tentang download template, terutama template Blogger, mungkin sudah tidak asing lagi dengan tombol Demo dan Download.

Memang dalam membuat tombol Demo dan Download sendiri ada berbagai macam cara.

Cara yang paling mudah seperti ini :

<a href="LINK DEMO">Demo</a>

 Namun jika seperti itu, maka hasilnya hanya akan seperti ini :

Demo

Nah, tentu kurang bagus jika dari segi tampilan bukan ? Jadi pada kesempatan kali ini Admin akan membagikan cara membuat tombol Demo dan Download yang keren. Serta tentunya sudah responsive.

Cara Membuat Tombol Demo dan Download Keren dan Responsive di Blog

Untuk cara pembuatannya, ikuti langkah - langkah dibawah ini :

1. Login ke blogger.com
2. Pilih Tema
3. Pilih Edit HTML
4. Cari kode berikut dengan menekan tombol CTRL+F

></b:skin>

5. Setelah ketemu, tempel kode dibawah ini diatasnya

.buttonmt{ text-align: center; } .btn{ font-family: Google Sans,sans-serif; background-color: #039be5; color: #fff; padding: 6px 12px; margin-bottom: 5px; font-size: 16px; line-height: 1.42857143; text-align: center;l white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; border-radius: 4px; display: inline-block; text-decoration: none; } .btn:hover{ background-color: #0388ca; }

6. Simpan Template

Pemasangan Pada Artikel

1. Edit artikel yang akan kamu tambahkan tombol Demo dan Download.
2. Pilih mode HTML, bukan Compose
3. Tentukan dimana kamu akan meletakkan kode
4. Tempel kode berikut di tempat yang sudah kamu tentukan

<div class="buttonmt"> <a href="#" class="btn">Demo</a> <a href="#" class="btn">Download</a> </div>

5. Ganti # dengan link demo dan downloadmu
6. Selesai

Ada baiknya jika kamu telah mempublikasikan artikelnya, coba kamu lihat dulu seperti apa tampilan tombol Demo dan Download nya, siapa tahu ada kesalahan pada pemasangannya.




Nah, jadi itulah pemabahasan Cara Membuat Tombol Demo dan Download Keren dan Responsive di Blog.