Cara Membuat tombol Button Download Dengan Mudah

Axtrending - Kali ini Tutorial cara membuat tombol Button download dengan mudah, Agar blog kita terlihat lebih Cantik Dan keren, Selain mempercantik blog Tombol button download juga memudahkan pengunjung untuk mengarahkan pengunjung ke konten yang di cari.

Axtrending

Membuat Tombol button download ada banyak macam model tombol download, tapi kali ini Axtrending akan memberikan cara cepat membuat tombol download yang menarik agar blog terlihat cantik, ok langsung saja ke tutorial berikut.

Cara Pasang tombol Download :

• Masuk (Log-in) Ke Akun blog sobat

Setelah Muncul halaman dashbor blog sobat Pilih TEMA ----->EDIT HTML

• Edit HTML Ketikan CTRL+F Sobat Ketik di kolom search ]]></b:skin> 
• Paste kode di bawah ini tepat di atas kode ]]></b:skin>

#wrap { margin:20px auto; text-align:center; }
#wrap br { display:none; }
.bie-slide,.bie-slide2 { position:relative; display:inline-block; height:50px; width:200px; line-height:50px; padding:0; border-radius:50px; background:#fdfdfd; border:2px solid #F9690E; margin:10px; transition:.5s; }
.bie-slide2 { border:2px solid #36D7B7; }
.bie-slide:hover { background-color:#F9690E; }
.bie-slide2:hover { background-color:#36D7B7; }
.bie-slide:hover span.circle,.bie-slide2:hover span.circle2 { left:100%; margin-left:-45px; background-color:#fdfdfd; color:#F9690E; }
.bie-slide2:hover span.circle2 { color:#36D7B7; }
.bie-slide:hover span.title,.bie-slide2:hover span.title2 { left:40px; opacity:0; }
.bie-slide:hover span.title-hover,.bie-slide2:hover span.title-hover2 { opacity:1; left:40px; }
.bie-slide span.circle,.bie-slide2 span.circle2 { display:block; background-color:#F9690E; color:#fff; position:absolute; float:left; margin:5px; line-height:42px; height:40px; width:40px; top:0; left:0; transition:.5s; border-radius:50%; }
.bie-slide2 span.circle2 { background-color:#36D7B7; }
.bie-slide span.title,.bie-slide span.title-hover,.bie-slide2 span.title2,.bie-slide2 span.title-hover2 { position:absolute; left:90px; text-align:center; margin:0 auto; font-size:16px; font-weight:bold; color:#F9690E; transition:.5s; }
.bie-slide2 span.title2,.bie-slide2 span.title-hover2 { color:#36D7B7; left:80px; }
.bie-slide span.title-hover,.bie-slide2 span.title-hover2 { left:80px; opacity:0; }
.bie-slide span.title-hover,.bie-slide2 span.title-hover2 { color:#fff; }

• Kemudian pastekan lagi kode dibawah ini tepat  dibawah kode </head>

<link href='http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>

• Setelah selesai pilh SIMPAN Tamplate

Selanjutnya setiap kalian membuat artikel dan ingin memakai tombol download masukan kode dibawah ini berikut langkah - langkahnya :

• Buka/login blog sobat lalu pilih ENTRI BARU/POSTINGAN BARU
• Pilih Tampilan HTML pastekan kode html di bawah ini

<a class="bie-slide2" href="https://www.axtrending.xyz/" target="_blank">

  <span class="circle2"><i class="fa fa-download"></i></span>

  <span class="title2">Download</span>

  <span class="title-hover2">Click here</span>

</a>

</div>

Ok sekian dulu tutorial dari Axtrending semoga bermanfaat.