Cara membuat Tombol Demo dan Download Seperti Kang Ismet
agan/aganwati pasti tahu kan blog kang ismet yang terkenal sekarang. oke baiklah disini saya akan memberikan bagaiman cara membuat tombol demo dan download seperti kang ismet baiklah langsung saja
Caranya yaitu :
- Buka Dasbor agan/aganwati www.blogger.com
- Pilih Menu Template terlebih dahulu => setelah itu klik Edit HTML
- Setelah itu Cari kode ]]></b:skin> dengan menggunakan (CTRL+F)/(F3)
- setelah itu taruh kode ini diatas kode ]]></b:skin>
.button{float:left;list-style:none;text-align:center;width: 100%;margin:5px 0;padding:0;font-size:14px;clear:both;}
.button ul {margin:0;padding:0}
.button li{display:inline;margin:0;padding:0}
.demo {border: none; -moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding: 8px 80px !important; background: #E55E48; color: #fff !important;text-align: center; text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -webkit-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -moz-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -ms-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); transition: background-color 1s ease-out 0s; -moz-transition:background-color 1s ease-out 0s; -webkit-transition:background-color 1s ease-out 0s; -o-transition:background-color 1s ease-out 0s;letter-spacing:1px; }
.download {border: none; -moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding: 8px 80px !important; background: #5FAAE3; color: #fff !important;text-align: center; text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -webkit-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -moz-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -ms-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); transition: background-color 1s ease-out 0s; -moz-transition:background-color 1s ease-out 0s; -webkit-transition:background-color 1s ease-out 0s; -o-transition:background-color 1s ease-out 0s; letter-spacing:1px;}
.demo:hover { background: #454242; text-shadow: 0 0 1px #222; -moz-text-shadow: 0 0 1px #222; -webkit-text-shadow: 0 0 1px #222; -ms-text-shadow: 0 0 1px #222 }
.download:hover { background: #454242; text-shadow: 0 0 1px #222; -moz-text-shadow: 0 0 1px #222; -webkit-text-shadow: 0 0 1px #222; -ms-text-shadow: 0 0 1px #222 }
6. Untuk Penggunaanya , buat kode seperti ini ketika membuat postingan (gunakan mode HTML) yaitu :
<div style="text-align: center;">
<ul class="button">
<li><a class="demo" href="Link yang dituju Demo anda" target="_blank">Demo</a></li>
<li><a class="download" href="Link yang dituju Download anda"target="_blank">Download</a></li>
</ul>
</div>
<div class="clear"></div>
7. Setelah itu selesai
Cukup itu saja yang bisa saya sampaikan selamat mencoba gan,,,!
Published By:
Tsani Aziz | Jika Ingin Copas Tolong Sertakan Sumber Di Bawah ini
Terimah Kasih telah membaca artikel
Cara membuat Tombol Demo dan Download Seperti Kang Ismet. Yang ditulis oleh Tsani Aziz .Pada hariJumat, 24 Oktober 2014. Jika anda ingin sebarluaskan artikel ini, mohon sertakan
sumber link asli. Kritik dan saran dapat anda sampaikan melalui kotak komentar Dan Jika Anda Memberi Like/Share Saya Sangat Berterima Kasih. Sekian Trimakasih ^_^