Juraviel
Member
Posted 2 years ago #
Hi. Like it says in the title, i'd like to change the color of the links in the (i think it's called) "blogroll" section. I was playing in the css file for last 3 hours, and the only thing i managed to do is to change the color of all the links that are in the sidebar, and that's not my goal, i have 'recent posts' section and i want those links to be 'normal', i'd like instead, as i said, change only the colors of a certain category. Is it possible?
The theme im using is "zBench", as far as i know it matters (it's my first wordpress website)
Thank you!
Is your site online? Please give the link, and I'll try to help you.
Juraviel
Member
Posted 2 years ago #
you can try something like this
.blogroll a:link{
color:blue;
}
.blogroll a:hover{
color:red;
}
.blogroll a:visited{
color:green;
}
ke vinritt
Member
Posted 2 years ago #
This may help http://wpcandy.com/articles/tutorials/how-to-make-the-most-out-of-your-sidebar.html
***EDIT: Sorry, I thought that you wanted to change the color of the sidebar
Juraviel
Member
Posted 2 years ago #
@giant slayer
i dont really know where to put that, but i doubt it would work this way.
Put it anywhere in your stylesheet. Mine is called style.css
Juraviel
Member
Posted 2 years ago #
It didn't work.. and im not sure if i understand it correctly, but the style.css is made in a different way than the pagenavi-css.css on my theme, and the pagenavi-css.css is more in style that you have given. Anyway it doesn't work. I think now the theme takes the information about styling from unique 'line', in the #sidebar section in style.css, so i would have to change that, but i don't really know how..
GiantSlayer provided the code that goes into your style.css document. The only problem is that the pseudo-class a:visited has to come before a:hover in the stylesheet. That's why it didn't work. Try the code below:
.blogroll a:link{
color:blue;
}
.blogroll a:visited{
color:green;
}
.blogroll a:hover{
color:red;
}
Juraviel
Member
Posted 2 years ago #
Hm unfortunatelly it had no effect.
What does this Blogroll stands for anyway? It's a name of the category? I've edited it previously to something else, and now to try if it works i named it blogroll (the category) back again, but it didn't have any effect. Don't you think that i have to delete some pre-made sidebar proprieties so they are not in conflict with each other?
It's a CSS class, also known as a styling hook. And it should have worked unless you've got something else in the stylesheet overriding it.
I think the problem is the selectors given before do not have enough specificity. Try adding the sidebar ID, like this:
#sidebar .blogroll a:link{
color:blue;
}
#sidebar .blogroll a:visited{
color:green;
}
#sidebar .blogroll a:hover{
color:red;
}
#sidebar ul.blogroll a:link{
color:blue;
}
#sidebar ul.blogroll a:visited{
color:green;
}
#sidebar ul.blogroll a:hover{
color:red;
}
Try that. You had .useful-links, but you don't have a class .useful-links in the stylesheet; it's ul.blogroll in the #sidebar division.
Juraviel
Member
Posted 2 years ago #
YES it worked, thank you so much!!
