Cara Membuat Tombol Download Dan Juga Demo Bisa dicustom di Postingan Blogger

Kali ini ZTN CODING akan membagikan tutorial Cara Membuat Tombol Download Dan Juga Demo Bisa dicustom di Postingan Blogger. Apa itu Tombol Download? tombol download biasanya digunakan untuk situs download. entah itu untuk mendownload file, software dan juga aplikasi atau yang lainnya. tentu ada banyak cara membuat tombol download itu dan yang akan saya bagikan kali ini adalah salah satunya.  oke tanpa berlama lama lagi silahkan lihat dan praktekan tutorial ini

1. pertama Masukan dulu font awesome kedalam blogger sobat jika blog sobat sudah ada font awesome jangan dimasukan ya,  nah jika memang belum cara memasukan Font Awesome, masuk ke blogger sobat, klik Tema, Edit HTML cari kode </head> atau &lt;!--<head/>--&gt; jika sudah ketemu masukan kode dibawah ini tepat di atas kode </head> atau &lt;!--<head/>--&gt; tadi oke

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />

2. selanjutnya cari kode ]]></b:skin> atau </style> pastekan kode dibawah tepat diatas kode ]]></b:skin> atau </style>

 /* CSS Button */
.button{float:left;list-style:none;text-align:center;width:95%;margin:10px;padding:2px;font-size:14px;clear:both}
.button ul{margin:0;padding:0}
.button li{display:inline;margin:5px;padding:0;list-style:none}
.button li a.demo,.button li a.download{position:relative;padding:9px 48px 9px 16px;background:#f39c12;color:#fff!important;font-weight:700;font-size:14px;text-align:center;text-transform:uppercase;letter-spacing:0.5px;border-radius:3px;box-shadow:0 1px rgba(0,0,0,0.1);line-height:normal;transition:all .3s}
.button li a.download{background:#3498db}
.button li a.demo:hover,.button li a.download:hover{background:#666}
.button li a.demo:active,.button li a.download:active{cursor:pointer}
.button li a.demo:after,.button li a.download:after{content:'\f135';background:rgba(0,0,0,0.1);position:absolute;right:0;top:0;font-weight:normal;display:inline-block;margin:0 0 0 10px;color:#fff;padding:11px;font-family:fontawesome}
.button li a.download:after{content:'\f019'}

Dan Klik Simpan

---

Cara Menggunakannya. didalam postingan Ganti Mode Tampilan Penulis ke mode Tampilan HTML itu untuk Blogger versi sekarang untuk persi yang lama ganti mode Compose ke mode HTML masukan kode dibawah ini dimana kalian ingin letakan terserah

<div style="text-align: center;">
  <ul class="button">
    <li><a class="demo" href="URL-Demo" target="_blank">Demo</a></li>
    <li><a class="download" href="URL-Download" target="_blank">Download</a></li>
  </ul>
</div>
<div class="clear"></div>

ganti URL-Demo dan juga URL-Download dengan URL sobat, dan selesai

jika Sobat Berkenan Silahkan Share Artikel ini ke media sosial milik sobat atau tinggalkan komentar dibawah 👇☺