√ Cara Menciptakan Tombol Download Dan Demo Pada Blog

Membuat Tombol Download Dan Demo - Pada kesempatan kali ini aku akan membuatkan tutorial bagaiamana cara menciptakan tombol d0wnl0ad dan demo memakai css , Tutorial kali ini sangat mempunyai kegunaan buat sahabat yang mengelola blog d0wnl0ad menyerupai blog aku ini . tombol ini membantu visitor mencari tombol d0wnl0ad dan tombol demo dengan sangat mudah.


Cara Membuat Tombol Download Dan Demo
1. Buka Blogger , Kemudian klik login
2. Ditampilan Dashboard pergi ke Template
3. Edit HTML
4. Letakan css berikut sempurna diatas ]]></b:skin>

 /* CSS Demo Download Buttons -  */ .btn{list-style:none;text-align:center;margin:10px!important;padding:10px!important;font-size:14px;clear:both;display:inline-block;text-decoration:none!important;color:#FFF!important} .btn ul {margin:0;padding:0} .btn li{display:inline;margin:5px;padding:0;list-style:none;} .demo,.d0wnl0ad{padding:12px 15px!important;color:#fff!important;font-weight:700;font-size:14px;font-family:Open Sans,sans-serif;text-align:center;text-transform:uppercase;border-radius:3px;opacity:.95;border:0;letter-spacing:2px;transition:all .2s ease-out} .demo {background-color:#3498DB;} .d0wnl0ad {background-color:#1ABC84;} .demo:hover {background-color:#60B8F4;color:#fff;border-bottom:2px solid #3498DB; opacity:1;} .d0wnl0ad:hover {background-color:#49DDAA;color:#fff;border-bottom:2px solid #1ABC84;opacity:1;} .demo:before {content:'\f135';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;} .d0wnl0ad:before {content:'\f019';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;} 

5. Langkah terakhir sahabat menciptakan postingan/entri gres . letakakan isyarat html dibawah ini dalam Mode HTML

 <div style="text-align: center;"> <ul class="btn"> <li><a class="demo" href="https://alponse.blogspot.com/" target="_blank">DEMO</a></li> <li><a class="d0wnl0ad" href="https://alponse.blogspot.com/" target="_blank">Download</a></li> </ul> </div> </div> 

Begitulah Cara Membuat Tombol Download Dan Demo . Dengan mengikuti tutorial diatas aku harap sahabat dapat memahaminya dengan gampang . cukup sekian untuk tutorial kali ini , hingga jumpa ditutorial selanjutnya.
Sumber http://idalponse.blogspot.com