How to easily add custom meta boxes to the WordPress backend?

There is a tool i frequently use named Toolset. It works great, but creating custom input boxes for the backend is not that easy. And you are rather limited functions wise. Recently I found a different solution: MetaBox.io a nice free plugin with a even nicer online generator to create almost every kind of metaboxes for the backend. I gave it a try. Here is my result.

I love WordPress customization and metaboxes

Meta boxes are the core ofWordPress.WordPress for me is all about creating and managing data. Therefore, you need to define the data needed and provide means to enter and edit it in the backend. This is where custom fields, custom post types andmeta boxes come into play. All of those three variants can be created and edited with Toolset. But there are other players as well. Like ACF – advanced custom fields with its plethora of paid plugins and now – unknown to me until recently – MetaBox.io

What is MetaBox.io? And why is it different from Toolset?

Meta Box is a free and very capable Gutenberg and therefore GDPR-compatible WordPress custom fields plugin and framework that makes it easy to customize a website with meta boxes and custom fields in WordPress. There are dozens of options and extensions to keep you busy or add only what you need. All the while keeping the load light with their API. It’s also WordPress Multisite-compatible (but who uses multisite anyway – I hope no one).

Creating code snipets is a way of customization that I like a lot. Because I like the code more than fixed plugins and complex editing interfaces. it feels more natural. MetaBox follows this exact approach. Also having relationships within the same Post type is great and a badly missed feature from Toolset, since it unfortunately absolutly does not allow relationships between the same custom post types.

An example of to use MetaBox.io

I used the plugin and the according online generator to create a connection within the same post type which I have created with Toolset. It might sound a little confusing but it works. This is the code I ended up with from the online generator. You can select parent two horses for the post type „pferd“ (Horses). Keep in mind that using the generated snippets requires the MetaBox plugin to be installed.

add_filter( 'rwmb_meta_boxes', 'your_prefix_register_meta_boxes' );

function your_prefix_register_meta_boxes( $meta_boxes ) {
    $prefix = '';

    $meta_boxes[] = [
        'title'      => esc_html__( 'Zuchtdaten', 'online-generator' ),
        'id'         => 'zuchtdaten',
        'post_types' => ['pferd'],
        'context'    => 'side',
        'priority'   => 'low',
        'fields'     => [
            [
                'type'       => 'post',
                'name'       => esc_html__( 'Vaterpferd', 'online-generator' ),
                'id'         => $prefix . 'vaterpferd',
                'desc'       => esc_html__( 'Bitte wählen Sie das Vaterpferd', 'online-generator' ),
                'post_type'  => 'pferd',
				'field_type'  => 'select_advanced',
            ],
			[
                'type'       => 'post',
                'name'       => esc_html__( 'Mutterpferd', 'online-generator' ),
                'id'         => $prefix . 'mutterpferd',
                'desc'       => esc_html__( 'Bitte wählen Sie das Mutterpferd', 'online-generator' ),
                'post_type'  => 'pferd',
				'field_type'  => 'select_advanced',
            ],
        ],
    ];

    return $meta_boxes;
}

This is how the final result looks like in the post edit screen for the „pferd“ post type. You can easily select two parent horses from the same post type.

Here are some ressources on how to proceed

The first one is the online generator, which provides an easy-to-use interface to create the code snippets. There is a paid extension (and many others, also free ones) for the MetaBox plugin that offers an editor for the WordPress backend, so you do not need to leave the site while creating. The second link helps to understand how to use the saved data in the theme or within other functions. Cause of course you do not only want to save but also want to use the additional information.

• The Online-Generator
• Guide on How to Add Related Posts to WordPress Using Meta Box