Background for entire area of the page

BB Theme
1

I have a site I’m working on that requires a background texture (blue dots on a white background) across the complete site. (client request)

I have used the image, but I have to place it in the header/Nav-Bar/content and footer areas to cover the whole screen.
And of course where it joins it is never going show seamlessly, so you can see where the edges of those areaas are.

So I’m wondering if there is a way to place this background image in one place so it covers the complete page ?
TIA, Dave

2

Hey Dave,

You can actually place the background image under Theme Customizer > General > Background then remove the header, content and footer backgrounds so it can be seen. On the latest version, you can remove the header and footer backgrounds under their respective customizer panels but not the content background. That said, the only way to achieve that(removing content background), for now, is to use custom CSS. You can use the snippet below and it should do the trick!

.fl-page .fl-page-content {
    background: none;
}

On the beta theme though, this is already possible. You can just set the color value to blank and it will set it to transparent.

Hope this helps!

Edit: You may need to set the navigation background to none as well depending on the layout you have.

Ben

3

Thanks Ben, that is great…
Late here, but I’ll try that in the morning…
Regards, Dave

4

Hey Dave,

No worries! Let us know how it goes!

Ben

5

Hi Ben, reporting back that it works perfectly - thanks so much !
ps I was using the beta, so easy peasy :slight_smile:

6

Hey Dave,

Great! Have fun with The Beaver! :slight_smile:

Ben

7

I have an issue with this - using the latest beta so I have removed header and footer in theme. Then I have the image setup as background to the page.

Thing is - I get a white square all over where I put my content (e.g where it says “drop a row layout or module to get started!”). I can change this in the theme config - to a color or a picture. I want none… So I ended up using a picture that is transparent…

Works - but should have a none option I guess!

//J

8

Hey Johan,

On the color picker, you can delete the hex value and it should set it to none. Let us know how it goes! :slight_smile:

Ben

9

Yes - that works! Thought I did try that, might have missed to deselect the updated valuefield?

//Johan

10

Hey Johan,

That’s most likely the case. Once you delete the hex value, you can just click out anywhere on on the box(I usually just click the Header Background Color text). :slight_smile: Enjoy! :slight_smile:

Ben