
10 Awesome Things To Do With WordPress’ Custom Fields
Posted on 28. Jul, 2009 by Alex Denning in Theme Development
Custom fields are what turns WordPress from a blogging platform to a CMS. Want to do just about any project on WordPress but not sure it is up to the job? Custom fields are the answer. In this post, there are ten awesome things to do with custom fields in WordPress.
1. SEO your title tag (<title>)
Search Engine Optimisation, or SEO is something that a lot of bloggers get obsessed about, whilst others think it’s a load of rubbish. I’m halfway between the two – whilst I believe that you can change certain things to better SEO your content, such as adding H1, H2 etc tags in the appropriate places, I personally don’t think you should get too carried away with it. One of the things you can do though is change your title tag, and this custom field trick will let you set a custom field and it’ll appear as your title tag. Add the code below to your header.php file:
- $title = get_post_custom_values("Title");
- if ( is_array($title) ) { ?>
- <?php echo get_post_meta($title->ID, "Title", true); ?>
- <?php } else { ?>
- <?php the_title(); ?> | <?php bloginfo('name'); ?>
- <?php } ?>
Then, you can create a custom field “Title” and it’ll appear as your title! If no custom field is set then a bog-standard title is displayed.
2. Create an e-Commerce site

CSS-Tricks’ Chris Coyier made a screencast recently – “Advanced Uses for Custom Fields in WordPress” – in which he walks through using custom fields to make an e-Commerce site. Pretty neat.
3. Display a customised excerpt
Whilst WordPress’ the_excerpt is great, if you want to have two different lengths of excerpt, it’s not so good – the solution – a custom field! Create a custom field “excerpt_two” and then display it in your theme with the code below:
- <h2>4. Display a thumbnail (and auto resize it)</h2>
- Whilst there are a number of ways of displaying thumbnails, this is still my favourite (even if it does require the most work!). First, upload timthumb to /wp-content/themes/yourtheme/ and create an image 250px by 250px with your site’s logo and upload it to yourtheme/images/. This is the image that will be displayed if no custom field is displayed. Then, for every thumbnail, you’ll need to create it in Photoshop and upload it to your blog. Next, create a custom field ‘Image’ with the path of the image as the value of the custom field. Now for the code:
- <pre lang="enc__php"><?php $postimageurl = get_post_meta($post->ID, 'Image', true);
- if ($postimageurl) {
- ?>
- <img src="/scripts/timthumb.php?src=<?php echo $postimageurl; ?>&h=250&w=250&zc=1" alt="">
- <?php } else { ?>
- <img src="/images/no-image.jpg" alt="No image available" />
- <?php } ?>
5. Create a post series
This is something that I wished I’d thought of a long time ago – show other posts in the same series using not a plugin but custom fields. All you’ve got to do for this trick to work is create a custom field ‘Series’ with a link to each other post in the series. Each post must be a seperate custom field. Then, use the code below to display all the other posts in the same series! (hat off to Jeff Starr for the code)
- <h3>Also in this series:</h3>
- <ul>
- <?php foreach($series as $series-post) {
- echo '<li>'.$series-post.'</li>';
- } ?>
- </ul>
6. Display additional information in posts

