Images won't display on customized home page

The image urls aren’t correct, they need to be updated to point to the right location. Try putting get_stylesheet_directory_uri() before the image path.

Like csloisel said, the image paths are not correct. For instance one of the images has this as its src attribute: images/M3.JPG

So the browser is interpreting this as https://www.paulabenitezruiz.com/images/M3.JPG which is obviously incorrect.

Ok, thanks for that! I see what you mean. I supposed it has something to do with the way i was linking those images. So, I couldn’t make it work yet. This is the case of my hover effect image links:

.urlImg01 { width: 153px; height:137px; display:block; background-image: url('images/home01-2.png'); }
.urlImg01:hover { background-image: url('images/home011-3.png');
}

where should I paste that get_stylesheet_directory_uri()?

Pd. I’m sorry if I sound very dumb :S I just need to learn!

Well you can’t use that code in a stylesheet, you need to use the relative path to the stylesheet. Where is your images directory located?

get_stylesheet_directory_uri() will go in the PHP code where you have the img tag.

For instance if in the php file of your theme you currently have this code:

<img src=”images/M3.JPG” />

You will have to change it to this:

<img src=”<?php echo get_stylesheet_directory_uri(); ?>images/M3.JPG” />

This way when you load the page in your browser the full path will be something like:

<img src=”https://yoursite.com/wp-content/themes/your-theme/images/M3.JPG&#8221; />

Csloisel, my images remain at the same folder where I worked with my child theme… mamp>htdocs>wordpress>themes>my theme>images

Hssan Akhtar, I tried <img src=”<?php echo get_stylesheet_directory_uri(); ?>images/M3.JPG” /> and it didn’t work.

There are two reason why <img src=”<?php echo get_stylesheet_directory_uri(); ?>images/M3.JPG” /> didn’t work.

First there should be a / before images. My bad. Like this:

<img src=”<?php echo get_stylesheet_directory_uri(); ?>/images/M3.JPG” />

Secondly you can’t have spaces in the name of your theme’s zip file. Right now the theme name is ‘mi temita 4enero’. You should change it to mi-temita-4enero.

Lastly make sure there is a folder images inside mi-temita-4enero that contains M3.JPG.

-I updated the link with the extra /,
-I changed the theme name so it didn’t have spaces.
-M3.jpg is at the images folder.

this was in my css part
.imge {
<img src=”<?php echo get_stylesheet_directory_uri(); ?>/images/M3.JPG”/>
}

this was in my html body
<div class=”imge”>hi</div>

and still didn’t work ??

That’s not at all what I suggested.

What you have added to your CSS file isn’t even valid CSS.

You have to add <img src=”<?php echo get_stylesheet_directory_uri(); ?>/images/M3.JPG”/> in your php file.

I’m sorry, my explanation was wrong. I didn’t add those codes to my css file, but to my front-page.php file.

I added this to the .php file.
.imge {
<img src=”<?php echo get_stylesheet_directory_uri(); ?>/images/M3.JPG”/>
}

and this also in the php file:
<div class=”imge”>hi</div>

My last post was totally wrong… I have been looking through how other themes do it with their link images and I found something like this:

<div id="logo">
        	<a href="<?php echo home_url( '/' ); ?>"  title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">

                 <?php if ($gridly_logo != '') {?>
                 	 <img src="<?php echo $gridly_logo; ?>" alt="<?php bloginfo('sitename'); ?>">
                 <?php } else { ?>
                       <img src="<?php echo get_template_directory_uri(); ?>/images/light/logo.png" alt="<?php bloginfo('sitename'); ?>">
                 <?php } ?>
            </a>

       </div>

I have tried doing something similar in my page, but It didn’t work.

Hey! I finally made it work! ??

I made it simple. I found the path. I uploaded the images to the uploads folder in WordPress, and after I just linked the images using:
<img src=’https://www.mysite.com/wp-content/uploads/2015/01/imagename.png’&gt;

Thanks a lot for your help!