Cara Membuat Tombol Demo dan Download di Blog

Download button pada blog

Cara Membuat Gambar Download di Blog - Membuat tombol download pada Blogger itu semudah antum semua memposting artikel dalam format HTML.

Ini cara membuat tombol button tersebut:

1. Copy saja script tombol demo dan download berikut ini di postingan natum dalam manhaj HTML. Jangan Compose yah.

<style>
.buttonx{display:inline-flex;cursor:pointer;font-size:13px;font-weight:bold;text-transform:uppercase;box-shadow:0 1px 2px rgba(0,0,0,.2);color:#FFF!important;border:2px solid #FFF!important;background-color:#0070b0!important;background:0;margin:5px 0;padding:8px 25px;text-shadow:none!important;transition:all 0s!important}
.buttonx:hover{background-color:#f78d1d!important;background:0}
.buttonx:active{position:relative;top:1px}
</style>
<div style="text-align: center;margin: 10px 0;">
<a class="buttonx" href="http://www.kiaiblogger.com/" target="_blank">Demo</a>
<a class="buttonx" href="http://www.kiaiblogger.com/" target="_blank">Download</a>
</div>

Catatan:

• Ganti link berwarna merah di atas dengan link yang ingin antum target di postingan. 
• Ganti juga Teks "Demo" atau "Download" di atas dengan teks sesuai antum mau. Misal diganti menjadi "Lihat Contoh", atau "Unduh Sekarang". 

2. Jika ingin menambahkan tombol selain "Demo" dan "Download", tambahkan saja kode berikut ini di bawahnya:

<a class="buttonx" href="http://www.kiaiblogger.com/" target="_blank">Nama Tombol</a> 

3. Selesai. Publish. Ini hasilnya:

Demo Download

Kelebihan script tombol download dan demo di atas adalah tidak memerlukan setting template blog sebagaimana diulas oleh blog-blog tutorial lain. Jadi lebih ringan load nya. Insyallah.

Kiaiblogger.com menggunakan cara ini pada postingan berjudul: Membagi Postingan Blog Jadi Beberapa Halaman (Tanpa JQuery). [kiaiblogger.com]

Baca juga:

Advertisement

Rubrik:BloggingCodingPosting