CSS background images in WordPress

Question

Is it possible to get a background image in CSS like you normally do in HTML when working with WordPress. I\'ve tried doing this but it doesn\'t work.

backgr         


        

Answer 1

As the others have suggested, you can simply set the background-image CSS property to do this.

However, none of the URLs that the other answers suggest worked for me.

I think the reason is because all of my images were stored in the "Media" area.

For all those who are storing your images in the "Media" area:

In order to find the URL to the image, you can:

1. Open the Admin dashboard of your site
2. Open the "Media" area
3. Click on the image you want to use
4. Copy the URL from the URL field, but only the portion after the domain name (e.g. domain-name.com)
5. Use this as your URL for the background-image property

I wouldn't recommend using the whole URL (using it without removing the domain name) because if your domain name ever changes, the URL will break.

Here's an example of what my full URL looked like: https://example.com/wp-content/uploads/2018/06/.jpeg, but I only used the /wp-content/uploads/2018/06/.jpeg portion.

In the end, my CSS property looked like this:

background-image: url("/wp-content/uploads/2018/06/.jpeg");

As a side note, the URL worked with both a beginning forward slash /wp-content/... and without one wp-content/....