A Quick Example - rogerlos/cmb2-metatabs-options GitHub Wiki

This example shows off a few things about CMO, including:

  • Location on the WordPress Admin Menu: added to "Settings"
  • Admin Page Columns: 2 (includes a sidebar, with metabox assigned to it)
  • Metaboxes: 3
  • Tabs: 2 (each assigned a single metabox)
  • Save Button: Added to the sidebar metabox, with custom wording instead of "Save"

You do not have to inject any data if you'd prefer to code the values directly into the class--but then how would you add another options page?

CMO can also find metaboxes you've configured elsewhere in your program. See the metaboxes page for more details.

add_action( 'cmb2_admin_init', 'my_options_page' );

function my_options_page() {

	// the options key fields will be saved under
	$opt_key = 'my_options';

	// the show_on parameter for configuring the CMB2 box, this is critical!
	$show_on = array( 'key' => 'options-page', 'value' => array( $opt_key ) );

	// an array to hold our boxes
	$boxes = array();

	// an array to hold some tabs
	$tabs = array();

	// add first box: this is just normal CMB2 box creation, with the exception
	// of the show_on parameter and call to object_type method, both essential
	$cmb = new_cmb2_box( array(
		'id'        => 'test_metabox',
		'title'     => __( 'Test Metabox', 'cmb2' ),
		'show_on' 	=> $show_on,
	));
	$cmb->add_field( array(
		'name'       => __( 'Test Text', 'cmb2' ),
		'desc'       => __( 'field description (optional)', 'cmb2' ),
		'id'         => 'my_text_1',
		'type'       => 'text',
	));
	$cmb->object_type( 'options-page' );
	$boxes[] = $cmb;

	// box 2
	$cmb = new_cmb2_box( array(
		'id'        => 'test2_metabox',
		'title'     => __( 'Another Metabox', 'cmb2' ),
		'show_on' 	=> $show_on,
	));
	$cmb->add_field( array(
		'name'       => __( 'Text 2', 'cmb2' ),
		'desc'       => __( 'Text 2', 'cmb2' ),
		'id'         => 'my_text2',
		'type'       => 'text',
	));
	$cmb->object_type( 'options-page' );
	$boxes[] = $cmb;

	// box 3, in sidebar of our two-column layout
	$cmb = new_cmb2_box( array(
		'id'        => 'side_metabox',
		'title'     => __( 'Save Options', 'cmb2' ),
		'show_on' 	=> $show_on,
		'context'    => 'side',
	));
	$cmb->add_field( array(
		'name'       => __( 'Publish?', 'cmb2' ),
		'desc'       => __( 'Save These Options', 'cmb2' ),
		'id'         => 'my_save_button',
		'type'       => 'options_save_button',
		'show_names' => false,
	));
	$cmb->object_type( 'options-page' );
	$boxes[] = $cmb;

	// Tabs - an array of configuration arrays.
	$tabs[] = array(
		 'id'    => 'your_tab_id',
         'title' => 'First',
         'desc'  => '<p>Optional HTML above the metabox on this tab.</p>',
         'boxes' => array(
			 'test2_metabox'
		 ),
	);
	$tabs[] = array(
		'id'    => 'your_tab_id2',
		'title' => 'Second',
		'desc'  => '',
		'boxes' => array(
			'test_metabox'
		),
	);

    // Arguments array. See the arguments page for more detail
	$args = array(
		'key'        => $opt_key,
		'title'      => 'My Options',
		'topmenu'    => 'options-general.php',
		'boxes'      => $boxes,
		'tabs'       => $tabs,
		'cols'		 => 2,
		'savetxt'    => '',
	);

	new Cmb2_Metatabs_Options( $args );
}

If you have configured metaboxes properly elsewhere in your program (and were not using tabs, a custom save button or multiple columns as illustrated above), creating an options page can be accomplished as easily as this:

add_action( 'cmb2_admin_init', 'my_options_page' );

function my_options_page() {
	$args = array(
		'key'        => 'my_options',
		'title'      => 'My Options',
		'topmenu'    => 'options-general.php',
	);
	new Cmb2_Metatabs_Options( $args );
}