Cara membuat tombol demo dengan efek warna-warni - Pada kesempatan kali ini aku akan membagikan tutorial cara memasang tombol demo pada blog dengan tampilan efek gradien warna atau dengan tampilan efek warna warni. Bagi sobat yang sangat suka mempercantik tampilan blog, mungkin ini adalah artikel yang tepat. Namun harus diperhatikan, saat membuat atau memasang efek di blog, kita harus mengkonversinya dulu, agar efek yang sobat pasang tidak terlalu membebani blog sobat.
Cara mengconvertnya gimana kak?
Tenang sobat, aku udah sediain toolsnya. Jika sobat ingin mengkonversinya kedalam bentuk HTML klik disini, dan jika sobat ingin mengkonversinya kedalam bentuk CSS klik disini. Perlu diketahui bahwa kode atau teks yang kita konversi, tidak mengurangi kualitas efek blog. Konversi ini dilakukan agar blog sobat memahami semua kode html dalam waktu singkat. Nah, jika sobat ingin langsung membuatnya, silahkan ikuti panduan langkah-langkahnya dibawah ini.
1. Coddingnya
#1. Masuk ke blogger.#2. Pilih menu tema.
#3. Kemudian pilih edit html.
#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%}}2. Cara Memasangnya
#1. Pilih menu postingan.#2. Pilih entri baru.
<div id="dmgradient"><a class="dmg" href="#">DEMO</a></div>| Nama | Keterangan |
|---|---|
| # | Ubah dengan alamat link yang sobat inginkan. |
| DEMO | Ubah dengan kata-kata yang sobat inginkan (misalnya result atau download). |
Baca juga : nilai kualitas artikel didalam blog kamu dengan memasang kode ini! mudah kok, silahkan dibaca yah.Oh iyah, sebelumnya di konversi dulu yah kode CSSnya, biar efeknya semakin lebih bagus. Kalau mau dibiarin gitu aja kodenya, gak apa-apa. Tapi nanti akan mempengaruhi kecepatan blog walau cuma 1%. itu aja sih menurut aku. Terima kasih hehehe.
Dapatkan Tips Menarik Setiap Harinya!
- Dapatkan tips dan trik yang belum pernah kamu tau sebelumnya
- Jadilah orang pertama yang mengetahui hal-hal baru di dunia teknologi
- Dapatkan Ebook Gratis: Cara Dapat 200 Juta / bulan dari AdSense
0 Response to "Cara Membuat Tombol Demo dengan Efek Warna-Warni"
Post a Comment
Catatan Untuk Para Jejaker