Jazz Up Your Site: 28 Ways To Use WordPress Custom Fields

Are you tired of the boring old WordPress blog you’ve set up? The platform does have CMS capabilities, as 48 Unique Ways to Use WordPress proved, so you can create some pretty powerful websites and web applications. To do this, use a powerful but relatively underused WordPress feature known as Custom Fields, which allows you to add “meta” information for each post page and manipulate it with bits of HTML/ PHP code and WordPress functions.

Reasons To Use Custom Fields

You create a custom field, then choose on a post by post basis what information you will add. That information can be manipulated by custom WP/PHP code to present additional textual or visual content when a visitor views a post page. To summarize:

  1. Add metadata for reporting or other purposes.
  2. Add visually cohesive elements to your site.
  3. Manipulate information and control its display programmatically.
  4. Make global changes across all your posts with a single code change, instead of manually updating each post.

The lists below show some ways that WP custom fields can be used to provide more textual and visual info to your site visitors. If you decide to change something, say a border or background or even placement on the post page, without custom fields you would have to make changes manually to each and every post. If you have hundreds of posts, you’d have a daunting task. With custom fields, you have structure and homogeneity through custom handler code.

WP Custom Field Applications – Quick List

Here’s a quick list of possible applications for custom fields and handler code, provided for easy scanning. The same list is repeated below with details.)

  1. Add personal info.
  2. Use post expiration dates.
  3. Show navigation links for article series.
  4. Add text callouts in posts.
  5. Embed relevant affiliate ads in product reviews.
  6. Add a thumbnail to each post.
  7. Show a thumbnail gallery.
  8. Highlighted/ feature content.
  9. Asides or mini-blog.
  10. Add post icons.
  11. Add category icons.
  12. Portfolio or themes gallery.
  13. Provide a map, possibly floated.
  14. Show a related video/ video thumbnail.
  15. Add a slideshow.
  16. Insert an MP3 player.
  17. Add author info box.
  18. Log post metadata content.
  19. Create a freelance invoicing log book.
  20. Accounts payable log book for web publishers.
  21. Real estate leads log book.
  22. Show bibliography/ references/ footnotes.
  23. Provide a timeline.
  24. Website ad handler.
  25. Contact management.
  26. CD/DVD/ print media collection log.
  27. File attachments.
  28. Hide premium content for paid users.

Some things to keep in mind:

  1. Custom fields are used for storing information that you’ll (typically) use en masse in most/all of your post pages. You will be handling custom field values the same way for each post – whether that’s to display content or produce a report elsewhere. Since you can store text, code, URLs, they provide the basis for some robust applications.
  2. You can use a custom field key more than once in the same post.
  3. WordPress does update your site’s database in order to store custom field information. Most of the applications above do not require any additional manual database table changes, but some may.

WP Custom Field Applications – Detailed List

This is the same list as above, but with explanations of usage. Everything is based on either real online examples or on an educated guess. Links to examples or how-to articles are provided when available. (Note: A “key” is the name of a custom field. A “value” is a key’s value, which can be text, code, or a URL. “Handler code” is the code block of HTML/ PHP/ WP functions that you write to manipulate your custom fields.)

1. Add personal info to a post

This is the most basic use, which is the example given in the WordPress Codex for using custom fields. Info you might add is your mood while writing a post, any books you’re currently reading, the weather, etc. You can make the presentation of this info as simple or as fancy as you like.

2. Use post expiration dates

For some sites, you may want to have a post to “expire” at a certain point. This might be for a classifieds site, job listings, event listings, or a poll. The custom field would specify the expiration date, and the handler code would simply filter out expired posts, not displaying them. (This isn’t a recommended use. It’s better in terms of search engine rankings to just leave posts as they are, or possibly apply a password after an expiration date. This way, the page does not cease to exist.)

3. Show navigation links for article series

If you write a lot of articles in series, you can use a custom field to auto-link articles in a given series. Use a custom field key such as “series name”. Choose a unique series name for each series, then use that name as the value of the key in each post.

4. Add text callouts in posts

Break up longer posts visually by displaying a fancy text callout. A custom field would contain the callout text, and the handler code would apply display style rules, including borders, font elements, positioning, etc.

