Change post background color in Twenty Fourteen
-
Hello,
I’m using TWENTY FOURTEEN, with wordpress.com, ad upgraded to get the Custom design.
Here is my site : http://www.lacordealistes.comI would like to change the WHITE COLOR in the background posts and in the forms (like the “propose ta liste” one on the right).
I(ve been trying for hours and hours but without any success…I’d be so happy if you could help me,
thank you very very very much
The blog I need help with is: (visible only to logged in users)
-
-
I’ve made a lot of progress : http://www.lacordealistes.com
but i’m still missing one little part…
anyone ?
-
I would like to change the WHITE COLOR in the background posts and in the forms (like the “propose ta liste” one on the right).
Is the goal to make the background for everything red?
This might be a good start in that direction:
#main, .site-content .entry-header, .site-content .entry-content, .site-content .entry-summary, .site-content .entry-meta, .page-content .site-content .entry-content, .site-content .entry-summary, .page-content { background: #aa3636; }You could probably delete some of the other rules with “background-color” in them if you use the rule above. You should test removing stuff in the preview.
You might also like this help page because it shows how to drill down to find CSS rules using the web inspector in your browser:
http://en.support.wordpress.com/custom-design/how-to-find-your-themes-css/ -
Thank you so very very much!
(now that you know the site, don’t hesitate to come and send me some lists! ;-) )
-
I have one more question : how could I put the red background for he Facebook and twitter buttons too ? thank you
-
Since those are in iframes and loaded via the outside sites (Facebook and Twitter respectively), you can’t always change the background color for elements like that because you can’t adjust anything inside the iframe served by another domain (a security feature of browsers).
If the iframe content itself doesn’t set a background color, you could change the background of the parent element iframe tag, but then you wouldn’t be able to change any details inside it like the link color. Here’s an example you can use to see what I mean:
/* This works a little */ iframe { background: #ac3532 !important; } /* This wont' work */ iframe a { color: red !important; } -
Thank you very much! This is exactly what I wanted!
But twitter remained white….
I’m sorry to disturb you -
another question : i tried to activate the “featured content” option, and it doesn’t work anymore… May it be because of something we did with the css ?
-
But twitter remained white….
Sorry if I wasn’t more clear. You cannot change the Twitter background color with CSS because the content for that part of the page is being served in an iframe and it’s a browser security feature that you cannot use CSS from one domain to edit content on another.
The reason the Facebook background color changed and the Twitter one didn’t is because the background color for the Facebook widget was being set on the iframe itself, which is something you have control to change.
-
i tried to activate the “featured content” option, and it doesn’t work anymore… May it be because of something we did with the css ?
CSS changes won’t affect that.
Check out the instructions at http://theme.wordpress.com/themes/twentyfourteen/ Those say that you need to use “featured” as a tag on the post you want to feature or set sticky posts instead — but your blog posts don’t have either of those things.
-
Thank you for your patience and your help.
Featured content works now and I understand why twitter remains whiteI have another question, but I think it’s complex, and maybe I should open a new thread ? here it is anyway : is there a way to make the widgets appear everywhere but on the first page ?
-
-
A new thread next time would be great. It’s good to give each CSS solution it’s own thread because it makes them much easier to look up later. Sometimes it works out to put similar questions too, but once you switch topics or the thread gets too long, it’s nice to start a new one.
is there a way to make the widgets appear everywhere but on the first page ?
You could do this by targeting the home page only using “.home” at the beginning of selectors. Here is a small example:
.home .content-sidebar { display: none; }That will hide the sidebar from view on the home page only. If you wanted to add additional rules, you could write them out in the editor and add “.home” to the beginning of any you just want to apply to the home page.
-
thank you very much
I hided them from the home page using the “visibility” button in the widget settings on wordpress.com, really easily…I’m beginning to understand a little bit more CSS thanks to you, merci beaucoup!
-
I’m really sorry to disturb you again but this morning, some black color reappeared on the first page… http://www.lacordealistes.com
what should i do ? -
Find this in your custom CSS:
header.entry-header { background-color: #aa3636; }And update it to this:
header.entry-header, .featured-content, .featured-content .entry-header, .grid .featured-content .entry-header { background-color: #aa3636; border-color: #aa3636; } -
Thank you so much! I also woke up to that black colour this morning, spent a whole afternoon trying to customise it. The code worked for me too. :)
-
- The topic ‘Change post background color in Twenty Fourteen’ is closed to new replies.
WordPress.com Forums 