10 July 2018

Cara membuat Glow Link pada Blog

untuk menghias tampilan Blog agar mudah di baca pengunjung dengan memberi kesan Glow pada permalink. Contohnya adalah seperti berikut :


Langkah-langkah Memasang Glow Link
1. silahkan buka Blogger > Template > Edit HTML > Kemudian cari kode ]]></b:skin> atau style .
2. copykan kode CSS berikut ini sebelum kode ]]></b:skin> atau style .

 a.nyala {
text-decoration:none;
-webkit-transition:all .5s ease-out;
-moz-transition:all .5s ease-out;
-o-transition:all .5s ease-out;
transition:all .5s ease-out;
}

a.nyala:hover {
color:#fff;
text-shadow:
0px 1px 0px #288433,
0px 0px 3px #288433,
0px 0px 5px #288433,
0px 0px 30px #288433,
0px 3px 50px #288433;
} 

3. simpan Tema



Anda juga bisa mengubah warna tema background atau text dengan menggunakan kode warna seperti pada link HTML Color Code & Name


Cara Menggunakan pada Postingan
pada saat penulisan kode link, tambahkan class="nyala" pada bagian <a>, sehingga kode linknya akan menjadi seperti ini :

 <a href="#" class="nyala">Tulis Link Disini</a> 

Hasilnya akan menjadi seperti dibawah ini : (arahkan kursor pada tulisan "Tulis Link Disini")





Warna default permalink akan otomatis menyesuaikan color link pada template yang anda gunakan. Apabila ingin mengubah warna default, cukup tambahkan color code='warna yang diinginkan' pada CSS class a.nyala

Sedangkan jika ingin mengubah warna bayangan, cukup ubah kode #288433 pada bagian text-shadow menjadi kode warna yang diinginkan

contoh :

 text-shadow:
0px 1px 0px lime,
0px 0px 3px lime,
0px 0px 5px lime,
0px 0px 30px lime,
0px 3px 50px lime;
} 


fungsi code:
a.nyala untuk mengatur warna default link
a.nyala:hover untuk mengatur perubahan warna saat link tersentuh kursor
text-shadow: untuk mengatur warna bayangan



0 komentar:

Post a Comment