Membuat Tombol Download + Tombol Demo di Semua Template Blogger

Membuat Tombol Download + Tombol Demo di Semua Template Blogger
Tampilan mencolok menarik, mudah dan keren di lihat, seperti itu lah button download atau bahasa indonesianya tombol download beserta tombol Demo juga akan kita bahas di postingan ini ya sob. Karena dengan membuat tombol download yang menarik, tentu pengunjung akan mudah menemukan apa yang akan dia cari.

Tampilan tombol ini sudah banyak beredar di  berbagai blog mengenai Blogging dengan memberikan tampilan box biasa, flat design dan sampai tombol animasi ketika pengunjung menekan mengklik tombol demo atau download dari efek hover yang digunakan. Selain tampilan menjadi keren di postingan blog, tombol download yang terpasang di setiap postingan ini tentunya sudah responsive ya sobat. Sehingga ketika pengunjung menggunakan handphone android maupun komputer, tombol yang sudah di buat tersebut akan tetap mengikuti ukuran device.

Cara Memasang Tombol Download dan Demo di Semua Template

Cara memasang tombol download ini cukuplah mudah, karena hanya menambahkan sedikit HTML untuk membuat tombol menjadi keren yang sebelumnya sudah menambahkan CSS pada template Blogger. Dengan tampilan menarik ini, tentu akan lebih cocok untuk sobat yang memiliki blog download.

Menambahkan CSS Button Download dan Demo di Template Blogger

  1. Login akun Blogger
  2. Klik Menu Tema dan Buka Edit HTML
  3. Copy dan Paste kode CSS berikut di atas ]]></b:skin> atau </style>
  4. Klik Simpan Tema atau Save

Menambahkan HTML Tombol Download dan Tombol Demo di Postingan

  1. Buatlah artikel seperti biasa
  2. Setelah selesai membuat artikel. Carilah Menu HTML ada bagian pojok kiri atas yang bersampingan dengan Menu Compose.
  3. Membuat Tombol Download + Tombol Demo di Semua Template Blogger
    Letak Menu Compose dan Menu HTML
  4. Pada Menu HTML, copy dan paste Kode HTML berikut di akhir artikel atau sesuai dimana keinginan sobat untuk menampilan tombol Download.
  5. Untuk melihat berhasil atau tidak memasang tombol download dan demo, maka lakukan Pertinjauan terlebih dahulu sebelum mempostingan artikel tersebut.
  6. Selesai
Rubah Link Demo : Ganti menjadi Link Demo sobat
Rubah Link Download : Ganti menjadi Link Download sobat
Jika icon download dan demo tidak muncul, tambahkan CSS External berikut diatas </head>
<link href='http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>
Karena icon diatas masih menggunakan CSS External, jika sobat ingin menggunakan Font SVG. Sobat harus melakukan merubah CSS kembali untuk menyesuikan.

Demikian artikel mengenai "Cara Membuat Tombol Download + Tombol Demo di Semua Template Blogger" Semoga dapat membantu sobat untuk merubah tampilan agar menjadi keren. Untuk postingan selanjutnya, mungkin akan membahas membuat tombol download seperti jalan tikus.

Artikel Terkait

0Comments

Previous Post Next Post