- This topic has 14 replies, 2 voices, and was last updated 3 years, 8 months ago by
.
Hi,
I am trying to change the background colour of posts, so that they are different to the pages.
Pages are dark with light writing – which is fine for limited text content on those. But the pages will have lots of text and I would like to have a white background and light. I have tried a few updates to the CSS but they didn’t work. i.e I tried this, but I didn’t see any impact
https://support.shufflehound.com/forums/topic/change-color-of-post-background/
Hi @rb585,
I hope you are well today and thank you for your question.
I want to change the posts to a white background
You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
.single-post .content-container { background: #FFF; } .single-post .content-container h2:hover, .single-post .content-container a{ color: #47c9e5 !important; } .single-post .sh-related-posts-title h3, .single-post .post-title h1, .single-post .titlebar-title h2, .single-post .content-container h2 { color: #000; }Best regards,
Shufflehound teamThanks for the response and sorry for my later reply, however, when I put CSS code in that location nothing happens. I mention this above, I have tried putting in different CSS codes into this space and none of them show any impact.
I don’t see above-shared CSS code used on your website.
Please make sure that you are using the above-shared CSS code on your website so that I can troubleshoot it.
Hi – I took it out, as it wasn’t working , it didn’t show anything. I also “reset” all the options in the themes to see if that fixed it. I will add it back in now and see what happens.
Thanks
Rob
Hi,
I have now added it back in again and I haven’t seen any changes. I have also ran a CSS validator check at w3.org and it reports 70+ errors in the CSS – even in a simple post with just text and picture, is that normal?
It seems not working on your website due to the CSS specificity issue so please try changing the CSS code as below.
.single-post #page-container .content-container { background: #FFF; } .single-post #page-container .content-container h2:hover, .single-post #page-container .content-container a{ color: #47c9e5 !important; } .single-post #page-container .sh-related-posts-title h3, .single-post #page-container .post-title h1, .single-post #page-container .titlebar-title h2, .single-post #page-container .content-container h2 { color: #000; }Hi- I tried that and that didn’t seem to work either. I have tried putting in CSS code for all sorts of things – to test it out – and nothing seems to have any impact
I can see it is working fine on your shared website as shown in the attached screenshot.
Please test it clearing your browser cache or using a different browser.
Thanks – but this only happening on some pages, e.g in the links below its not showing this.
This appears as though something else has priority -but I don’t understand what
You said in your initial reply that you want to do this only for the posts therefore I have shared the CSS code accordingly.
Do you want to make changes to your whole website on all the pages?
Hi,
As always, thanks again for getting back to me. I think its probably best if I start again because I have made some mistakes and learned a few things, so I will rephrase the questions
While using Jevelin I have been experimenting with colors layouts, different color backgrounds, and different color text for pages and for posts. For some its dark text on a white background, for some its white text on a dark background. Making sure it works for things like search results and viewing posts by tags (i.e I don’t want white writing on a white background).
As we experimented we used multiple methods to get the results this included:
- Manually editing a single page/post with Yellow Pencil
- Editing a page/post with Yellow Pencil and then applying it to template
- Editing the template in theme settings
- Updating text colours in the editor
- Updating colour in WPBakery
- Updating the CSS via adding in code
For this reason, its harder to work with (entirely my fault)
Question/Issue
What I would like to do it remove all of the updates to all of the templates, rest it/strip it back and just do one set via the theme settings.
How do I do that?
To achieve this, you have to remove all custom CSS code used on your website by adding it in theme settings and also the CSS code generated by the Yellow Pencil editor.
You can reset the Yellow Pencil editor as described in the below pages.
https://yellowpencil.waspthemes.com/docs/managing-changes-on-entire-website/
https://yellowpencil.waspthemes.com/docs/managing-the-element-styles/You have to also remove design changes and colors added using page builders.
Thanks again
You are most welcome here 🙂
