I am trying to post little snippets of help as I remember them and this issue was a bit annoying when I started out with wordpress but like most issues once solved it was pretty straight forward to fix, now a few clients have asked me about this too so here is the issue and solution.
The Issue
Trying to insert an image into a file (not using the wysiwyg editor, but manually coding it) and the relative image path is not looking into the right folder for the images for example:
<img src="../../images/facebook.png" alt="Facebook" />
The Solution
My solution for this was to try and form the whole image url without making it relative thus making the path a lot more reliable. Using the bloginfo() function you could retrieve the directory that you needed, so for most themes you would form the image path like this:
<img src="<?php bloginfo( 'template_directory' ); ?>/images/facebook.png" alt="Facebook" />
In some cases you might have a child theme and need to point the image towards the child themes image directory, in which case the code would look like this:
<img src="<?php bloginfo( 'stylesheet_directory' ); ?>/images/facebook.png" alt="Facebook" />
Obviously this is presuming your images are kept in a directory called ‘images’ you can substitute this folder name for your own name if it different.
Leave A Comment