Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Membuat Tombol Download Keren Dengan Mudah Di Blog

Cara Membuat Tombol Download di blog
Cara Membuat Tombol Download di BlogDalam beberapa jenis artikel terkadang kita perlu untuk menampilkan link download, seperti artikel yang membahas aplikasi maupun template dan artikel lainnya.  Jadi untuk mempercantik tampilan link download tersebut kita perlu membuat tombol download yang lebih bagus untuk menarik minat para pembaca untuk mengklik link download tersebut.

Biasanya tombol ini selain untuk tombol download sering juga digunakan untuk membuat link melihat Demo. Khususnya buat blog yang membahas dan menjual template, jadi sebelum template tersebut di gunakan kita bisa melihat terlebih dahulu tampilan template tersebut ketika sudah di terapkan pada sebuah blog.

Untuk lebih jelasnya tombol yang di maksud perhatikan gambar berikut ini :
Cara Membuat Tombol Download dan Demo Keren

Cara Membuat Tombol Download Keren Dengan Mudah Di Blog

Sebenarnya untuk membuat tombol download tersebut sangat mudah dan simple cara membuatnya. Khusus buat anda yang memakai template VioMagz buatan mas sugeng anda cukup copy dan menambahkan script berikut ini pada artikel postingan anda.

<a class="buttonDownload" href="URL-DOWNLOAD">Download</a>

Kemudian ikuti langkah – langkah berikut :
  • Pertama buka terlebih dahulu artikel yang mau di tambahkan tombol downloadnya 
  • Kemudian ubah tampilannya ke mode HTML
Cara Membuat Tombol Download dan Demo Keren
  • Selanjutnya copy script diatas dan pastekan dimana tempat yang ingin anda buat tombol downloadnya.
  • Kemudian jangan lupa untuk merubah yang berwarna merah dengan link url tujuan, dan tulisan yang berwarna kuning merupakan teks yang akan di tampilkan anda bisa merubah sesuai dengan kebutuhan dan keinginan anda.
  • Setelah selesai ubah kembali ke mode Compose  kemudian perbarui, dan silahkan lihat hasilnya akan tampil seperti berikut ini :

Baca Juga : Cara Memilih Template Yang Baik Untuk Sebuah Blog

Namun kalau cara tersebut tidak bisa berjalan dengan baik pada blog anda karena tidak menggunakan template VioMagz. anda tidak perlu khawatir, karena kita akan membagikan cara membuat tombol download yang lain agar bisa dibuat dan berjalan dengan baik di blog anda.

