Cara Membuat Tombol DOWNLOAD dan DEMO Keren di Blog

Gambar dibawah ini adalah ScreenShot-nya

Jika anda ingin lebih jelas lagi silahkan klik tombol demo di bawah ini

• Demo
• Download

Jika anda tertarik, apa salahnya anda mencoba, mumpung gratis...

1. Buka blogger.com

2. Pilih Template, lalu Edit html

3. Cari kode  ]]></b:skin>

4. Copast kode Script dibawah ini, diatas  ]]></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 }

5. Klik "Simpan Setelan"

6. Untuk memasang-nya tentu saja sangat mudah..

7. Klik "entri baru"

8. Pilih Mode HTML

9. Copast kode dibawah ini

<div style="text-align: center;"> <ul class="button"> <li><a class="demo" href="http://3defit.blogspot.com" target="_blank">Demo</a></li> <li><a class="download" href="http://3defit.blogspot.com" target="_blank">Download</a></li> </ul> </div> <div class="clear"> </div>

Ganti "http://3defit.blogspot.com" yang pertama dengan URL yang ingin anda pasang di tombol demo
Ganti "http://3defit.blogspot.com" yang kedua dengan URL yang ingin anda pasang di tombol download

Selesai.....

Itulah Tutorial Blog Cara Membuat Tombol DOWNLOAD dan DEMO Keren di Blog dari saya, jika anda ingin membaca Tutorial Blog lainnya, silahkan klik link di bawah ini
http://3defit.blogspot.com/search/label/Tutorial%20Blog

Sekian dari saya, jika ada yang kurang jelas, silahkan tinggalkan komentar.  Salam 3Defit, semoga beruntung dan berhasil ya.....