Pada kesempatan kali ini saya akan memberikan tutorial bagaimana Cara Mudah Membuat Tombol Demo Dan Download Dengan Icon Pada Postingan Blogger. Tombol Demo dan Download merupakan suatu tombol yang beriksikan Link yang berfungsi menjadi perantara antara situs website/blog anda dengan situs website/blog yang berisikan media penyimpanan.
Fungsi dari pemasangan Tombol Demo dan Download pada situs website/blog ini sebenarnya mempunyai peran yang sangat penting yaitu mempermudah pengunjung untuk mengetahui Tombol Link yang berisikan Demo, Download, Buy, Transaksi atau sebagainya.
Karna fungsi dari Tombol Demo dan Download pada situs website/blog memiliki peran yang peting maka pemilik situs website/blog memberikan efek khusus atau warna pada Tombol Demo dan Download ini tujuannya untuk mempercantik blog dan mempermudah pengunjung situs website/blog anda dalam membedakan Tombol Link yang tersedia.
Di postingan sebelumnya saya pernah memberikan tutorial serupa, namun kali ini saya membuat tombol demo dan download dengan icon font awesome di sebelah kanannya. Jadi bagi yang tertarik untuk memasang Tombol Demo dan Download pada situs blog kalian, ikuti tutorial di bawah ini.
Cara Mudah Membuat Tombol Demo Dan Download Dengan Icon Pada Postingan Blogger
1. Login ke Blogger > pilih menu Tema > kemudian Edit HTML
2. Letakkan ko ini tepat berada di atas kode ]]></b:skin> atau </style>
/* CSS BUTTON DEMO DOWNLOAD */
#wrap {margin:20px auto;text-align:center;}
#wrap br {display:none;}
.button.left {display:inline-block;position:relative;font-family:'Source Sans Pro', Helvetica, sans-serif;background:#fb7073;padding:10px 30px;font-size:14px;margin:0 3px;color:#fff!important;border-radius:1px;border:none;text-transform:uppercase;text-decoration:none;}
.button.right {display:inline-block;position:relative;font-family:'Source Sans Pro', Helvetica, sans-serif;background:#1b1b1b;padding:10px 30px;font-size:14px;margin:0 3px;color:#fff!important;border-radius:1px;border:none;text-transform:uppercase;text-decoration:none;}
.button i {margin-left:15px;font-weight:normal;font-family:FontAwesome;}
3. Jika sudah kemudian pilih Simpan Tema
4. Untuk menerapkan tombol demo dan download ini di postingan blog anda > buat Postingan Baru > pilih menu HTML (bukan
<div id="wrap">
<a class="button left" href="URL-ANDA" rel="nofollow" target="_blank">DEMO<i class="fa fa-search"></i></a>
<br />
<a class="button right" href="URL-ANDA" rel="nofollow" target="_blank">DOWNLOAD<i class="fa fa-download"></i></a>
</div>
<div class="clear">
</div>
5. Selanjutnya tinggal di Publikasikan saja
Keterangan:
Nama | Keterangan |
---|---|
URL-ANDA | Ubah dengan Link yang anda inginkan |
DEMO/DOWNLOAD | Ubah tulisan sesuai keinginan anda (misalnya: beli, demo,lihat ataupun kunjungi |
Cukup mudah bukan Cara Mudah Membuat Tombol Demo Dan Download Dengan Icon Pada Postingan Blogger. Bila kamu mengalami kesulitan dalam menerapkannya pada blog kalian silahkan tinggalkan pesan di kolom komentar. Semoga informasinya bermanfaat dan sampai jumpa.