How do I add custom fields to my custom post type in Wordpress 3?

Question

I created a custom post type with the register_post_type function, and now I want to add custom fields to it. These must be as user friendly and integraded in the GUI as possible.

I tried the custom field template but I dont really like it for end users. I prefer to add the new field and a new meta box with code.

Answer 1

I found this series of tutorials were very helpful:

• http://wp.tutsplus.com/tutorials/reusable-custom-meta-boxes-part-1-intro-and-basic-fields/
• http://wp.tutsplus.com/tutorials/reusable-custom-meta-boxes-part-2-advanced-fields/
• http://wp.tutsplus.com/tutorials/reusable-custom-meta-boxes-part-3-extra-fields/
• http://wp.tutsplus.com/tutorials/reusable-custom-meta-boxes-part-4-using-the-data/

And if you want a straight up code sample, this code is basically the template that I use for myself: (Using Scribu's optimal script loading technique)

final class Metabox_Example {
    // These hook into to the two core actions we need to perform; creating the metabox, and saving it's contents when it is posted
    public function __construct() {
        // http://codex.wordpress.org/Plugin_API/Action_Reference/add_meta_boxes
        add_action( 'add_meta_boxes', array( $this, 'create_meta_box' ) );

        // http://codex.wordpress.org/Plugin_API/Action_Reference/save_post
        add_filter( 'save_post', array( $this, 'save_meta_box' ), 10, 2 );
    }

    public function create_meta_box( $post_type, $post ) {
        // http://codex.wordpress.org/Function_Reference/add_meta_box
        add_meta_box(
            'location_information_meta_box', // (string) (required) HTML 'id' attribute of the edit screen section
            __( 'Location Information', 'plugin-namespace' ), // (string) (required) Title of the edit screen section, visible to user
            array( $this, 'print_meta_box' ), // (callback) (required) Function that prints out the HTML for the edit screen section. The function name as a string, or, within a class, an array to call one of the class's methods.
            'location', // (string) (required) The type of Write screen on which to show the edit screen section ('post', 'page', 'dashboard', 'link', 'attachment' or 'custom_post_type' where custom_post_type is the custom post type slug)
            'normal', // (string) (optional) The part of the page where the edit screen section should be shown ('normal', 'advanced', or 'side')
            'high' // (string) (optional) The priority within the context where the boxes should show ('high', 'core', 'default' or 'low')
        );
    }

    public function print_meta_box( $post, $metabox ) {
        ?>
            <!-- These hidden fields are a registry of metaboxes that need to be saved if you wanted to output multiple boxes. The current metabox ID is added to the array. -->
            <input type="hidden" name="meta_box_ids[]" value="<?php echo $metabox['id']; ?>" />
            <!-- http://codex.wordpress.org/Function_Reference/wp_nonce_field -->
            <?php wp_nonce_field( 'save_' . $metabox['id'], $metabox['id'] . '_nonce' ); ?>

            <!-- This is a sample of fields that are associated with the metabox. You will notice that get_post_meta is trying to get previously saved information associated with the metabox. -->
            <!-- http://codex.wordpress.org/Function_Reference/get_post_meta -->
            <table class="form-table">
            <tr><th><label for="location_address"><?php _e( 'Street Address', 'plugin-namespace' ); ?></label></th>
            <td><input name="location_address" type="text" id="location_address" value="<?php echo get_post_meta($post->ID, 'location_address', true); ?>" class="regular-text"></td></tr>
            <tr><th><label for="location_city"><?php _e( 'City', 'plugin-namespace' ); ?></label></th>
            <td><input name="location_city" type="text" id="location_city" value="<?php echo get_post_meta($post->ID, 'location_city', true); ?>" class="regular-text"></td></tr>
            <tr><th><label for="location_province"><?php _e( 'State/Province', 'plugin-namespace' ); ?></label></th>
            <td><input name="location_province" type="text" id="location_province" value="<?php echo get_post_meta($post->ID, 'location_province', true); ?>" class="regular-text"></td></tr>
            <tr><th><label for="location_postalcode"><?php _e( 'Postal Code', 'plugin-namespace' ); ?></label></th>
            <td><input name="location_postalcode" type="text" id="location_postalcode" value="<?php echo get_post_meta($post->ID, 'location_postalcode', true); ?>" class="regular-text"></td></tr>
            <tr><th><label for="location_country"><?php _e( 'Country', 'plugin-namespace' ); ?></label></th>
            <td><input name="location_country" type="text" id="location_country" value="<?php echo get_post_meta($post->ID, 'location_country', true); ?>" class="regular-text"></td></tr>
            </table>

            <!-- These hidden fields are a registry of fields that need to be saved for each metabox. The field names correspond to the field name output above. -->
            <input type="hidden" name="<?php echo $metabox['id']; ?>_fields[]" value="location_address" />
            <input type="hidden" name="<?php echo $metabox['id']; ?>_fields[]" value="location_city" />
            <input type="hidden" name="<?php echo $metabox['id']; ?>_fields[]" value="location_province" />
            <input type="hidden" name="<?php echo $metabox['id']; ?>_fields[]" value="location_postalcode" />
            <input type="hidden" name="<?php echo $metabox['id']; ?>_fields[]" value="location_country" />
        <?php
    }

    public function save_meta_box( $post_id, $post ) {
        // Check if this information is being submitted by means of an autosave; if so, then do not process any of the following code
        if( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ){ return; }

        // Determine if the postback contains any metaboxes that need to be saved
        if( empty( $_POST['meta_box_ids'] ) ){ return; }

        // Iterate through the registered metaboxes
        foreach( $_POST['meta_box_ids'] as $metabox_id ){
            // Verify thhe request to update this metabox
            if( ! wp_verify_nonce( $_POST[ $metabox_id . '_nonce' ], 'save_' . $metabox_id ) ){ continue; }

            // Determine if the metabox contains any fields that need to be saved
            if( count( $_POST[ $metabox_id . '_fields' ] ) == 0 ){ continue; }

            // Iterate through the registered fields        
            foreach( $_POST[ $metabox_id . '_fields' ] as $field_id ){
                // Update or create the submitted contents of the fiels as post meta data
                // http://codex.wordpress.org/Function_Reference/update_post_meta
                update_post_meta($post_id, $field_id, $_POST[ $field_id ]);
            }
        }

        return $post;
    }
}

$metabox_example = new Metabox_Example();