On this page I will explain how to create fields. It does not matter if it is for admin pages or for meta boxes, it works the same way.
Create fields:
To create fields you must first create a metabox or admin page:
1) Create Metabox
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
add_action( 'xbox_init', 'my_metabox'); function my_metabox(){ $options = array( 'id' => 'metabox-id',//Must be unique for each metabox that is created with xbox. 'title' => 'My Metabox', 'post_types' => array('post', 'page'), 'skin' => 'blue',// Skins: blue, lightblue, green, teal, pink, purple, bluepurple, yellow, orange'. 'layout' => 'wide',//Layouts: wide, boxed 'context' => 'normal',//See context parameter: https://developer.wordpress.org/reference/functions/add_meta_box/ 'priority' => 'high',//See priority parameter: https://developer.wordpress.org/reference/functions/add_meta_box/ 'closed' => false, 'class' => '',//Custom class for metabox 'fields_prefix' => '',//Prefix for the id of all fields. 'header' => array( //'icon' => '<img src="'.XBOX_URL.'/img/xbox-light.png"/>', 'desc' => 'Custom description for metabox', ), ); $xbox = xbox_new_metabox( $options ); } |
2) Add fields
Next we will create a colorpicker field:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
add_action( 'xbox_init', 'my_metabox'); function my_metabox(){ $options = array(...);//Prev code $xbox = xbox_new_metabox( $options ); //This creates a field: $xbox->add_field(array( 'id' => 'bg-color', 'name' => __( 'Background color', 'textdomain' ), 'type' => 'colorpicker', 'default' => '#C95EE7', )); } |
Now let’s add a field of type checkbox.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
add_action( 'xbox_init', 'my_metabox'); function my_metabox(){ $options = array(...);//Prev code $xbox = xbox_new_metabox( $options ); $xbox->add_field(array( 'id' => 'bg-color', 'name' => __( 'Background color', 'textdomain' ), 'type' => 'colorpicker', 'default' => '#C95EE7', )); $xbox->add_field(array( 'id' => 'custom-checkbox', 'name' => __( 'Custom checkbox', 'textdomain' ), 'type' => 'checkbox', 'default' => array('option2'), 'items' => array( 'option1' => 'Option 1', 'option2' => 'Option 2', 'option3' => 'Option 3', ), )); } |
Result:
Get saved values:
To get the values of the fields we have to do the following:
Get field values for Meta Boxes:
Use the following code to get the values. Use only inside your template files. e.g. ( index.php, single.php, archive.php):
|
1 2 3 4 5 6 7 8 9 10 |
$xbox = Xbox::get( 'metabox-id' ); $value = $xbox->get_field_value( 'custom-checkbox' ); var_dump($value); //Return: array(1) { [0]=> string(7) "option2" } |
Or inside any hook that runs after ‘init’. Never before, never inside the init.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
add_action( 'wp_head', 'custom_function' ); function custom_function() { $xbox = Xbox::get( 'metabox-id' ); $post_id = 65;//Your post id $default_value = '';//Callback, In case it is empty. $value = $xbox->get_field_value( 'custom-checkbox', $post_id, $default_value ); //Return: array(1) { [0]=> string(7) "option2" } } |
Get field values for Admin Pages:
Use the following code to get the values. Use only inside your template files. e.g. ( index.php, single.php, archive.php):
|
1 2 3 4 5 6 7 8 |
$xbox = Xbox::get( 'my-admin-page' ); $value = $xbox->get_field_value( 'default-logo' ); var_dump($value); //Return: string(49) "http://wp.dev/wp-content/uploads/2016/12/logo.png" |
Or inside any hook that runs after ‘init’. Never before, never inside the init.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
add_action( 'wp_head', 'custom_function' ); function custom_function() { $xbox = Xbox::get( 'my-admin-page' ); $value = $xbox->get_field_value( 'default-logo' ); var_dump($value); //Return string(49) "http://wp.dev/wp-content/uploads/2016/12/logo.png" } |
You also have the following function available which does exactly the same thing:
|
1 2 3 |
$value = xbox_get_field_value( $xbox_id, $field_id = '', $default = '', $post_id = '' ); |
Shortcode:
|
1 2 3 |
[xbox_get_field_value xbox_id="my-theme-options" field_id="phone" default="555-000"] |