Cara Membuat Efek Api pada Link di Blog – Kemarin lusa saya telah membahas cara membuat 1 link dengan 2 tujuan berbeda. Sekarang, saya akan membahas cara membuat efek
api (atau terbakar) pada link di blog. Saya ucapkan terima kasih pada admin
blog izal-sragi.blogspot.com, yang telah membagi script ini. Secara pribadi,
efek api pada link ini terlihat cukup keren dan menarik pengunjung, serta dapat
menambah nilai seni pada blog. Efek ini akan terlihat apabila pengunjung blog meletakkan pointer mouse diatas link. Untuk lebih detailnya, silahkan lihat gambar disamping
Berikut ini
langkah – langkahnya :
- Login ke Blogger.com,
lalu masuk ke Template.
- Backup
template blog Anda (lihat caranya disini).
- Klik tombol Edit HTML, dan tekan CTRL+F, dan cari kode a:hover{ (Jika Anda tidak menemukan kode ini, tolong baca catatan dibawah.)
Contoh : Di blog saya, kodenya seperti ini : a:hover{text-decoration:none;}
- Jika sudah
ketemu, pastekan kode berikut (setelah a:hover{)
text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40, 2px -10px 10px #f10;
Sehingga, kode akhirnya akan menjadi :
a:hover{text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40, 2px -10px 10px #f10;
- Terakhir, klik
Simpan template.
Catatan : Jika di blog Anda tidak ada kode a:hover{, silahkan copy kode berikut dan
pastekan di Edit HTML (dibawah <b:skin><![CDATA[ ) :
a:hover{text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40, 2px -10px 10px #f10;
text-decoration:none;
}
Bagaimana,
mudah bukan? Selamat mencoba membuat / memasang efek api pada link di blog!
Tolong juga like blog ini di Facebook,
follow di Twitter, dan Add Google + nya. Ups, satu lagi. Tolong pula berikan Google +1! Selamat
mencoba, terima kasih dan salam blogger!
Suka Artikel Ini? Yang Share Dapat Pahala Lho... Trims!
ini akan berlaku disetiap link mas, termasuk link pada gambar jika kita menerapkan secara langsung pada selector HTML, hmm.. bisa mengganggu pembaca jika kursor menyentuh gambar
BalasHapusKeren juga Kang kalau ada efek-efek ini di blog :)
BalasHapuswoow mantap, di hp bisa gak ya?
BalasHapusnggak ada contohnya ya gan?
BalasHapus