If you’re familiar with WordPress in anyway, then you are probably familiar with posts. To the average user, posts work like blog entries. They have content and a date associated with them and they are displayed with these two bits of information (as well as a featured image, tags, categories, etc…).

If you haven’t read the first part of this tutorial, go read WordPress Custom Post Types so you have everything setup from that. You should have your custom Products post type setup and appearing on the backend of your website when moving on to this tutorial.

Meta Box

Meta Boxes are small boxes where you can add information that pertains to your post type. For our products page, we want to add a meta box that contains the product details for that product. This will include the price, seller, year, manufacturer, model, location and condition.

Create the Meta Box

The first thing we have to do is actually add the meta box to our post type. This can be done by calling the add_meta_box( … ) function and hooking it into the ‘add_meta_boxes’ action. The code can be found below with detailed comments on what each of the fields means.

Display the Meta Box Form

The next thing we have to do is display our meta box on the admin side of WordPress. This will appear when you click “Add New” or “Edit” a products post type.

Basically all we have to do is make a nonce using the wp_nonce_field( … ) function to make sure that everything is secure, then create an HTML form. The nonce field is used to validate that the contents of the form request came from the current site and not somewhere else.

By reading over and implementing the form created below, my hope is that you should be able to create your own meta box form for anything you need by modifying this one. Just use the same format but change the fields to what you want and add or remove them. It’s also nice to note that if you are having a lot of trouble programming a meta box, there are plugins out there that will create them for you.

The meta box should now appear when you click on the Products post type on your WordPress backend. Your form should look something like this (although it could be slightly different if you are using a different monitor size, so don’t worry about it if it looks a little more squished or something):

 Saving the Meta Box Data

The next thing we have to create is the function that saves our meta box data. There are 5 basic steps in our saving function:

1. Verify our nonce
2. Check if we are autosaving
3. Check the user’s permission level
4. Sanitize the input
5. Save the input

Verifying the nonce is done in two steps. First we check if its set, then we check if its valid. If we are auto saving then we don’t want to do anything in this case. This is because when auto saving our form hasn’t been submitted so we can’t get the values of our meta box inputs. This means the only way to save the meta box fields is to actually hit the “Publish” or “Update” button. Finally we use the sanitize_text_field( … ) and update_post_meta( … ) functions to sanitize our input and then save it.

Retrieving the Meta Values

The last thing to go over for this tutorial is how to retrieve the meta values for the post. There are a few different functions that will allow us get the meta values.

Let’s first look at the get_post_meta( … ) function. The get_post_meta( $post_id, $key, $single ) function takes in 3 parameters.

• The $post_id parameter is the ID of the post you want to get the meta value from. This works the exact same way as regular posts in the loop.
• The $key parameter is the named key of the meta value you want to retrieve. For example, if we wanted to get the price of our product, then the key would be ‘price’ since that’s what we named it in our show_dobsondev_products_meta_box( $post ) and dobsondev_product_listings_save_meta_box( $post_id ) functions.
• Finally $single is a boolean that if set to true then the function will return a single result, as a string. If false, or not set, then the function returns an array of the custom fields. The default value for $single is false, and I usually use it like that.

Below is an example shortcode that I’ve added to my plugin for displaying all the products on a page. Hopefully going over this will give you an idea of how to use the get_post_meta( … ) shortcode. If you don’t have a lot of experience with making shortcodes and want to learn more then you can check out my Create Your Own WordPress Shortcodes tutorial which should help you understand them.

The second method you can use to get your posts meta data is the get_post_custom( $post_id ) function. As you can see it only has one parameter, the post’s ID. This function will return a multidimensional array with all custom fields of the post. I personally prefer to use the get_post_meta( … ) just because it makes the code more readable when you go back to it. You can clearly see what you are calling and how it works.

Below you’ll find the example given in the WordPress codex for the get_post_custom( $post_id ) function. It traverses through the meta data and just echos it out.

Conclusion

Hopefully this tutorial along with Part I have given you a good understanding of how to create your own post type, add a meta box and values to it, and finally retrieve those meta values. This is definitely one of the more powerful features of WordPress if you expand upon it more, as is evident by the sheer amount of plugins that use custom post types to get extra functionality.

In a future tutorial I want to go over how to create templates for your custom post types since I simply didn’t have enough time in this tutorial. Once I figure it out I assure you I will make a tutorial on it.

I’m not sure how many blog posts will come out in the next couple of weeks with Christmas coming up. I’m traveling to have Christmas with family so depending on how much time I have while visiting I may or may not get anything new done until the New Year.

As always thank you for reading and please share it around as much as you can! Please feel free to put any suggestions or ideas for future tutorials in the comments section below.