Whilst building the new version of ZoKnowsGaming, Lorenzo (the site’s owner) and I decided we needed a way to display additional content in reviews without too much hassle. The solution? Custom fields! But not just custom fields, custom fields with custom write panels to make it even easier to enter information. Again, code below will get you something looking like the pic above. Pass microsoft certification in day! Our online training is best alternate to in personal scjp and mcp classes. You’ll need custom fields goodpoints and badpoints.
- <span class="entry-author">
- <b>Plus points</b> -
- <?php $values = get_post_custom_values("goodpoints"); echo $values[0]; ?><br />
- <?php } ?>
- <?php if ( get_post_meta($post->ID, 'badpoints', true) ) { ?>
- <b>Minus points</b> -
- <?php $values = get_post_custom_values("badpoints"); echo $values[0]; ?>
- </span>
- <?php } ?>
7. Display additional meta information
Whilst WordPress does allow you to display a fair bit of meta info, you can never have too much; use custom fields and you can have as much meta data as you like! For example, if I wanted to say “this post is tagged x, and when this post was written, it was [weather] outside. Then I’d need the following code and a custom field ‘Weather’.
- and when it was written it was
- <?php $values = get_post_custom_values("Weather");
- echo $values[0]; ?> outside.
8. Save yourself using a ‘featured’ category
What with magazine themes being ‘teh most popular and teh bestest’ themes you can get at the minute, a lot of blogs will be finding themselves with a ‘featured’ category so that the most popular posts on their site can be easily displayed for viewing pleasure. Thing is, I’ve got a tip: use custom fields instead! Never have to worry about ‘Featured’ being displayed on your navigation becuase you forgot to exclude it from list_categories! The code is below, from WPRecipes. For your ‘featured’ posts, add the custom field ‘featured’ with the value 1.
- while (have_posts()) : the_post();
- $customField = get_post_custom_values("Featured");
- if (isset($customField[0])) {
- //Custom field is set, display post info
- the_title();
- the_excerpt();
- }
- endwhile;
- endif;
- ?>
9. Get custom fields outside the loop
Another nice tip from WPRecipes - get custom fields outside the loop! Wow! Code below.
- global $wp_query;
- $postid = $wp_query->post->ID;
- echo get_post_meta($postid, 'customField', true);
- ?>
10. Automatically get the first image in a post (for the homepage etc), but not if a custom field exists
A slightly long-winded title, but this trick really is great; what it does is get the first image in a post for displaying on the homepage, but it first checks if a custom field ‘Image’ exists, and if it does, then that image gets displayed. Neat, no? You’d want to use this, say, if you were developing a magazine theme then you could give your users the option of having an image automatically resized, but if that ends up cutting off an important part of the image (ie someone’s head), then users have the option of cropping the image themselves.
The first thing to do is to add the code below to your functions.php file:
- // Get URL of first image in a post
- function catch_that_image() {
- global $post, $posts;
- $first_img = '';
- ob_start();
- ob_end_clean();
- $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
- $first_img = $matches [1] [0];
- // no image found display default image instead
- if(empty($first_img)){
- $first_img = "/images/default.jpg";
- }
- return $first_img;
- }
- ?>
A quick bit of dissection. The first line is saying if the custom field exists, paste that here. If it doesn’t then go and fetch the first image in the post and use timthumb to resize it. You’ll need timthumb installed at /wp-content/themes/yourtheme/scirpts/timthumb.php
Wrapping up
And there we have it. 10 awesome things to do with WordPress’ custom fields. Hopefully it has given you a couple of ideas on how to use custom fields, and if it has, why not share said idea with a comment below?
Related posts:

Enjoyed the post? We'll see you on Twitter or in your RSS reader!

Alex Denning is the founder of WPShout. A WordPress developer from London, Alex co-founded WPShift at the start of 2010 where he sells awesome WordPress themes.
You can find Alex on Twitter and at AlexDenning.com.
35 Responses to “10 Awesome Things To Do With WordPress’ Custom Fields”
Trackbacks/Pingbacks
[...] on my blog, WPShout I published ‘10 Awesome Things to Do With WordPress’ Custom Fields‘. This morning I awoke to find not a single comment on the post. I was disappointed as the [...]
[...] on my blog, WPShout I published ‘10 Awesome Things to Do With WordPress’ Custom Fields‘. This morning I awoke to find not a single comment on the post. I was disappointed as the [...]
[...] Bloggern nicht besonders beachtet. Dabei haben sie bei WordPress einige mächtige Funktionen. Wpshout.com hat ein paar der Möglichkeiten, die man mit Custom Fields hat, zusammengefasst. Tags: blog, Custom Fields, [...]
[...] Wpshout.com hat ein paar der Möglichkeiten, die man mit Custom Fields hat, zusammengefasst. Tags: blog, Custom Fields, [...]
[...] if you are using WordPress to run your Website or Blog, you know how powerful of a platform it is. Here are 10 Awesome Things To Do With WordPress’ Custom Fields to help make your web destination bigger, badder & [...]
[...] Hacks to Encourage User Interactivity 7 examples of innovative effects and techniques in webdesign 10 Awesome Things To Do With WordPress’ Custom Fields Essential WordPress Plugin: Add To Facebook Preventing Widows in Post Titles @font-face and 15 [...]
[...] 10 Awesome Things To Do With WordPress’ Custom Fields [...]
[...] using and all the options available to you:"A Beginner Guide To WordPress Theme Development"10 Awesome Things to do with WordPress’ Custom FieldsCreating the perfect widget ready WordPress themeWordPress’ Template File Hierarchy [...]
[...] and various other areas of the theme.4. Don’t use custom fields unneccesarilyWhilst I do love custom fields, I don’t love using them unneccesarily. If you’re making a magazine theme such as the [...]
[...] your blog and its ranking in search engines. Enjoy!If you’d like to do some further reading:10 Awesome Things to Do With WordPress’ Custom FieldsWordPress Custom Field Tutorial, Part 1 and Part 2Custom “Read More” LinksThe [...]
[...] your blog and its ranking in search engines. Enjoy!If you’d like to do some further reading:10 Awesome Things to Do With WordPress’ Custom FieldsWordPress Custom Field Tutorial, Part 1 and Part 2Custom “Read More” LinksThe [...]




