Several times I have found a WordPress theme that I like but which ‘fails’ in one respect. That is, that the theme customisations say that I can change the background colour, but when I change it, it changes the colour behind the content.
That is not what I want. I want to change the background colour of the outer container and only the outer container.
i know that CSS customisation allows more flexibility, but I am not talking about theme upgrades, but just what is possible out of the box.
If you are not sure what I mean, here are three screen grabs of another WordPress.com website with three versions of the background colour.
You can see that the text on the page become more or less unreadable with a darker background because the colour ‘invades’ the whole site.
The theme is the new ‘Oxygen’ theme that has just been showcased by WordPress.
I read the article about the new theme and decided to use it for another of my blogs, which is at OverlookedObjects.
That’s a blog is a where I post various images that are on my desktop.
(Until I tried Oxygen, I was using the very simple Autofocus theme.)
Background Versus Outer Container
If you try different themes, it is useful to know that this ‘invasion’ of colour is the effect that one gets with some themes, but not with all of them.
However, it is the reason that I held off trying a different background colour with the Origin theme that I am using for this blog at Light Reading. I thought it would mess up the site – but it hasn’t.
Instead, when I tried it this evening I found that the colour only covers the outer container.
And so, the simple way that I can add colour to the outer container is an added reason to stick with this theme.
Another Solution To Making Plain-Coloured Backgrounds
The fact is that there is another solution to making a background colour for themes like Oxygen and that is to make a small gif or JPEG file (say 50x50px) in the colour you want – and upload it as a background. That works because it only fills the outer container and it tiles to fill the browser window – like you can see here.