Class Name:

MP_CORE_Customizer

Purpose:

To simplify and speed up the process of creating customizer fields.

Overview:

This class uses associative arrays passed to the MP_CORE_Customizer class to create new customizer fields that auto transport without needing to write extra javascript files.

Usage:

new MP_CORE_Customizer($args);

Parameters:

$args (array)

Sample Code:

function mt_malachi_customizer(){

        $my_section_id_1 = 'my_first_section';
        $my_section_title_1 = __( 'My Main Section', 'textdomain' );
        $my_section_priority_1 = 1;
 
        $my_setting_id_1 = 'my_first_setting';
        $my_setting_id_2 = 'my_second_setting';
        $my_setting_id_3 = 'my_third_setting';

	$args = array(
		array( 'section_id' => $my_section_id_1, 'section_title' => $my_section_title_1,'section_priority' => $my_section_priority_1,
			'settings' => array(
				$my_setting_id_1 => array(
					'label'      => __( 'My First Setting', 'textdomain' ),
					'type'       => 'color',
					'default'    => '#000000',
					'priority'   => 1,
                                        'element'    => '#main',
					'jquery_function_name' => 'css',
					'arg' => 'background-color'
		                ),
			        $my_setting_id_2 => array(
					'label'      => __( 'My Second Setting', 'textdomain' ),
					'type'       => 'checkbox',
					'default'    => '',
					'priority'   => 2,
                                        'element'    => '#main',
					'jquery_function_name' => 'css',
					'arg' => 'display'
				),
                               $my_setting_id_3 => array(
					'label'      => __( 'My Third Setting', 'textdomain' ),
					'type'       => 'select',
					'default'    => '',
					'priority'   => 2,
                                        'element'    => NULL,
					'jquery_function_name' => NULL,
					'arg' => NULL,
                                        'choices'    => array ( 'option_value_1' => 'Option 1', 'option_value_2' => 'Option 2' )
				),
			)
		)
	);

new MP_CORE_Customizer($args);

Usage Breakdown:

Each section is created by having a new second-level array in the $args array.

This is a sample of what 3 sections would look like with no fields in the section:

$args = array(
	array( 'section_id' => $my_section_id_1, 'section_title' =>  $my_section_title_1,'section_priority' => 1, 'settings' => array() ), 
        array( 'section_id' => $my_section_id_2, 'section_title' =>  $my_section_title_2,'section_priority' => 2, 'settings' => array() ), 
        array( 'section_id' => $my_section_id_3, 'section_title' => _ $my_section_title_3,'section_priority' => 3, 'settings' => array() ), 
);

The ‘settings’ array for each section looks like this:

'$setting_id' => array(
	'label'      => $setting_title,
	'type'       => $setting_type,
	'default'    => '',
	'priority'   => 1,
        'element'    => $setting_element,
	'jquery_function_name' => $setting_jquery_function,
	'arg' => $setting_arg
),

The variables above are:

• label (string) – The title of the setting
• type (string) – The type of field. See “Customizer Field Types” below.
• default (strong) – The default setting for this field
• priority (int) – A number which represents the order this setting will appear within this section
• element (string) – the CSS class or ID name of the element we wish to change
• jquery_function_name (string) – The name of the jquery function we are going to use. Usually this will be ‘css’ or ‘attr‘
• arg (string) – the argument we pass to the jquery function.
• choices (array) – associative array used for the “select” and “radio” post types.

Customizer Field Types

• textbox
  
• checkbox
• textarea
• radio
• image
• upload
• color
• select