5. Embed relevant affiliate ads in product reviews

If you’re profiling or reviewing a something like a book or a music CD, you can use a custom field to display an Amazon snapshot and affiliate product link. See Justin Tadlock’s custom fields article series for book reviews for an example.

6. Add a thumbnail to each post

Have a look at most “magazine style” WordPress themes (such as The Morning After) and you’ll see a block labelled “Recent Posts” or something of that sort. Usually such posts will have a small thumbnail image, square or otherwise. These thumbnails only appear (depending on the theme you’re using) when new posts pus a post out of the “feature content” block and into the “recent/ archive content” block.

7. Show a thumbnail gallery

Extend the last use by displaying a mini-gallery of related images for a given post page. Each page can have it’s own optional mini-gallery by using a comma-separated list of image URLs as the custom field key’s value. You can enhance these mini-galleries by adding a lightboxing plugin (such as Fancy Zoom, discussed previously) so that clicking on a thumbnail floats a larger image.

8. Highlighted/ feature content

The Morning After theme, mentioned above, uses a second custom field to show a “Latest Post” image. You can also use a custom field and handler code to highlight a feature post with a related image, or even to add a caption to a feature image. You can do all this either to the single most recent post, or to the X most recent posts, where you decide what X is.

9. Asides or mini-blog

The Morning After theme also has an “Asides” block, which could be used as a mini-blog. Rhymedcode has how-to articles on implementing Asides and Mini-blogs. (Note: Mini-blogs are usually shown in navigation bars and Asides are in the content area, though there are other subtle differences.)

10. Add post icons

Use a custom field to publish an icon to visually differentiate posts with special content, such as for podcasts. (In fact, you could use a custom field to also store the podcast audio file URL and control the embedding in the handler code.)

11. Add category icons

You can extend the last use, post icons, to display a consistent icon for each post in a given category. (Though if you make it a habit to apply more than one category to posts, this will complicate your coding. You’ll have to decide whether to display icons for all categories or just one, for each post.) As a potential example, have a look at Tubetorial. While those post icons were done manually using custom fields, they could have been done as category icons.

12. Portfolio or themes gallery

Gallery sites, such as ones built upon OS Designer’s WP gallery theme, and portfolio sites rely on custom fields for handling and display of the initial image thumbnails.

13. Provide a map, possibly floated

If you’re running an events listing site, store an even address in a custom field, then use a map API (such as for Google or Yahoo) to programmatically embed a map where and how you want on the event post page. With a bit extra effort, and a lightboxing plugin that can handle more than just images, you can float the map upon click or mouseover. Get even more complex by using a map API to embed custom icons related to your post page.

14. Show a related video/ video thumbnail

Have a review site and want to automatically include a single video from YouTube (or any video site with an API)? Store a keyword/ phrase in a custom field and have the handler code retrieve the video embed code for the first video in the API search results. (This doesn’t guarantee that the video will be relevant, however.)

15. Add a slideshow

In the same way that custom fields are suggested above for programmatically inserting maps or videos, if you can find a suitable web-based slideshow service with an API (such as Google AJAX Slide Show, based on their AJAX Feed API), you can embed pre-built slideshows.

16. Insert an MP3 player

Use custom fields to specify one or more MP3 URLs, to be displayed in an embedded player. (How you write the handler code will depend on which player you use and how its API is defined.)

17. Add author info box

Multi-author site publishers may want to display an author info box on each writer’s posts. Store the author name and other data in custom fields and write handler code to apply display rules. If you want to include bios but do not want to store the text in a custom field in every post, store it in a text file on your web server and use a custom field for the bio URL.

18. Log post metadata content

If you have need of tracking metadata about a post page (such as word count, time taken to write, author info, pageviews by month, revenues earned, etc.), or are just obsessive about stats, custom fields are ideal for this. You can control whether or not to display the information, based on other factors. (For example, blog network builders might use this approach to monitor writer performance.)

19. Create a freelance invoicing log book

