The many faces of CMB

#WDSCamp — April 2014

Ok, so what IS CMB?

Like this …

mind-blown

Feature Set

Create metaboxes to be used on post edit screens

metabox-screenshot
docs

Create forms to be used on options pages

drugfree-site-options
docs

Create forms to handle user meta and display them on user profile add/edit pages

enhance-user-profile-edit-cropped

docs

…or on the front-end

enhance-user-profile-edit-frontend-cropped

docs

Use it on the front-end as a way to generate new posts

drugfree-frontend-new-posts-cropped
docs

Flexible and powerful

flexible-and-powerful

Flexible API that allows you to use CMB forms almost anywhere

Several useful field types are included

Docs

Custom API hook that allows you to create your own field types

captain-hook

Field parameters

        ...

        'fields' => array(
            array(
                'name'            => __( 'Test Text', 'cmb' ),
                'desc'            => __( 'field description (optional)', 'cmb' ),
                'id'              => $prefix . 'test_text',
                'type'            => 'text',
                'sanitization_cb' => 'my_custom_sanitization', // custom sanitization callback parameter
                'escape_cb'       => 'my_custom_escaping',  // custom escaping callback parameter
                'on_front'        => false, // Optionally designate a field to wp-admin only
                'repeatable'      => true,
            ),
            array(
                'name'    => __( 'Test wysiwyg', 'cmb' ),
                'desc'    => __( 'field description (optional)', 'cmb' ),
                'id'      => $prefix . 'test_wysiwyg',
                'type'    => 'wysiwyg',
                'options' => array( 'textarea_rows' => 5, ),
            ),
        ),

        ...
          

Field Parameters Docs

So what’s the big idea?

How does one begin this magical journey? (example-functions.php)

add_filter( 'cmb_meta_boxes', 'cmb_sample_metaboxes' );
function cmb_sample_metaboxes( $meta_boxes = array() ) {

    // Start with an underscore to hide fields from custom fields list
    $prefix = '_cmb_';

    /**
     * Sample metabox to demonstrate each field type included
     */
    $meta_boxes['test_metabox'] = array(
        'id'         => 'test_metabox',
        'title'      => __( 'Test Metabox', 'cmb' ),
        'pages'      => array( 'page', ), // Post type
        'context'    => 'normal',
        'priority'   => 'high',
        'show_names' => true, // Show field names on the left
        'fields'     => array(
        ...
        ),
    );

    // Add other metaboxes as needed

    return $meta_boxes;
}

So you want Repeatable Groups? You got it!

repeat-group

Customize

Custom field type

Use the custom type in the field configuration:

            array(
                'name'    => __( 'Custom Type Example', 'cmb' ),
                'desc'    => __( 'field description (optional)', 'cmb' ),
                'id'      => $prefix . 'test_my_custom_type',
                'type'    => 'my_custom_type',
            ),
Create a function to handle the display output of the custom type:

add_action( 'cmb_render_my_custom_type', 'cmb_render_my_custom_type', 10, 6 );
function cmb_render_my_custom_type( $args, $escaped_val, $object_id, $object_type, $cmb_types ) {
   $name = $cmb_types->_name();
   $id = $this->_id();

   echo '<input type="text" name="'. $name .'" id="'. $id .'" value="'. $escaped_val .'" />';
   echo $this->_desc( true );
}

Custom Field Type Docs

Customizing the built-in fields

Customizing the built-in fields (s’more)

Docs

More Power

hemi

Right?

mind-blown

Questions?

Fast, secure WordPress hosting is provided by WP Engine.
Fast, secure WordPress hosting is provided by WP Engine.