CODEWITHSUNDEEP
wordpressimage
Ryman Holmes
Ryman Holmes

Reputation: 756

Images not showing up on WordPress custom theme

I have a custom WordPress theme installed and my images are referenced as such:

index.php:

<img src="images/newlogo.png" height="110px" width="400px"/>

My images folder is relative to my index.php from which I have included the above code.

My images are not showing when I render the webpage in a browser, it is showing the default image not found thumb instead.

Image filepath:

wp-content/themes/my-theme/images/newlogo.png

Homepage (index.php) filepath:

wp-content/themes/my-theme/index.php

Upvotes: 0

Views: 2772

Answers (1)

Matt Gibson
Matt Gibson

Reputation: 38238

Your index.php is a template that will be loaded by WordPress's main entry point (at /index.php) and the code behind it; as such its URL won't be ...wp-content/themes/my-theme/index.php. You should use the WordPress method get_stylesheet_directory_uri() to find your theme's directory from any of your theme template files.

For example:

<img src="<?php echo get_stylesheet_directory_uri() ?>/images/newlogo.png" height="110px" width="400px"/>

Basically, any relative paths to images from a web page are considered as relative to that web page's URL. However, with WordPress templates, you can't know for sure what the actual URL will be -- your index.php template might (probably will) be used for many different pages on your site, at many different URLs. It could be used at the top level for a page at /about, and also for an entry at /blog/2014/01/05/typical-blog-post, for example.

WordPress handles both building the URLs and loading your template file into them appropriately. But this means that you can't depend on the URL of the template you're writing being a constant. Instead, WordPress provides a series of functions, like get_stylesheet_directory_uri(), to let you grab and output the correct URI to your stylesheet files as necessary.

Upvotes: 2

Related Questions