Cara Membuat Tombol Download Keren Sederhana di Blog
CRONOSAL-Halo sobat bloggers...! Kali ini ane akan memposting artikel tentang tutorial blog yaitu Cara Membuat Tombol Download Keren Sederhana di Blog. Sebelumnya pasti agan pernah membuat melihat tombol DOWNLOAD yang keren di blog-blog lain. Mungkin itu memerlukan script dan CSS yang agak rumit, tapi ane punya trik sederhana untuk membuat tombol download yang keren.
Mau lihat seperti apa?
Klik link DEMO diatas
Keren kan gan? Scriptnya juga simpel dan ringan
Berikut scriptnya:
<style type="text/css">
a.pic .image2{display:none}
a.pic:hover .image1 {display:none}
a.pic:hover .image2 {display:inline}
</style>
<center><a class="pic" href="LINK TUJUAN JIKA GAMBAR DIKLIK">
<img class="image1" src="URL GAMBAR 1" />
<img class="image2" src="URL GAMBAR 2" /></a></center>
Keterangan:
- Tulisan berwarna merah, silahkan ganti dengan URL TUJUAN
- Tulisan berwarna kuning, silahkan ganti dengan gambar pertama
- Tulisan berwarna hijau, silahkan ganti dengan gambar kedua
Contoh DEMO yang ane buat:
Ane menggunakan 2 buah gambar
Mau copas? sertakan sumber ya!
Baca juga:
Sekian
SALAM Blogger
Tags:
Blogger
Tips dan Trik
28 komentar
manteeb niih buat situs download pas bangeet
ReplyDeleteSip :D
DeleteNice Post Gan :)
ReplyDeleteMantap nih .. :D
ReplyDeletendak bis kedip gan dicoba prosedurnya gimana gan?
ReplyDeletesyukron kang sampun saget ;) :)
ReplyDeleteMaksudnya gambar 1 dan gambar 2 ituapa? Terus apakah harus dua gambarnya? Setelah itu di letakkan di mana scriptnya? Thanks
ReplyDeleteContoh diatas terihat gambar 1 adalah gambar betuliskan DOWNLOAD dengan efek abu, sedangkan gambar 2 bertuliskan DOWNLOAD dengan warna biru. Jika kursor diarahkan ke gambar 1, maka otomatis gambar akan berubah menjadi gambar 2.
DeleteKode bisa diletakan di dalam post atau widget
:)
wuih, keren banget mas tombol downloadnya,,, langsung dicoba buat blog download saya
ReplyDeletesetuju sama yang di atas aja hehe
ReplyDeleteMuantep banget, kayak GIF nanti jadinya dan bisa ngepastiin kalo cursor reader sudah berada pada tombol download :D
ReplyDeleteWah.. Keren gan.. ijin download gambarnya gan..
ReplyDeleteijin praktekin n repos ya gan,..
ReplyDeletehttp://catatansaif.blogspot.com/
upload foto gambar nya dimana gan, biar bisa dapet url gambar
ReplyDeleteBanyak gan, blogspot juga bisa
Deletebener-bener keren
ReplyDeleteKeren. Makasih gan
ReplyDeleteTidak bisa... :(
ReplyDeleteWah, kenapa tidak bisa?
DeleteSobat pakai browser apa ketika mencobanya?
Salam Sukses gan, Tutornya Mantap sekali....
ReplyDeletepengen nyobain ane gan
ReplyDeleteMinta tolong sharing info html kode untuk menu download
ReplyDeleteMenu navigasi?
DeleteUntuk itu sobat bisa pakai widget Label, atau kalau mau pakai kode HTML bisa cari tutornya di Google, banyak yang menyediakan :)
manteb ni gan, bisa buat nyaingin anizan dan kawan" :D
ReplyDeletejadi enak, bisa ngebuat pengunjung ngedownload file lebih gampang :)
thanks tutorialnya sangat membantu
kalo boleh, atas seizin admin, izinkan saya menambatkan link di website ini :)
oantree
financesub
apkcorner
nurlansoft
your post having mnay good imformation and that is really useful with every people and hoping you will have more new post in the future,
ReplyDeleteya saya suka dengan postingan di blog anda
ReplyDeleteKalo gambar download nya seperti klik berlangganan punya agan itu gimana? Biar kalo belum diteken ada perubahan warnanya?
ReplyDeletekalau mau lebih flat gimn gan?
ReplyDeleteGunakanlah form komentar dengan bijak, hanya 20% komentar yang disetujui. Jadi jangan buang waktu Anda.
Jika ingin bertanya, berikan informasi yang detil.
Mohon untuk tidak melakukan spamming