Changing background image / for the post section

[dpalme]

If you look at the following url: http://www.palmeacres.com/blog/ you will notice that the header section of the blog post has a background image. I'm trying to find a way to make the entire section (left side and widget side) use the background image. I can't seem to find a css rule that encapsulates the header, left and right.

Am I missing something here or do I need to make a change to the css?

[sangfroidweb]

Hey there,
If I'm following you, you'll need to put the background on the .site-container-wrap element.....but then you will also need to make the background color of the .site-header element transparent so you can see the background image coming through from underneath.

On line 582 of the stylesheet add the background image to the .site-container-wrap

.site-container-wrap {
background: #fff url(/blog/wp-content/uploads/2017/10/body-bkgd.jpg) no-repeat 0 0;
border: 1px solid #e3e3e3;
margin: 60px auto;
max-width: 1140px;
}

On line 1254, make the background color transparent:

.site-header {
/* commenting this out - background: url(/blog/wp-content/uploads/2017/10/body-bkgd.jpg) no-repeat 0 0; */
background-color: transparent;
border-bottom: 3px solid #000;
}

Also to note...if you only want this to happen on this Blog page, instead of changing those declarations in the lines referenced above (which will affect ALL .site-container-wrap and .site-header elements), you will need to add the CSS with the declarations specific to the blog page by adding the .blog selector (see below)

.blog .site-container-wrap {
background: #fff url(/blog/wp-content/uploads/2017/10/body-bkgd.jpg) no-repeat 0 0;
border: 1px solid #e3e3e3;
margin: 60px auto;
max-width: 1140px;
}

.blog .site-header {
/* commenting this out - background: url(/blog/wp-content/uploads/2017/10/body-bkgd.jpg) no-repeat 0 0; */
background-color: transparent;
border-bottom: 3px solid #000;
}

Hope this helps! Let me know if this is not what you meant and we'll try to help you get it sorted out.
Thanks!
Liz

---

Liz or Eddy @SangFroid Web — Customizing StudioPress themes at http://www.wpstudioworks.com and building custom Genesis Child themes for businesses at http://www.sangfroidwebdesign.com 🙂

[dpalme]

I decided to try this on a diff site, so as to not mess with a production setup quite yet. It worked for the header and the left side, but the widget side is still showing white background. I will change it to full width and see how that works.

[dpalme]

It does fix it with the full width but if I leave the widgetized display on that still shows as white.

Also I don't see in the settings | reading section where I can set it to a static front page...

[Author]

Posts