Set up a private, password-protected WordPress. For each article or other content that you have published elsewhere (whether online or not), create an entry on your private site as a post page. Add custom field info such as the URL of the published content (if applicable), client info, fee, payment status – all of which will appear as the private post content. You can also produce a summary report for a given month and write PHP code to email the invoice to the client, or even use the PayPal API to integrate invoicing capability. (You can extend this application to log other types of freelance work, not just writing.)

20. Accounts payable log book for web publishers

This is the flipside of the last use. If you publish websites and buy your content, you can use custom fields to track author info, payment account info,  payment fee, pageview count and measurement duration (e.g., for CPM bonus payments), and payment status for each published post. This info can be used to publish a summary as necessary.

21. Real estate leads log book

Real estate agents who are listing properties can use a customized entry page to record password-protected information about potential buyers (name, contact details, offer, offer period, commission rate). To make this a real “killer” application, a listing entry form could be designed for mobile devices. (If your phone has the ability, you could even snap and upload images of the property and upload them to be displayed as a mini-gallery. Some manual text entry might be required.) All relevant info about a property listing would be stored in custom fields.

22. Show bibliography/ references/ footnotes

If you are using WordPress for publishing research content or an article library, use custom fields for the reference info, to have greater control over the presentation. For example, you might display some icon or link that when moused over would float a box with the reference info. Or you might display reference info to only specific site members.

23. Provide a timeline

SIMILE’s Timeline is a DHTML-widget for displaying a draggabale timeline visualization of related events. Freshlabs offers a WP Timeline plugin, but a custom fields approach allows you to build and display a timeline on the fly (using DHTML and Javascript code). This can be useful if your event list is being updated constantly. (It appears that you can specify events in the future.) There are many time-based applications that you can launch off of this starting point, including integrating images and/or video with timeline events, to create interactive histories or web-based tutorials. E.g., build a draggable timeline of, say, Corvette models, using either images or video from YouTube.

24. Website ad handler

This is not exactly the same as an ad rotator, but it’s similar. Devise a notation to manually specify a type of ad for each post, use a custom field to store the ad tag, and have the handler code determine which ad to display. If you want to get more complex, you can use PHP string manipulation functions to convert specific keywords into text links paid for by sponsors.

25. Contact management

Design Intellection (formerly The Design Canopy) offers a free contact manager theme for WordPress, whose functionality revolves around a set of custom fields. You can apply the same approach to produce variations.

26. CD/DVD/ print media collection log

Use a dedicated WordPress installation, possibly password-protected, to build a record of your collectible items. Each “post” would represent a single item, and the custom fields would store info such as title, format, release date, artist/actor info, and your ownership info. Use handler code to apply consistent info display rules, depending on media type. (You could also design for mobile device access, so if you’re someone that buys a lot of media, you can avoid buying duplicate items.)

27. File attachments

If you have a site where every post offers some sort of attached content (say a PDF version, or an audio file), a custom field allows you to more easily embed the content. Use a consistent filename notation, in custom fields, that easily translates converts into a file URL for the handler code to embed.

28. Hide premium content for paid users

Much of the content listed in the above uses can be included directly within a post page. However, if you are running a site with both free and paid users, you can use custom fields to hide premium content. The handler code would check to see if a visitor is logged in and a paid member. If so, the premium content would be revealed to them.

Summary

If you’re using the newly-released WP 2.5, you might know that it offers something called a shortcode API. This API lets you define macro codes in your post pages and to expand them with custom handler functions you write. While this makes WP even more powerful as an all-purpose, low-end CMS, shortcodes do not replace the full functionality of custom fields.

Note that the custom fields applications above are hardly the only ones you can create with the appropriate handler code. The idea of using custom fields is to allow the programmatic handling of information. You can synchronize this approach with a variety of web services, in order to produce far more powerful examples, to push the envelope of WordPress usage.

Comment with Your Facebook Account

