AndreaNobili
AndreaNobili

Reputation: 42997

How to correctly use get_template_directory_uri() WordPress function to load an image that is in a subfolder of my theme?

I am pretty new in WordPress and I have the following doubt about how to insert in my homepage an immage that is in a subfolder into my theme directory.

So I have the following situation: Into my custom theme directory I have the following folder that contains a jpg immage: /assets/img/flexslider/flex-1.jpg

Now in my header.php file I have something like this:

   <li>
       <img src="assets/img/flexslider/flex-1.jpg">
       <div class="flex-caption">
           <p class="flex-caption-text">
               <span>Lorem ipsum</span><br>
               <span>sit dolor</span><br>
               <span>adipiscing elitur</span>
           </p>
       </div>
   </li>

Obviously, when I load the page, the immage flex-1.jpg is not loaded because there is not the right path (infact using FireBug I obtain that it try to load the assets/img/flexslider/flex-1.jpg immage) so I think that I could use the absolute path but this is pretty orrible !!!

So I am thinking to use the get_template_directory_uri() function provided from WP to do this and I have try to change the previous code in this way:

   <li>
       <img src=<?php get_template_directory_uri().'/assets/img/flexslider/flex-1.jpg' ?>>
       <div class="flex-caption">
           <p class="flex-caption-text">
               <span>Lorem ipsum</span><br>
               <span>sit dolor</span><br>
               <span>adipiscing elitur</span>
           </p>
       </div>

But don't work and using FireBug I can see that load nothing, infact in my brower source code I have:

<img src="">

Why don't work? What am I missing?

Tnx

Andrea

Upvotes: 8

Views: 59204

Answers (3)

squarecandy
squarecandy

Reputation: 5107

You can also use:

<img src="<?php bloginfo('template_url'); ?>/images/yourimage.jpg"> 

Upvotes: 0

Lab
Lab

Reputation: 1063

please try :

<img src="<?php print(get_template_directory_uri()); ?>/assets/img/flexslider/flex-1.jpg" />

just check for slash, if double before "assests", remove static one.

Upvotes: 3

Anjana
Anjana

Reputation: 499

I hope it will work:

<img src="<?php echo get_template_directory_uri(); ?>/assets/img/flexslider/flex-1.jpg" />

If your assets folder inside theme.

Upvotes: 18

Related Questions