Docs

[AndyDaupert]

I have added css to put a background image in the footer top and bottom. The image shows up on the homepage, but not on other pages. Also, using Inspect Element, when I hover over the image name, it is not loading on the other pages. I am not getting it…help?

http://wolfeandswickard.com/mainsite/
WP: 4.6.1
X: 4.6.4
Cornerstone: 1.3.3

[Lely]

Hi Andy,

Please use complete URL for background image.
Your site is in this folder: mainsite.
Your image url is http://wolfeandswickard.com/mainsite/images/footer-texture.jpg
CSS background image is declared as this:

.x-colophon.top {
    background: url(images/footer-texture.jpg);
    background-attachment: fixed;
}

Your homepage URL is http://wolfeandswickard.com/mainsite/ so when the CSS is added it will be looking for http://wolfeandswickard.com/mainsite/images/footer-texture.jpg which is the correct image URL.
On inside pages like About it will look for this image http://wolfeandswickard.com/mainsite/about/images/footer-texture.jpg. The page permalink about is added to the URL of the image thus is incorrect. Please update your CSS to this:

.x-colophon.top {
    background: url(http://wolfeandswickard.com/mainsite/images/footer-texture.jpg);
    background-attachment: fixed;
}

Or try this:

.x-colophon.top {
    background: url(/images/footer-texture.jpg);
    background-attachment: fixed;
}

The slash means that it will look for the images folder on the your wordpress root folder which is mainsite.

Hope this helps.

[AndyDaupert]

Argh, of course! I was trying to keep my code short. Thank you!

Note: I did try the “/” before “images” but it did not work.

[Prasant Rai]

You are most welcome. 🙂

[Author]

Posts