Cara terbaru dan simpel membuat tombol download blogspot

 Halo kawan pernahkan sobat melihat situs yang ada tombol downlodnya,seperti situs game,situs mp3,file dan masih banyak lainnya dan pada kesempatan kali ini admin akan bagikan cara membuat tombol downlod seperti contoh gambar di bawah ini.
Oke langsung saja bagi pengguna blogspot,untuk langkahnya yang pertama buka Blog yang akan kita modifikasi seperti gambar di atas,enter Thema lalu ke mode HTML.dan terakhir saatnya kita akan menambahkan kode CSS yang berada di <style type='text/css'>.

 Masukkan kode di bawah ini,tepat berada di bawah kode di atas.

#download {list-style:none;text-align:center;margin:10px!important;padding:10px!important;font-size:14px;clear:both;display:-webkit-inline-box;text-decoration:none!important;color:#FFF!important}
.btn ul {margin:0;padding:0}
.btn li{display:inline;margin:5px;padding:0;list-style:none;}
.googlep,.download{padding:12px 15px!important;color:#fff!important;font-weight:600;font-size:13px;font-family:Open Sans;text-align:center;border-radius:3px;border:0;transition:all .2s ease-out;margin-right:10px;}
.googlep {background-color:#2D9E3B;}
.download {background-color:#1A66BC;}
.googlep:hover {background-color:#35BA45; opacity:1;}
.download:hover {background-color:#2073D2;opacity:1;}
.googlep:before {content:&#39;\f04b&#39;;display:inline-block;font-weight:normal;vertical-align:top;margin-right:5px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}
.download:before {content:&#39;\f019&#39;;display:inline-block;font-weight:normal;vertical-align:top;margin-right:5px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}
.main h3 {  width: auto;margin-top: 10px;}}


Terakhir kita tambahkan Font awesome dari bootstrap.dan taruh kode di bawah ini ,tepat di bawahnya kode <head>.
<link href='//netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet'/> 
Dan save .dan saat menulis artikel kita gunakan mode HTML ,untuk awalnya mengunakan Compose tidak apa-apa,tetapi  pas saat akan memasukkan link download kita gunakan mode HTML,lihat contoh di bawah
Dan biasanya untuk tombol download berada di bagian bawah artikel ,maka di bawah </li> (seperti contoh gambar di atas) kita tambahkan kode download di bawah ini
<div style='text-align: center;'>
<ul id='download'>
<li><a class='googlep' href='isi dengan link download anda ' target='_blank'>Get it from Google Play</a></li>
<li><a class='download' href='isi dengan link download anda' target='_blank'>Direct Download</a></li>
</ul>
</div>
 
 Selamat mencoba,demikian yang bisa adminn berikan semoga bermanfaat.

Baca juga artikel lainnya