Redesigning Custom Post Type “Add New” page

The question / answer you are referring to was Tips for using WordPress as a CMS.

The screenshots posted in that answer were created using the register_meta_box_cb argument that is available to for custom post types.

register_meta_box_cb must specify a callback function that contains the code for the meta box.

To create the meta box you can use the WordPress built in add_meta_box function which also requires a function to save the entered data when the post is saved.

Here is some example code that I created to add 2 custom meta boxes to my portfolio post type I use on my personal website.

The “Projects” post type I created contained this argument:

'register_meta_box_cb' => 'c3m_project_meta',

The first function below is the call back function for register_meta_box_cb. The following 2 output the html for the meta boxes on the add post page and the last 2 save the entered data.

function c3m_project_meta() {
        add_meta_box('_c3m_project_url', __('Enter Website Url') , 'c3m_project_url', 'project', 'side', 'low');
        add_meta_box('_c3m_project_work', __('Enter Work Done on Project') , 'c3m_project_work', 'project', 'side', 'low');
        
        }

            
    function c3m_project_url($post) {
        global $post;
        echo  '<input type="hidden" name="banner-buttonmeta_noncename" id="banner-buttonmeta_noncename" value="' .
        wp_create_nonce( plugin_basename(__FILE__) ) . '" />';
        $projecturl = get_post_meta($post->ID, '_projecturl', true);
        echo '<input type="text" name="_projecturl" value="' . $projecturl . '" class="widefat" />' ; 
        }
        
    function c3m_project_work($post) {
        global $post;
        echo  '<input type="hidden" name="banner-buttonmeta_noncename" id="banner-buttonmeta_noncename" value="' .
        wp_create_nonce( plugin_basename(__FILE__) ) . '" />';
        $projectwork = get_post_meta($post->ID, '_projectwork', true);
        echo '<input type="text" name="_projectwork" value="' . $projectwork . '" class="widefat" />' ; 
        }
    
    
    add_action('admin_init', 'c3m_project_meta');

        
    
    function c3m_save_project_meta( $post_id , $post ) { 
 
        if ( !wp_verify_nonce( $_POST [ 'banner-buttonmeta_noncename' ], plugin_basename( __FILE__ ) )) { return $post ->ID; 

        }
     
        if ( !current_user_can( 'edit_post' , $post ->ID )) return $post ->ID; 
        $c3m_projecturl [ '_projecturl' ] = $_POST [ '_projecturl' ]; 
                    foreach ( $c3m_projecturl as $key => $value ) { 
                    if ( $post ->post_type == 'revision' ) return ; 
            
                    $value = implode( ',' , ( array ) $value );
                    if (get_post_meta( $post ->ID, $key , FALSE)) { 
                    update_post_meta( $post ->ID, $key , $value ); } else { 
                    add_post_meta( $post ->ID, $key , $value ); } if (! $value ) delete_post_meta( $post ->ID, $key ); 

                    }
         
        $c3m_projectwork [ '_projectwork' ] = $_POST [ '_projectwork' ]; 
                    foreach ( $c3m_projectwork as $key => $value ) { 
                    if ( $post ->post_type == 'revision' ) return ; 
            
                    $value = implode( ',' , ( array ) $value );
                    if (get_post_meta( $post ->ID, $key , FALSE)) { 
                    update_post_meta( $post ->ID, $key , $value ); } else { 
                    add_post_meta( $post ->ID, $key , $value ); } if (! $value ) delete_post_meta( $post ->ID, $key ); 

                    }
        }
        
   add_action( 'save_post' , 'c3m_save_project_meta' , 1, 2); 

Leave a Comment