Cara Membuat Tombol Download Keren di Blog

Bagikan :

Tweet

              Download artinya mengunduh data dari internet ke perangkat kita seperti komputer,laptop,hp dan lainya dari sebuah web atau blog yang menyajikan data yang kita butuhkan. Biasanya sebuah web atau blog menggunakan tombol download untuk mengunduh dari suatu hosting agar terlihat lebih menarik.

Pada kesempatan kali ini saya akan berbagi tutorial tentang Cara Membuat Tombol Download Keren di Blog dengan cara mudah dalam pembuatan tombol download di blogger. Ini juga bisa mempercatik tampilan blog dan juga mempermudah bagi pengunjung untuk mendownload file yang anda bagikan.

Untuk tombol yang akan kita buat tampilannya seperti dibawah ini :

DOWNLOAD

Note : Untuk tampilan tombol downloadnya mengikuti template yang anda gunakan. jadi bisa saja tampilanya lebih bagus dari contoh tombol download yang di atas.

Berikut ini adalah langkah-langkahnya yang cukup sederhana sekali :

1. Pergi ke menu Edit Template

2. Tambahkan kode di bawah ini sebelum kode ]]></b:skin>

.button{float:left;list-style:none;text-align:center;width: 100%;margin:5px 0;padding:0;font-size:14px;clear:both;}.download{border: none; -moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding: 8px 30px !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;}.download:hover{background: #00FFFF; 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}

3. klik Save.

Untuk cara penggunaan, buat kode seperti di bawah ini di postingan anda pada mode HTML.

<div class="button"><a class="download" href="www.erickney88.blogspot.com">DOWNLOAD</a></div><div class="clear"></div>

4. Ganti tulisan yang berwarna merah dengan URL download anda
5. Selesai.

Demikian tutorial tentang  Cara Membuat Tombol Download Keren di Blog selamat mencoba.

Happy Sharing... :)

Tag : Blogging