Mengatur Link DI Blog

Posted By anasku
Nahhh jika dulu Anas udah membuat tutorial tentang cara membuat warna link warna-warni tapi sekarang Anas akan membagi sedikit ilmu saya kepada saudara-saudaraku sekalian yang ingin mengubah link pada blog kalian... dalam perbincangan kali ini Anas akan membahas tentang warna font link, warna link jika pointer diarahkan, warna link yang sudah dikunjungi dan lain-lain
langsung saja tanpa basa-basi lagi karena sudah cape' basa-basinya :D


Masuk menu Layout kemudian masuk ke Edit HTML kemudian cari Code CSS seperti dibawah ini


a:link {
color:#346ba4;
text-decoration:underline;
}
a:visited {
color:#800000;
text-decoration:underline;
}
a:hover {
color:#56b9ff;
text-decoration:underline;
}

Nah jik anda ingin mengotak-atik akan saya terangkan dibawah ini..


a:link { <<<-- Link aktif
color:#346ba4; <<<---- Ini adalah warna Link aktif yang belum tersentuh apapun text-decoration:underline;
}
a:visited { <<-- Link jika sudah dibuka/diklik
color:#800000; <<<--- Ini adalah warna Link jika URLnya sudah pernah dikunjungi text-decoration:underline;
}
a:hover { <<--Link jika pointer berada pada Link
color:#56b9ff; <<<--- Ini adalah ini adalah warna jika Pointer diarahkan pada Link text-decoration:underline;
}

Ganti tulisan yang berwarna merah dengan code warna yang anda sukai, Untuk code warna anda bisa cari di DISINI.
Tulisan yang tercetak biru diatas menandakan Link bergaris bawah anda bisa merubah menjadi tidak bergaris bawah dengan mengganti tulian underline menjadi none

Jika anda ingin mengatur Link Postingan anda berbeda dengan yang lain tambahkan Code CSS dibawah ini

#main .post-body a:link{
color:#346ba4;
text-decoration:underline;
}
#main .post-body a:visited{
color:#800000;
text-decoration:underline;
}
#main .post-body a:hover{
color:#56b9ff;
text-decoration:none;
}

Rubahlah sesuai keinginan kamu seperti cara diatas tadi

Jika gambar anda juga terinfeksi link dan anda juga ingin merubah tampilan jika pointer diarahkan pada gambar tambahkan Code Css dibawah ini

a img{ border-width:0}
.post-body img{ margin:5px; border:1px solid #444}

Jika Anda Ingin mengatur Link main wrapper/Link dibawah postingan dan juga diatas yang biasanya memberikan informasi Label, Komentar, Author dan lain-lain tambahkan Code Css Dibawah ini


#main-wrapper a:link{
color:#c13a10;
text-decoration:none;
}

#main-wrapper a:visited{
color:#800000;
text-decoration:none;
}

#main-wrapper a:hover{
color:#800000;
text-decoration:underline;
}


Jadi Tampilan Css Jika Lengkap seperti Dibawah ini


a:link {
color:#346ba4;
text-decoration:none;
}
a:visited {
color:#800000;
text-decoration:none;
}
a:hover {
color:#56b9ff;
text-decoration:underline;
}
#main .post-body a:link{
color:#346ba4;
text-decoration:underline;
}
#main .post-body a:visited{
color:#800000;
text-decoration:underline;
}
#main .post-body a:hover{
color:#56b9ff;
text-decoration:none;
}
a img{ border-width:0}
.post-body img{ margin:5px; border:1px solid #444
}

#main-wrapper a:link{
color:#c13a10;
text-decoration:none;
}

#main-wrapper a:visited{
color:#800000;
text-decoration:none;
}

#main-wrapper a:hover{
color:#800000;
text-decoration:underline;
}


Dahhh Silahkan Atur sendiri sesuai keinginan dan imajinasi anda
Artikel Terkait untuk "Mengatur Link DI Blog"


14 comments:

Ariek said...

Entar Q coba dech...kayaknya menarik bget...Mkcih Tutornya...

Tips Blogspot said...

coba ah...

Anasku said...

@Ariek
@tips blogspot

Silahkan semoga bermamfaat

Sandy1fm said...

mas anas yang baik hati
aku dah coba langkah diats tapi ko hasilnya tulisan linknya ko ga tampak besar ketika di tunjuk mouse ga kaya punya kamu

iam said...

nyoba juga aahh

Anasku said...

@sandy1fm

Tambahin css font-weight:bold; di hovernya

JoVie said...

Hebat CSSnya....salut...

NIFAN SUNANDAR said...

APA NANTI NGGA BEREFEK JELEK Ama tampilan blog

angga-kreatif said...

thank gan, artikelnya cukup bermanfaat bgi aq....

Anthoni Robin said...

bagus gan, info ini sangat membantu ane, kebetulan ane sedang hunting tema ini oya barang kali agan butuh backlink gratis ane punya info neh teetah.net
Teetah adalah sebuah komunitas untuk blogger, Disini kamu bisa melakukan banyak hal mulai dari mendapatkan teman,Penghasilan hinga bonus 120 backlink untuk kamu secara cuma-cuma

download software gratis said...

keren sob tutorialnya..

obat herbal stroke said...

woooow keren banget nih informasi...
satu triks bisa menghasilkan berbagai macam kreasi....
makasih yach atas ilmunya....

obat tradisional tumor lambung said...

apa tak ada cara lain untuk mengatur code link dalam blog? codenya takut ada yang salah dan tertukar

rahmad titie said...

gan saya mau nanya ni..gimana ya cara mengarahkan data yg ingin kita masukkan ke dalam daftar isi ??

Mohon Bantuanya :)

Post a Comment

 

Site Info

Add to Technorati Favorites
Visitor Online
Check PageRank

Recent Comments

Tutorial Jitu - Blog Info, Gadget-Widget, Blogspot tutorial, blog hack, free template, SEO And Blog tips : Admin By Luqman Khoirul Anas