What css code do I need to change elements on the blog pages and where should I put it?


Author Message
Lois Pallister

Posted: 12/18/2015
Quote message 

I don’t have a child theme and have not got on very well with editing css within the Artisteer program but instead am using a plugin that allows me to add custom css to individual posts and pages as well as to the whole site.

Using the plugin I have changed the colour of the links in the widget blocks on different pages of my blog using the following code:

.page-id-**** .art-blockcontent a, .art-blockcontent a:link{
color: #ff9000;
}

.page-id-**** .art-blockcontent a:hover, .art-blockcontent a.hover{
color: #ffffff;
}

This works perfectly and I am able to change virtually any element I want this way. I also have different header images on each page.

But I cannot work out how to make changes to the blog pages though so that the code would change elements on all blog pages that are served to the user – or any blog pages for that matter including the main blog page.

I would like different link colours for each widget such as Recent Posts, Recent Comments, Archives, Categories etc.

I am sure that rather than a page id I should use .blog
But have so far not been able to make this work

I have tried
.blog .recent-posts-2 a, .recent-posts-2 a:link{
color: #ff9000;
}
and
.blog .recent-posts-2 .art-blockcontent a, .art-blockcontent a:link{
color: #ff9000;
}

I have tried this code on the blog page and in the section for the whole site with and without the !important and it is having no effect whatsoever.

Am I barking up the completely wrong tree here?

Does anyone have any idea how I may be able to achieve this?

My blog is at http://www.colourityou.co.uk

Many thanks in advance to anyone who can help.