I’ve been reading a lot of blog posts about custom fields for Wordpress and have noticed on every post I have read they tell you how to successfully create custom image fields but they do it, to me, the hard way. I realized this work-around when I was creating GymDJ.com. My method is good for blogs that will have an consistent image in a regular spot, such as a thumbnail or post header.

Method One is a valid way to produce a custom image field.

<img src=”<?php echo get_post_meta($post->ID, “Image”, true); ?>” />

Here’s the problem, on the back end you’d have to put the full string in the value box, such as http://www.eleven82.com/wp-folder/themes/themes-name/images/image.jpg. That’s a lot to remember.

My method uses template url.

<img src=”<?php bloginfo(’template_url’); ?>/images/<?php echo get_post_meta($post->ID, “Image”, true); ?>”  />

By adding <?php blgoinfo(’template_url’); ?> snippet it inserts the URL of the template directory into the template output. So it adds “http://www.eleven82.com/wp-folder/themes/themes-name/” to your output. Typically all images are kept in an images folder but you can add as many folders as you need to reach your file. For example, if you wanted a thumbnail image and it was stored in the images folder then thumbs folder, you would add ‘/images/thumbs/’ then the rest of the custom field code. On the back end you would add your file name to the values box (ie. images.jpg). And you’re done.

Note: You can also replace template_url with template_directory and it would have the same effect.