Cara Membuat Tombol Download Keren dan Ringan di Blogger
- Seperti biasa, sobat buka Dasbor Blogger terlebih dahulu.
- Kemudian masuk ke bagian Tema => Edit HTML.
- lalu sobat cari ]]></b:skin>
- Silahkan sobat copy kode css maxbutton di bawah ini. </ br>
/* Maxbutton For Blogger */ .maxbutton { position: relative; text-decoration: none; display: inline-block; vertical-align: middle; border-color: #505ac7; width: 160px; height: 50px; border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border-style: solid; border-width: 2px; background-color: rgba(80, 90, 199, 1); /* warna background */ -webkit-box-shadow: 0px 0px 2px 0px #333; -moz-box-shadow: 0px 0px 2px 0px #333; box-shadow: 0px 0px 2px 0px #333; } .maxbutton:hover { border-color: #505ac7; background-color: rgba(255, 255, 255, 1); /* warna hover */ -webkit-box-shadow: 0px 0px 2px 0px #333; -moz-box-shadow: 0px 0px 2px 0px #333; box-shadow: 0px 0px 2px 0px #333; } .maxbutton .mb-text { color: #fff; font-family: Tahoma; font-size: 15px; text-align: center; font-style: normal; font-weight: normal; padding-top: 18px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; line-height: 1em; box-sizing: border-box; display: block; background-color: unset; position: relative; } .maxbutton:hover .mb-text { color: #505ac7; }
- Taruh kode tersebut tepat di atas ]]></b:skin> .
- Kemudian Klik simpan.
kode yang saya beri /* warna background */ dan /* warna hover*/ bisa sobat ganti dengan warna sesuai selera menggunakan kode warna rgba.
Untuk cara pemasangannya di postingan juga cukup mudah, sobat copas kode di bawah ini dan taruh di postingan blog menggunakan mode html, lihat gambar di bawah.
pilih mode HTML |
Kode :
<a class="maxbutton" href=" LINK DOWNLOAD ATAU LINK YANG DITUJU"><span class='mb-text' > TEXT YANG DI TAMPILKAN DI BUTTON</span></a>
sobat ganti tulisan yang saya beri warna hijau dengan link yang akan di taruh di tombol, dan yang warna merah silahkan ganti dengan Text yang akan di tampilkan di tombol download.
untuk demo nya bisa sobat lihat
Tambahan :
Jika sobat ingin agar tombolnya menjadi ke bagian tengah atau sering di bilang rata tengah, tambahkan kode <center> di awal kode tombol download dan jangan lupa di akhiri dengan </center> juga. nantinya akan menjadi sperti ini
<center><a class="maxbutton" href=" LINK DOWNLOAD ATAU LINK YANG DITUJU"><span class='mb-text' > TEXT YANG DI TAMPILKAN DI BUTTON</span></a></center>
Nah, itulah Cara Membuat Tombol Download Keren dan Ringan di Blogger. Terima kasih Semoga bermanfaat.
DONASI VIA PAYPAL
Bantu berikan donasi jika artikelnya dirasa bermanfaat. Semoga kedepannya penulis tetap mampu membuat artikel-artikel lainnya yang lebih bermanfaat lagi bagi teman-teman semua. Terima kasih.
Posting Komentar untuk "Cara Membuat Tombol Download Keren dan Ringan di Blogger"
Posting Komentar