Jim Atwood
29. Jul, 2009
Thanks very much for this excellent article. I in fact use custom fields extensively in all my blogs and find your ideas very useful.
.-= Jim Atwood´s last blog ..Kanji in Effect Japan =-.
Illi.Pro
30. Jul, 2009
Hey nice tips! i wanna to know something.. like it’s possible to create another excerpt (like in the 3rd tip – 3. Display a customised excerpt), it’s possible to create another “
” style? so i can haveandwith differents styles, if you know it will be fantastic.Regards.
.-= Illi.Pro´s last blog ..Convertir un archivo (lista de reproducción) .wpl a .m3u =-.
Alex Denning
30. Jul, 2009
You could do something like ‘if custom field exists use that as an excerpt, if it doesn’t then use the standard excerpt.
Stuart
30. Jul, 2009
Great post Alex and glad to see you recovered it after yesterdays server gremlins ate it
.-= Stuart´s last blog ..Create an Options Page For Your WordPress Theme =-.
Alex Denning
30. Jul, 2009
Me too
. There’s still a post from last week missing that I haven’t got a copy of; if anyone has it in their RSS reader it’d be great if you could email me through the contact form.
Alex Denning
31. Jul, 2009
Ta. Still missing a post, which is annoying, but these things happen.
FAQPAL
05. Aug, 2009
Wow, great post. These are some great code snippets for all bloggers.
.-= FAQPAL´s last blog ..HOW TO: Build Your Companya4s Profile on LinkedIn =-.
Alex
06. Aug, 2009
Haha, I only have a thumb for my posts trough custom fields and I tweet my blog posts trough them. Thanx for the list, I will implement some on my next wp projects
.-= Alex´s last blog ..Blog promotion: The social media alternative solution for small blogs =-.
Dave Sparks
25. Aug, 2009
Just working on a wordpress site at the moment and custom fields are hugely useful. If you’re building for a client I’d also look at using something like the more fields plugin (http://wordpress.org/extend/plugins/more-fields/) to control how they use them.
Alex Denning
25. Aug, 2009
Or even better, read WPShout’s latest tut and build ‘more fields’ into your WP theme.
Arlene
25. Aug, 2009
This information could not have come at a better time, I am doing my first project with wordpress as the sole cms….thank you!
Alex Denning
25. Aug, 2009
Not at all! Glad you liked it
. Be sure to grab the RSS feed for future updates.
Comment Guidelines Violation 4
25. Aug, 2009
Wow I really wish I had known about these techniques when I first started building sites. Thanks for sharing, I’ve bookmarked the post!
Dan
Module23 Werbeagentur Koblenz
03. Sep, 2009
Interesting snippets for WordPress users. Thanks for sharing.
martijn
20. Oct, 2009
does that first one really work like that? doesn’t it have to be:
ID, ‘title’, true);
if ($title) {
?>
|
???
can’t figure out where the vars post-img and postimageurl come from…
Alex Denning
20. Oct, 2009
You’re quite right. That was me being an idiot and not changing the code from the project I copied it from!
John
04. Jan, 2010
Really interesting. Perhaps, Custom Fields are the most unkown functionality of wordpress.
Gary
20. Feb, 2010
Very useful summary of idea thanks, I think a couple could be turned into nice plugins
Matt Orley
30. Apr, 2010
I’ve started using dates in custom fields, and doing calculations on how many days since, till, certain events. Custom Fields let my programming side come out!
Miles Elliott
03. Jun, 2010
Very nice, just one thing, from number four
<img src="/scripts/timthumb.php?src=&h=250&w=250&zc=1" alt="">has the wrong variable referenced for the timthumb script, it should be $postimageurl instead of $Image
Alex Denning
05. Jun, 2010
You’re quite right, thanks for pointing it out.
matt
23. Jun, 2010
Best article I’ve seen on custom fields… super awesome wicked.
Gemma
03. Aug, 2010
Do all of these tips work with the latest version of WordPress (3.0.1)?
Marcelo Mizuno
05. Aug, 2010
Awesome article. Thank you Alex.