Img Src File path issue

by

To get images loaded correctly when I use img src in HTML, I have to give the entire file path. Using CSS I would only need to use:

`background-image: url(images/morebutton.png)`

With img src I have to use this: 

<img src="https://wordpress.stackexchange.com/questions/110004/wp-content/themes/blankslate/images/morebutton.png">

Using this file path gives me the image on the home page, however when I click through to the article page, the image doesnt load.. I’m having the same issue with my logo, it shows on the homepage, any additional pages it doesnt show.

Can anyone tell me if the file path setup I have is incorrect?

3 Answers
3

No your file path setup is correct, you need to provide the absolute path in you img src for images to load on other pages as relative path would change to,

 http://yourwebsite.com/page/wp-content/themes/blankslate/images/morebutton.png

and instead it should be

http://yourwebsite.com/wp-content/themes/blankslate/images/morebutton.png

So you should define a constant in your function.php for path to image directory, and then use it in img src.

  if( !defined('THEME_IMG_PATH')){
   define( 'THEME_IMG_PATH', get_stylesheet_directory_uri() . '/images' );
  }

and then you can use img tag as

 <img src="<?php echo THEME_IMG_PATH; ?>/morebutton.png" alt=""/>

That would solve your issue. You can use the constant anywhere in your theme, handy to use.

Leave a Comment