Cara Membuat Tombol Demo dan Download Sederhana - Membuat tombol demo dan d0wnl0ad di blog sangatlah gampang dan sederhana sama saja dengan menciptakan link atau url biasa. Tetapi link tersebut kita ubah menjadi tombol yang lebih menarik dengan menawarkan kotak dan warna akan menawarkan kesan yang berbeda dibandingkan dengan link biasa.
Button demo dan d0wnl0ad ini aku buat dengan sangat sederhana tanpa memakai font awesome, aku hanya memakai dampak transisi sederhana namun tetap elok jikalau Anda gunakan. Tombol ini aku buat sederhana juga untuk mempercepat loading blog Anda, alasannya ialah jikalau memakai font awesome akan sedikit membutuhkan waktu untuk loading walaupun tombol demo dan d0wnl0ad yang memakai font awesome jauh lebih keren dibandingkan dengan ini.
Blogger yang memakai button d0wnl0ad dan demo ini biasanya untuk blog yang menyediakan template, ataupun blog d0wnl0ad lainnya. Demo ialah preview atau referensi tampilan dari sebuah file yang akan kita d0wnl0ad, sedangkan d0wnl0ad ialah file yang akan kita unduh sesuai dengan preview yang sudah kita lihat.
Button demo dan d0wnl0ad ini aku buat dengan sangat sederhana tanpa memakai font awesome, aku hanya memakai dampak transisi sederhana namun tetap elok jikalau Anda gunakan. Tombol ini aku buat sederhana juga untuk mempercepat loading blog Anda, alasannya ialah jikalau memakai font awesome akan sedikit membutuhkan waktu untuk loading walaupun tombol demo dan d0wnl0ad yang memakai font awesome jauh lebih keren dibandingkan dengan ini.
Blogger yang memakai button d0wnl0ad dan demo ini biasanya untuk blog yang menyediakan template, ataupun blog d0wnl0ad lainnya. Demo ialah preview atau referensi tampilan dari sebuah file yang akan kita d0wnl0ad, sedangkan d0wnl0ad ialah file yang akan kita unduh sesuai dengan preview yang sudah kita lihat.
Nah, bagi Anda yang ingin memasang tombol demo dan d0wnl0ad ini di blog Anda silahkan ikuti langkah-langkahnya dibawah ini.
1. Masuk ke Blogger.com
2. Lalu masuk ke bab Template > Edit HTML
3. Cari arahan
]]></b:skin>
atau </style>
4. Copy arahan CSS dibawah ini
5. Paste diatas arahan.demo{border:none;border-radius:2px;padding:5px 20px!important;background:#5959ff;color:#FFF!important;text-align:center;text-shadow:0 0 1px rgba(0,0,0,0.3);transition:background-color 1s ease-out 0s;letter-spacing:1px}
.d0wnl0ad{border:none;border-radius:2px;padding:5px 20px!important;background:#4cc3ff;color:#FFF!important;text-align:center;text-shadow:0 0 1px rgba(0,0,0,0.3);transition:background-color 1s ease-out 0s;letter-spacing:1px}
.demo:hover{background:#000;text-shadow:0 0 1px #222}
.d0wnl0ad:hover{background:#000;text-shadow:0 0 1px #222}
]]></b:skin>
atau </style>
6. Klik Simpan template
Bagaimana Cara Menggunakan Tombol Demo dan Download ?
Setelah memasang arahan css pada template blog Anda, kini Anda tinggal mencoba untuk menggunakannya. Lalu bagaimana cara memakai tombol demo dan d0wnl0adnya ? Silahkan simak dibawah ini.Tambahkan arahan
class='demo'
untuk tombol DemoTambahkan arahan
class='d0wnl0ad'
untuk tombol Download1. Buatlah sebuah link menyerupai biasanya pada artikel blog Anda
2. Jika Anda berada di bab Compose silahkan klik di bab HTML
3. Carilah link yang sudah Anda buat, contohnya menyerupai ini
<a href="aciknadzirah.blogspot.com" title="√ Cara Membuat Tombol Demo dan Download Sederhana"></a>
4. Tambahkan arahan
class='demo'
atau class='d0wnl0ad'
<a class='demo' href="aciknadzirah.blogspot.com" title="√ Cara Membuat Tombol Demo dan Download Sederhana"></a>
5. Silahkan publikasikan kembali artikel Anda
Jika Anda masih merasa kesulitan dengan tutorial diatas silahkan untuk menawarkan komentar Anda, aku usahakan akan membantu Anda dalam memasang tombol demo dan d0wnl0ad di blog Anda.
Sumber http://www.caramanual.com
Buat lebih berguna, kongsi: