Tutorial Details
- Difficulty: Basix
- Technology: WordPress
- Estimated Completion Time: 5 Minutes
Today’s Basix video quick tip topic comes from a question on Twitter, concerning the use of custom fields in WordPress. Luckily, as you’ll find, attaching unique data to postings is as simple as assigning a value in the “Edit Post” page, and then referencing that information with the get_post_meta() method.
Prefer to watch this video on Screenr.com?
Step 1: Create a New Post
In your local testing environment, create a new posting in the WordPress admin panel, and scroll to the bottom, until you see the “Custom Fields” widget.
This section allows for a key, and a value. For example, if you aren’t taking advantage of the new “Post Thumbnail” feature, available in WordPress 2.9, and need a way to attach a thumbnail to each posting, this is where you’d accomplish that task. You could assign a key of “thumb,” and a value, which is equal to a path to the desired thumbnail. Go ahead and fill this section with some test data – anything you wish. I’ll use “difficulty” as my key,” and “hard” as the value.
Step 2: Edit Index.php
Now visit your theme, and within the WordPress loop in your index.php page, reference the get_post_meta() method.
<?php echo get_post_meta($post->ID, 'difficulty', true); ?><
This method accepts three parameters.
- The id for the desired post. You can use $post->ID or “the_id()” to insert this value.
- The key that you require. Remember, you can insert multiple custom fields. This is why we need to reference the key, in my case, “difficulty.”
- A boolean, which determines whether you want the information returned as a string, or an array. As I’m echoing out my value, I’ve chosen true (or string).
Step 3: What If…
If you view run the website, you’ll see the correct value. If you went with a thumbnail path in your custom field, make sure that you echo out that string from within an IMG tag, accordingly. However, there’s one problem here; it’s possible that not EVERY single post will have this “difficulty” custom field attached, yet we’re blatantly assuming that there will be. This is inefficient. Instead, why don’t we first create an “if” statement, and determine whether our desired key exists first. Smarter right?
<?php if ( get_post_meta($post->ID, 'difficulty') ) : ?> <small> <?php echo get_post_meta($post->ID, 'difficulty', true); ?></small> <?php endif; ?>
Conclusion
Custom fields are a staple in every experienced WordPress designer’s toolbox. Learn them, and use them! Thanks for reading or watching!
Enjoyed this Post?
Subscribe to our RSS Feed, Follow us on Twitter or simply recommend us to friends and colleagues!
By Jeffrey Way
Getting Good with JavaScript
Learn how to liven up your webpages, from start to finish. Veteran Nettuts+ author Andrew Burgess helps you Get Good with JavaScript.
Join our newsletter!
UberMenu - WordPress Mega Me ... only $14.00 
RoyalSlider – Touch-Enable ... only $12.00 
Kult House - More
Web Basix
Just getting started? Start with our basix tutorials on the fundamentals. View All Basix Tutorials
Create a Tutorial, Get Paid!
Have something to teach the world? Want to earn money doing it? Tutorials, screencasts, and articles published here on Nettuts+ are largely contributed by readers just like you! We'll pay you great money for good content. Find Out More
Nice tip, thanks!
So what’s the “easier way to use thumbnails” you are mentioning? Is it timthumb that you mean or something else?
I think he’s referring to the Post Thumbnail feature in WP 2.9?
Jeffrey was refering to the post thumbnail feature in WP 2.9+. Heres a nice tuts+ article on it…
http://net.tutsplus.com/tutorials/wordpress/quick-tip-how-to-use-the-new-post-thumbnail-feature-in-wordpress-2-9/
From a server load perspective would it not be better assign the value into a variable rather than querying the database twice?
@Prydie
very nice post thanks
Nice tip, I always wondered custom fields could be used for, but never really looked into it.
Thanks for this easy to understand quick tip. I would love to see an in depth tutorial on custom fields with multiple examples of uses. Keep up the great work — I love Net Tuts +
Cool, just another method on how to use WordPress Custom field, very splendid. Anyway, If you don’t mind in next quick tips, i would like to see you on how to create basic “Worpress option panel”.
-Thanks
Say i want to specify an image URL and ALT text in a single custom field to keep things organised (trying to avoid a massive list of custom fields) what would be the best way to store the URL and ALT value in one custom value field?
Cheers
Thank you for this i was just starting to use post meta and wondered how i could get rid of empty code. Thank you.
Very nice tip!
Cheers!
Custom fields have been tough task for me until i find and readymade template or theme which adds how to do guide like some photo gallery themes which adds custom field for uploaded image path etc..
Thanks for this short but complete easy to do guide which i have bookmarked for custom modifications…
There was some kid who made a thumbnail tutorial during that screenr launch competition that went over this in his “Create a Custom WP Thumbnail” tutorial, but it’s nice to see the idea focus directly on making use of any ol’ custom field.
GOSH JAY!
Great tutorial, I always wondered about the custom fields.
I wish this was on Itunes so I could watch it on my ipad. I hate having to bring my bulky lap to everywhere to look at videos.
Nice Tip. One thing though, you can make this a little more DRY:
ID, ‘difficulty’, true) ) : ?>
The code from my previous comment didn’t display correctly…here it is again, wrapped in pre and code tags:
ID, 'difficulty', true) ) : ?>
And just in case it still doesn’t display correctly, I’ve put it on pastebin: http://azizlight.pastebin.com/BZbZUGGq
Wow, I can see this enabling me to insert a lot of cool stuff into posts!
I think it’s generally more efficient to call each function once, so a better way to do it is actually to assign a variable inside the if statement and then echo this variable instead of calling the function again (in a 10 posts page with 2 custom fields per post, the script will call “get_post_meta” only 20 times and not 40).
ID, 'difficulty', true) ) != null ) { echo "" . $my_custom_field . ""; } ?>by the way.. how do you post formatted code here without it being stripped down?
Great tut, didnt actually know what to use it for before this!
What if I want to display this in my sidebar on the page. I want the user to add an image to the page and have it show in the sidebar.
Where do i declare the custom field? If I do it in the loop then it will be shown in the flow of the page?
Thanks
Nevermind I played with it and got it to work, if I can get it to display, the code i used is here:
ID, 'difficulty') ) : ?>
<img class="difficulty" src="ID, 'difficulty', true); ?>" alt="Icon for Post #" />
Great tutorial, I always wondered about the custom fields.as this is not easy for the new users.Custom fields have been tough task for me until i find and ready made template or theme which adds how to do guide like some photo gallery themes which adds custom field for uploaded image path etc..
Thanks again!! Another lesson done!
This is the second one… some to go…
Please, post some more!! =]
I hope you never stop! This is one of the best blogs I have ever read.Please keep it up because the internet needs someone like you spreading the word.