Membuat Link Bergerak Miring Saat Disentuh

Kemarin kita telah membuat tutorial cara membuat link menari dan link ada hantunya, nah sekarang kita lanjutkan kepada cara membuat link bergerak miring saat disentuh dan anda bisa mengatur posisi dimana saja yang anda inginkan untuk memiringkan link yang di sentuh.
Pada tutorial kali ini saya ingin sharingkan link yang bergerak miring pada bagian posting saja, bagaimana cara membuatnya ?

Masuk ke blogger => di dasbor_klik rancangan => Edit HTML => Centang kotak

Expand Template Widget,

Lalu cari dengan tombol find ( CTRL+F3 ) :

a:hover {

Jika sudah ketemu, tentukan lokasi link yang akan anda miringkan

*Contoh: saya ingin memiringkan link pada lokasi posting saja, maka saya menemukan kode


.post-body a:hover {

Lalu tambahkan dibawahnya kode untuk memiringkan tulisan

font-style:italic;

Maka hasilnya sbb:

.post-body a:hover {
font-style:italic;
text-decoration: underline;
color: $mainHoverLinkColor;
}

Contoh gambar seperti di bawah ini :

Jika ingin di sidebar saja, cari kode yang mendekati seperti #sidebar1 ,biasanya format kode di template seperti ini :

#sidebar1 a:hover, #sidebar2 a:hover, #sidebar3 a:hover, #sidebar4 a:hover {
MAKA SELIPKAN KODE PEMIRING TULISAN (font-style:italic;) DISINI
text-decoration: none;
color: $sidebar1HoverLinkColor;
}

Catatan: jika ingin mengetahui teknik pencarian kode, anda bisa membaca artikel ini: Mengapa kita tidak bisa menemukan kode HTML blog yang kita cari

Anda bisa memiringkan link dimana saja yang anda mau, tinggal cari sendiri kodenya. Tidak susah jika anda sering memperhatikan penulisan kode HTML atau Edit Template. Intinya anda harus melakukannya, kalau hanya melihat dan membaca artikel ini, anda tidak akan tau caranya.

Posted in: