Why my images aren't showing up on CPT? - html

Question

My image wont show up on my CPT.
I'm using this code in my css to display in my CPT on WordPress.
.list-single.single {
background: url('images/highlights man.png');
height: 40px;
width: 40px;
display: block;
}
This is the CPT code that i use in the cpt to show the image.
<li class="slide">
<div class="list-image single"><span class="list-single single"></span></div>
<h1 class="block-heading left mobile small"><?php echo $text; ?></h1>
</li>
this is the file name of the image.
Could someone tell me what is wrong?

Answer 1

That is because you've uploaded the image using WordPress, but you've referenced it using css from a static folder inside your theme.
Now, if this image isn't being used as an image inside your custom post type as a featured image, or an image in a post, but rather as a decorative part of the post type on the front end, you should place it inside your theme. Preferably inside an /images folder.
Say your theme folder structure looks like this:
index.php
style.css
\css
\js
\images
Higlights-man.png
then placing in your style.css
background: url('images/Higlights-man.png');
should point to the correct file.
Never upload images through WordPress, and use the direct path in your css for such things, as the uploaded images can easily be deleted by mistake, our you could change folder structure of your installation, and that path would no longer be valid.
Any static image that is used in a theme, should be inside an /images folder.

Answer 2

You have written wrong name of image.
It should be like this:
background: url('images/Higlights-man.png');
and if the image is in upload directory then you have to use fully path some thing like this:
background: url('http://example.com/wp-content/uploads/2017/01/Higlights-man.png');