Punya blog demo atau blog khusus unduhan dimana kamu memberikan suatu link berupa tombol tapi tombolnya hanya sekedar link saja kayanya terlalu membosankan bukan maka dari itu pada Kesempatan kali ini saya akan membagikan tutorial cara memasang tombol demo pada blog dengan tampilan tampilan efek warna warni atau biasa disebut efek gradien warna.
Fungsi Tombol demo pada blog ini sebenarnya mempunyai fungsi yang penting yaitu mempermudah pengunjung untuk mengetahui tombol link entah demo, download, beli, transaksi atau sebagainya. Ditambah lagi dengan adanya efek warna gradient color ini pula dapat mempercantik blog agar pengunjung merasaya nyaman dan berlama-lama pada blog.
Sudah paham bukan fungsi tombol demo tersebut jadi sekarang saatnya saya memberikan tutorial cara Cara Mudah Membuat Tombol Demo dengan Efek Gradient Color Pada Blog, berikut ulasannya.
Cara Mudah Membuat Tombol Demo dengan Efek Gradient Color Pada Blog
1. Masuk ke Blogger > pilih menu Tema > kemudian pilih Edit HTML
2. Letakkan kode CSS ini tepat berada di atas kode ]]></b:skin> atau </style>
/* Tombol DEMO Gradient */
#dmgradient {margin:5px auto;text-align:center;}
a.dmg {display:inline-block;position:relative;font-family:'Open Sans',sans-serif;text-decoration:none;font-weight:700;background:#f24a4a;background:linear-gradient(-50deg,#ee5952,#ea3a7e,#20aadb,#23e0b3);background-size:320% 200%;animation:Gradient 15s ease infinite;letter-spacing:.5px;padding:10px 100px;margin:10px;color:#fff;box-shadow:inset 0 0 0 #202d3a;font-size:16px;text-transform:uppercase;border-radius:3px;transition:all 0.3s ease-out;}
@keyframes Gradient{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}3. kemudian pilih Simpan Tema
4. Untuk menerapkannya di blog anda buat postingan baru > pilih menu HTML > kemudian letakkan kode ini di dalamnya
<div id="dmgradient"><a class="dmg" href="#">DEMO</a></div>| Nama | Keterangan |
|---|---|
| # | Ubah dengan alamat link yang anda inginkan |
| Demo | Ubah dengan kata-kata yang anda inginkan (misalnya Result atau download) |
Cukup mudah bukan Cara Mudah Membuat Tombol Demo dengan Efek Gradient Color Pada Blog, bila kamu mengalami kesulitan dalam menerapkannya pada blog kalian silahkan tinggalkan pesan di kolom komentar, Semoga informasinya bermanfaat dan sampai jumpa.