Docs

[jsjmccracken]

Hello,

Question 1: On http://www.tablerockkennels.com/ I would like to change the background around the border. I know how to change what’s on the inside of the border but not what’s around it. I don’t want it to be white and I would like it to be an image if possible.

Question2: How do I change the color of the borders around the menu bar and footer from white to a different color?

Thank you,

Jacob

[John Ezra]

Hi Jacob,

Thanks for writing in! I think you already solved your first query. For the second one, the nav doesn’t have a border. That is coming from the site border. You can add this under Custom > CSS in the Customizer or in your child theme’s style.css file.

div#top {
    border: 1px solid #202020;
}

For the footer part you can add this too:

.x-colophon.top {
    border: 1px solid #202020;
}

Hope this helps – thanks!

[jsjmccracken]

My first query is the white behind the body, search bar, Facebook link and calendar. I’m not sure how to change the white to a different color and or image? As for the borders thank you!

[Nabeel A]

Hi again,

Try adding the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:

.x-sidebar {
    background: #000 !important;
    padding: 10px !important;
}

Let us know how this goes!

[jsjmccracken]

This is great for the side bar but I also want the white around the body to be a different color and or an image.

[John Ezra]

Hi there,

Thanks for updating the thread! Upon checking your site, you seem to have solved your issue already. We see that the area around the content is now black on our end. If you still need assistance, please do update us with more details. Thanks!

[jsjmccracken]

I’m wanting to change the remaining white outside the black and gray border to a different color and or image. Below the menu bar and before the gray border there is white around everything else. The white area is what I’m wanting to change.

[Friech]

Hi There,

To change that white body background, add this on your custom css

.x-boxed-layout-active .site {
	background-image: url('BACKGROUND IMAGE URL HERE');
}

Change the BACKGROUND IMAGE URL HERE string with your actual background image URL.

If you do also need to change that, white background around the header and footer, you can add the custom css below.

header .x-logobar,
footer.x-colophon {
	background-image: url('BACKGROUND IMAGE URL HERE');
}

Hope it helps, Cheers!

[jsjmccracken]

Thank you for the help!

[Paul R]

You’re welcome! 🙂

[Author]

Posts