Create your own field type


Meta Box plugin is so flexible that you can create your own field type easily. This documentation will show you how to create a new field type with Meta Box plugin.

Let’s create a field type phone which accepts the only phone in format xxx-xxxx.

Define a new field class

We have to create a class name RWMB_Phone_Field for phone field. Generally, if we want to create a new field type, we have to create a class name RWMB_{$field_type}_Field (make sure it has a correct case) extending RWMB_Field class.

if ( class_exists( 'RWMB_Field' ) )
    class RWMB_Phone_Field extends RWMB_Field

Save this class in a PHP file with any name, assuming field-phone.php. Then include that file in functions.php file of your theme or in plugin’s file:

add_action( 'init', 'prefix_load_phone_type', 1 );

function prefix_load_phone_type()
    require 'path/to/field-phone.php';

Define field’s methods

The phone class inherits all method from RWMB_Field class. The full list of RWMB_Field methods and their description are described in this documentation.

For phone field, we have to define content of html method to define field HTML:

static public function html( $meta, $field )
    return sprintf(
        '<input type="tel" name="%s" id="%s" value="%s" pattern="d{3}-d{4}">',

Here we use new HTML5 input type tel with new attribute pattern to force users to enter correct phone number format xxx-xxxx.

For this field, we don’t need to handle saving or retrieving meta value or enqueueing scripts and styles. Everything is handled in default way (which can be understood like a text field).

The complete code for this class is the following:

Register fields with new field type

Now we can register fields with phone type, like this:

$meta_boxes[] = array(
    // Meta Box attributes
    'fields' => array(
            'name' => 'Phone',
            'id'   => 'prefix_phone',
            'type' => 'phone',
        // Other fields

Now when you go to edit post page, you’ll see a new field like this:

new field type
New field type

That’s all for this simple field type. If you want to create a more complicated field, just overwrite methods from RWMB_Field class. You might want to enqueue scripts and styles, sanitizing field value before saving in the database, etc. The RWMB_Field class has all methods for that you just need to overwrite necessary methods.

Save > 70% when buy all extensions with Core Extension Bundle!

Get all CURRENT + FUTURE extensions with 60% discount! Get it now