Comments

  1. Ryan Caldwell says:

    wow. thanks for all the hard work you put into this article Raj. Makes a few of my upcoming jobs much easier.

  2. Thanks for sharing, Raj.

  3. Raj Dash says:

    I will expand on (almost) any example in a future post, if there are any requests.

  4. The 28 ways to improve a blog was loaded with content. What affiliate program would you start with if you only wanted to add 1?

  5. Raj Dash says:

    Greg: I’m not sure what you’re asking. Is that in reference to item #5, 24, or something else?

  6. Raj Dash says:

    One other powerful reason to use custom fields: it gives you the ability to add semantical value to various bits of data. The semantic web is aided by content that is structured, and this can be achieved by applying markup tags to info that is otherwise just a block of characters (to a computer, that is).

  7. Great jazzify list Raj

    Another cool tool is zoom on image hover with Magic Zoom. It’s free for non-commercial blogs.

    If you’re using WordPress, you can also add nicely formatted social bookmark links. It’s free.

  8. Thanks for your sharing, This is a great post

  9. webmann says:

    Raj, it’s great to get info that is just what I need to know to do a better blogging job.

    It’s going to take a few minutes to absorb this post and then I have read 48 Unique Ways to Use WordPress.

    RSS feed readers make it so much easier to find useful content.

  10. Raj Dash says:

    I’ll be expanding a select few of these uses in more detail, in the near future. If there are any requests, I’ll consider them.

  11. Hi,

    here is a plugin that do the job :

    https://categoryicons.wordpress.com

  12. Raj Dash says:

    Submarine: Thanks, but the idea in this post is what you can do with WordPress Custom Fields, not WordPress plugins.

  13. Marcel Pamphile says:

    Nice article

    I’m wondering how much data can these custom fields can support – without slowing down.

  14. Raj Dash says:

    Marcel: I was wondering that myself. I’m working on a project where any given post (about 100-200 posts) might have 6-20 custom fields. But the site itself is only for research, so it won’t have a lot of traffic.

    However, look at it this way. Custom fields are really just database entries. All custom fields are, I beieve, stored in the same database table and “joined” with post id. I can’t see why this would slow things down significantly over, say, having thousands of posts, or getting a spike in traffic. Of course, only a true bench test would prove anything.

  15. Marcel Pamphile says:

    Indeed Raj. I’m a Drupal guy… But I’m very interested in any information you guys have about stress testing WordPress custom forms.

    Drupal had flexinodes but it had database issues. Drupal killed flexinodes and developed something better called CCK. CCK forms can handle any amount of data.

    But I am still VERY interested in WordPress custom form capabilities, so tell me more.

  16. Marcel: I do plan to post more articles here at Performancing about custom fields, and as I absorb more knowledge about their limits, I’ll probably post that over at my codeprofessor.com site (which is currently dormant). Otherwise that info would be too geeky for Perf.

  17. Use EasyPermGals to simply list all the images of a post that you have attached.
    I use it to quickly share photos, without the need for any layouting. Create post, upload images, publish, finished.

    http://wordpress.org/extend/plugins/easypermgals/

  18. ThomasKr says:

    Is it possible to insert all the code into a custom field to post a clickable image in the excerpt? Otherwise there is no possiblity to insert HTML tags into the excerpt field in the editor.

  19. BoitesJaunes says:

    I want to create pages that will display it’s content and under that show articles in a certain category. I’m using the custom field to asign the category value.

    Example :

    (I want the “3″ from the category to be the value of my custom field, key name : “post_category”)

    ‘< ?php query_posts("cat=3&showposts=10"); ?>‘
    ‘< ?php while (have_posts()) : the_post(); ?>‘
    ‘< ?php the_title(); ?>‘
    ‘< ?php endwhile;?>‘

    How do I do that?

    Please help!

  20. Thanks for the link to my post.

    Another new idea I’m toying with is adding footnotes by custom fields. There are probably plugins to handle this, but why use a plugin when we could code it right into the theme ourselves?

    A technique that I’ve been using for a long time is defining the title, meta description, and meta keywords with custom fields. This way, I don’t have to use an SEO plugin.

  21. also, this is a link for a mini-guide about using custom fields for building a custom app

  22. 2 years old and still very relevant. Thank you for the TOOT!. I like Justin’s idea of adding footnotes by custom fields. I would interested to know if he ever did it…

Trackbacks

  1. [...] 18. Jazz Up Your Site: 28 Ways to Use Custom Fields [...]

Speak Your Mind

*

* Copy This Password *

* Type Or Paste Password Here *