Skip to content

Adding Custom Metaboxes

Michiel Tramper edited this page Mar 28, 2018 · 14 revisions

Custom Metaboxes can be added by using the add method, where $values are an array of settings. Multiple blocks of metaboxes can be added to the same post type.

$fields = MakeitWorkPress\WP_Custom_Fields\Framework::instance();

$fields->add( 'meta', $values );

 

Group Setting Values

On the highest level, an options field may have the following keys.

key type description
title string The title for the metabox (required)
id string The id of the metabox (required). This is the key under which the meta data will be saved.
screen string or array The screen to add the metabox to. For example a post type (like ['page', 'post']). Required if type is 'post'.
context string The context of the metabox. Supports 'normal', 'side' or 'advanced'```. Required if type is 'post'``.
priority string The priority of the metabox. Supports 'high', 'low' or 'default'```. Required if type is 'post'``.
type string The type of meta box to add. Accepts 'post', 'term' or 'user'. Defaults to 'post'.
taxonomy string The taxonomy to add the metabox to. Required if type is 'term'.
single boolean If this value is set to true, saves the values by each field id instead of the id of the metabox. Thus, the value of each field are saved under their own metakey.

 

Example

The following code adds a custom metabox to pages and posts.

$fields = MakeitWorkPress\WP_Custom_Fields\Framework::instance();

$fields->add( 'meta', array(
    'class'     => 'tabs-left',
    'id'        => 'wp_custom_fields_meta',
    'title'     => __('Page Options', 'wp-custom-fields'),
    'screen'    => array('page', 'post'),
    'single'    => true,
    'type'      => 'post',
    'context'   => 'normal',
    'priority'  => 'default',
    'sections'  => array(
        array(
            'id'        => 'section_1',
            'title'     => __('Section One', 'wp-custom-fields'),
            'icon'      => 'camera_enhance',
            'fields'    => array(
                array (
                    'id'            => 'text_field_value_7',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'checkbox',
                    'subtype'       => 'email',
                    // 'style'         => 'switcher switcher-disable',
                    'options'       => array( 
                        'full' =>  array('label' => __('Enable Fullwidth Content', 'wp-custom-fields') ),
                        'half' =>  array('label' => __('Enable Fullwidth Content', 'wp-custom-fields') )
                    )
                ),   
                array(
                    'title'         => __('Example Heading', 'wp-custom-fields'),
                    'id'            => 'thing_heading',
                    'type'          => 'heading',
                ),                             
                array (
                    'id'            => 'text_field_value',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'input',
                    'subtype'       => 'email',
                    'sanitize'      => 'enabled',
                    'default'       => 'awesome@henk.nl'

                ),
                array (
                    'id'            => 'text_field_value_2',
                    'title'         => __('Example Title 2', 'wp-custom-fields'),
                    'description'   => __('Example Description 2', 'wp-custom-fields'),
                    'type'          => 'input',
                    'subtype'       => 'url',
                    'sanitize'      => 'enabled',
                    'default'       => 'http://www.pik.nl'

                )                    
            )
        ),
        array(
            'id'        => 'section_2',
            'title'     => __('Section Two', 'wp-custom-fields'),
            'icon'      => 'camera_enhance',
            'fields'    => array(
                array(
                    'id'            => 'field1',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'background'
                ),
                array(
                    'id'            => 'field2',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'border'
                ),
                array(
                    'id'            => 'field2',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'boxshadow'
                ),                
                array(
                    'id'            => 'field3',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'checkbox',
                    'options'       => array(
                        'thing_one' => array( 'label' => __('Label One', 'wp-custom-fields') ),
                        'thing_two' => array( 'label' => __('Label Two', 'wp-custom-fields') )
                    )
                ),
                array(
                    'id'            => 'field4',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'colorpicker'
                ),
                array(
                    'id'            => 'field5',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'dimension'
                ), 
                array(
                    'id'            => 'field6',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'dimensions'
                ),
                array(
                    'id'            => 'field7',
                    'type'          => 'divider'
                ),
                array(
                    'id'            => 'field8',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'editor'
                ),
                array(
                    'id'            => 'field9',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'export',
                    'option_id'     => 'wp_custom_fields_options_2'
                ),
                array(
                    'id'            => 'field9',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'heading'
                ),                
                 array(
                    'id'            => 'field10',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'icons'
                ),               
                array(
                    'id'            => 'field11',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'input'
                ),
                array(
                    'id'            => 'field12',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'location'
                ),
                array(
                    'id'            => 'field13',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'media'
                ),
                array(
                    'id'            => 'field14',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'radio',
                    'options'       => array(
                        'thing_one' => array( 'label' => __('Label One', 'wp-custom-fields') ),
                        'thing_two' => array( 'label' => __('Label Two', 'wp-custom-fields') )
                    )                    
                ),                
                array(
                    'id'            => 'field15',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'select',
                    'options'       => array(
                        'thing_one' => __('Label One', 'wp-custom-fields'),
                        'thing_two' => __('Label Two', 'wp-custom-fields')
                    )
                ),
                array(
                    'id'            => 'field16',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'select',
                    'subtype'       => 'post'
                ),
                array(
                    'id'            => 'field17',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'slider'
                ),
                array(
                    'id'            => 'field18',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'textarea'
                ),
                array(
                    'id'            => 'field19',
                    'title'         => __('Example Title', 'wp-custom-fields'),
                    'description'   => __('Example Description', 'wp-custom-fields'),
                    'type'          => 'typography'
                )                                
            ) 
        )
    )
) );

Clone this wiki locally