Edit the text colors on blog page and posts

Support
#1

How can I change the color of the paragraph/heading text on only my blog page and blog posts? The majority of my website has dark or black backgrounds so my text and heading color is set to white. But on my blog, the background is white, so I want the text to be black.

I have tried using CSS to change it (pasted below), but it’s not working for the following reasons:

  • It shows up correctly when I’m using cornerstone, but when I leave cornerstone, the changes are no longer visible. I tried using the !important tag on each of them, but it also didn’t work.
  • I don’t think this will also edit the posts themselves, and I need a way to change them too.
  • It affects the text logo in the nav bar, which I don’t want.

p {
color: black;
}

h1 {
color: black ;
}

h2 {
color: black ;
}

h3 {
color: black ;
}

h4 {
color: black;
}

h5 {
color: black;
}

h6 {
color: black;
}

a {
color: black;
}

a:link {
color: black;
}

a:visited {
color: gray ;
}

a:hover {
color: gray ;
}

a:active {
color: gray ;
}

#2

Hello @lauragracemarie,

Thanks for asking. :slight_smile:

To change the paragraph and heading color on blog an post page, please add following CSS under X > Theme Options > CSS:

/* this will change heading and paragraph color in blog index page*/
.blog h2 {
    color: #ddd;
}

.blog p {
    color: #ddd;
}

/* this will change heading and paragraph color in post page*/

.single-post h1 {
    color: #ddd;
}

.single-post p {
    color: #ddd;
}

Hope that helps.

Thanks.

1 Like
#3

Thanks, this worked for most of it, and I added some more css following that pattern for other headers, lists, etc.

But there are a couple things I still need help with.

On the blog page, the title for the blog posts are all still white until you hover over them.
On the single posts, the submit button text is white as is the word “comment” above the comment box.

What CSS can I use for this?

Laura

#4

Here is the link for the blog: sharonroseauthor.com/news

#5

Hello There,

The post titles is white because this is the color of your site links. Please go to X > Theme Options > Typography > Site Links and set the Site Links color and hover color.

Hope this helps.

#6

Please read my original post.

Is there any way to change them on the blog without changing them on the whole website? The rest of my website has a dark background. My blog has a light background. So I only want them to show up as darker on my blog.

Also, you didn’t finish reading my last post. I also need help with the submit button and the word “comment” above the comment box on single posts.

I’m assuming I can fix this with CSS. Can you please give me the correct CSS for these things that will only affect the blog and single posts?

For clarity, I will list the three things I need help with:
1. On the blog page, the titles need to be black without affecting the site links on the rest of the website.
2. On the single posts, the word “comment” about the comment box needs to be black without affecting the text on the rest of the website.
3. On the single posts, I need to be able to change the color of the submit button without it changing all the submit buttons on the rest of my website.

Please give me the css for these things. Here is the blog in case you need it again: https://sharonroseauthor.com/news/

#7

Thanks for clarifying.

Please use this code

.blog h1, .blog h2, .blog h3, .blog h4, .blog h5, .blog h6, .blog .h1, .blog .h2, .blog .h3, .blog .h4, .blog .h5, .blog .h6, .blog h1 a, .blog h2 a, .blog h3 a, .blog h4 a, .blog h5 a, .blog h6 a, .blog .h1 a, .blog .h2 a, .blog .h3 a, .blog .h4 a, .blog .h5 a, .blog .h6 a, .blog blockquote {
	color: black;
}

Use this code

.single-post .comment-form-comment label {
    color: black
}

Use this

.single-post [type="submit"] {
    color: gray;
}

Hope that helps

1 Like
#8

This worked. Thanks for your help!

#9

We are delighted to assist you with this.

Cheers!

1 Like
#10

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.