Langkah dan caranya sebenarnya sama dengan cara yang pertama, yang membedakan adalah script yang akan kita tambahkan yang berbeda. Kalau pada cara yang pertama scriptnya hanya sedikit, namun pada cara kedua ini agak lebih panjang seperti berikut ini :
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"></link>
<style>
.onmaibana {
  margin-right:9px;
  padding: 15px 25px;
  font-size: 24px;
  text-align: center;
  cursor: pointer;
  outline: none;
  color: #fff;
  background-color: #009688;
  border: none;
  border-radius: 15px;
  box-shadow: 0 9px #000;
}
/* Darker background on mouse-over */
.onmaibana:hover {
    background-color: #a5a6a7;
}
.onmaibana:active {
  background-color: #3e8e41;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}
</style>
<br />
<center>
<a href="https://www.onmaibana.com" target="_blank">
<button class="onmaibana"><i class="fa fa-eye"></i> Demo</button></a>
<a href="https://www.onmaibana.com" target="_blank">
<button class="onmaibana"><i class="fa fa-download"></i> Download</button></a>
</center>
Ikuti langkah – langkah berikut :
  • Sama sperti diatas pertama buka terlebih dahulu artikel yang mau di tambahkan tombol downloadnya 
  • Kemudian ubah tampilannya ke mode HTML
  • Selanjutnya copy scrip diatas dan pastekan dimana tempat yang ingin anda buat tombol downloadnya.
  • Kemudian jangan lupa untuk merubah yang berwarna hijau dengan link url tujuan, dan tulisan yang berwarna biru merupakan teks yang akan di tampilkan. kalau anda hanya membutuhkan tombol download saja tinggal hapus script Demonya.
  • Setelah selesai ubah kembali ke mode Compose  kemudian perbarui, dan silahkan lihat hasilnya akan tampil seperti berikut ini :

  
     

Baca Juga : 
Itulah cara membuat tombol download di dalam artikel blog, bagaima mudah gak caranya.? Kalau ada pertanyaan seputar artikel ini silahkan tinggal di  kolom komnetar. semoga artikel ini bermanfaat dan bisa membantu bagi anda yang masih bingung dengan cara membuat tombol download. Kalau menurut anda artikel ini bermanfaat silahkan di share ke teman – teman lainnya, agar artikel ini banyak memberikan manfaat kepada orang banyak.

22 komentar untuk "Cara Membuat Tombol Download Keren Dengan Mudah Di Blog"

  1. makasi tutorialnya bang, kadang perlu juga tombol download ini untuk mengarahkan pembaca mengunduh file pasca kuliah whatsapp

    BalasHapus
    Balasan
    1. iya sama - sama kak, mudah mudahan artikelnya bisa bermanfaat dan membantu untuk buat tombol unduhannya.

      Hapus
  2. Thanks banget udh mau berbagi ilmunya secara gratis..

    BalasHapus
    Balasan
    1. sma2 kk semoga aritkel diatas bisa mempermudah bagi siapa saja yang ingin membuat tombol download di dalam artieklnya.

      Hapus
  3. Bisa dipraktekkan nih buat yg punya link download ebook di blognya, makasi sharingnya ya

    BalasHapus
  4. Tfs yaa Bg Henry. Berguna sekali nih,, tutorialnya. Kalau mau praktik bikin tombol sendiri tinggal tap link artikel abang ini aja, thanks yaa

    BalasHapus
    Balasan
    1. Sma2 kk, iga kk gak masalh kalau perlu simpan aja linknya, siapa tau nanti kk mau coba buat di blognya.

      Hapus
  5. Padahal liat tahapan bya sepertinya mudah banget bang. Tapi fadar akunya yng kudet. Kayaknya aku butuh bimbingan langsung, hehe

    BalasHapus
    Balasan
    1. ya mmng crany mudah kk, cukup tempatkan kode yang diatas di postingan dalam mode HTML baru kemudian publikasikan kk. tpi klau kk gak bisa juga, gpp kita siap bimbing langsung heheheheheh.

      Hapus
  6. Tampilan tombol download yang bagus biasanya memudahkan pengguna buat ngeklik ya. Kadang di web2 lain banyak tuh nyari tombol download aja susah banget.

    BalasHapus
    Balasan
    1. Iya betul bg. Semoga artikel ini bisa membantu dan memberikan manfaat bgi yg ingin membuat tombol download di blognya.

      Hapus
  7. Artikel ini sangat membantu, jadinya saya tahu banyak tentang tombol untuk download. Terimakasih bang .

    BalasHapus
  8. Artikel ini sangat membantu, jadinya saya tahu banyak tentang tombol untuk download. Terimakasih bang .

    BalasHapus
  9. gambar tombol donlotnya bisa juga dicari di internet. banyak yang cakep-cakep. pake tombol bergambar gini berasa lebih profesional ya postingannya hihi

    BalasHapus
  10. Keren infonya bang, nanti kapan-kapan mau mempraktekkannya. Kayak video tutorial bermain, or rangkuman seminar parenting di WA gitu.

    BalasHapus
  11. menarik untuk dicoba. thanks infonya bang xD

    BalasHapus
  12. Pengen coba ah. Penting banget untuk share file belajar-belajar. Makasi infonya ya.

    BalasHapus
  13. Terimakasih kak atas tutorialnya....

    BalasHapus
  14. Artikelnya sangat bermanfaat bagi pemula seperti saya dan mudah dipahami. Terimakasih banyak untuk infonya

    BalasHapus
  15. sama - sama gan.. terima kasih sudah berkunjung
    mudah - mudahan artikelnya bisa membantu..

    BalasHapus

Jika ada pertanyaan seputar blog dan artikel ini silahkan berikan komentar yang baik dan sesuai dengan isi artikelnya.