Skip to content

Instantly share code, notes, and snippets.

@cryptexvinci
Last active March 29, 2020 05:29
Show Gist options
  • Save cryptexvinci/fa8881756c5a6688ed0ad31647e036b4 to your computer and use it in GitHub Desktop.
Save cryptexvinci/fa8881756c5a6688ed0ad31647e036b4 to your computer and use it in GitHub Desktop.
WordPress Customizer Sample Reference
<?php
/**
* WordPress Customizer Comprehensive Reference
* Compiled by @ti_asif
*/
Panel
Section
Setting
Control
// =============================
// Panel
// =============================
$wp_customize->add_panel( 'panel_id', array(
'title' => __( 'Example Panel', 'textdomain' ),
'description' => __( 'Description of the panel.', 'textdomain' ),
'priority' => 10,
'capability' => 'edit_theme_options', // [Roles and Capabilities]
// edit_theme_options
// manage_options
'theme_supports' => '', // Optional. This can be used to hide a setting if the theme lacks support for a specific feature (using add_theme_support).
// 'custom-header'
// 'custom-background'
// 'menus'
// 'static-front-page'
// 'custom-logo'
// 'post-formats'
// 'post-thumbnails'
// 'automatic-feed-links'
// 'html5'
// 'title-tag'
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
) );
// =============================
// Section
// =============================
$wp_customize->add_section( 'section_id', array(
'title' => __( 'Example Section', 'textdomain' ),
'description' => __( 'Description of the section.', 'textdomain' ),
'priority' => 130,
'theme_supports' => '', // Optional. This can be used to hide a setting if the theme lacks support for a specific feature (using add_theme_support).
// 'custom-header'
// 'custom-background'
// 'menus'
// 'static-front-page'
// 'custom-logo'
// 'post-formats'
// 'post-thumbnails'
// 'automatic-feed-links'
// 'html5'
// 'title-tag'
'capability' => 'edit_theme_options', // [Roles and Capabilities]
// edit_theme_options
// manage_options
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'panel' => 'panel_id',
) );
// =============================
// Setting
// =============================
$wp_customize->add_setting( 'demo_radio_control', array(
'default' => 'default_value',
'capability' => 'edit_theme_options', // [Roles and Capabilities]
// edit_theme_options
// manage_options
'type' => 'theme_mod', // Specifies the TYPE of setting
// 'theme_mod' - Settings can only be used by that specific theme.
// 'option' - Settings can be used by absolutely any theme or plugin.
'transport' => '', // (Optional)
// 'postMessage'
// 'refresh'
'theme_supports' => '', // (Optional) This can be used to hide a setting if the theme lacks support for a specific feature (using add_theme_support).
// 'custom-header'
// 'custom-background'
// 'menus'
// 'static-front-page'
// 'custom-logo'
// 'post-formats'
// 'post-thumbnails'
// 'automatic-feed-links'
// 'html5'
// 'title-tag'
'sanitize_callback' => 'esc_url', // (Optional) A function name to call for sanitizing the input value for this setting.
// 'sanitize_bookmark'
// 'sanitize_bookmark_field'
// 'sanitize_category'
// 'sanitize_category_field'
// 'sanitize_comment_cookies'
// 'sanitize_email'
// 'sanitize_file_name'
// 'sanitize_hex_color'
// 'sanitize_hex_color_no_hash'
// 'sanitize_html_class'
// 'sanitize_key'
// 'sanitize_meta'
// 'sanitize_mime_type'
// 'sanitize_option'
// 'sanitize_post'
// 'sanitize_post_field'
// 'sanitize_sql_orderby'
// 'sanitize_term'
// 'sanitize_term_field'
// 'sanitize_text_field'
// 'sanitize_title'
// 'sanitize_title_for_query'
// 'sanitize_title_with_dashes'
// 'sanitize_trackback_urls'
// 'sanitize_url'
// 'sanitize_user'
// 'sanitize_user_field'
// 'sanitize_user_object'
// 'intval'
// 'absint'
// 'esc_attr'
// 'esc_attr'
// 'esc_attr_e'
// 'esc_attr_x'
// 'esc_html'
// 'esc_html'
// 'esc_html_e'
// 'esc_html_x'
// 'esc_js'
// 'esc_sql'
// 'esc_textarea'
// 'esc_url'
// 'esc_url_raw'
// 'wp_filter_nohtml_kses'
// 'wp_kses_post'
'sanitize_js_callback' => '', // Essentially converts to JSON
) );
// =============================
// Controls - Text
// =============================
$wp_customize->add_control(
'demo_text_control', // ID
array( // Arguments
'label' => __('Text', 'textdomain'),
'description' => __( 'Description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'type' => 'text', // Input Types
// 'text'
// 'textarea'
// 'checkbox'
// 'radio' (requires choices array in $args)
// 'select' (requires choices array in $args)
// 'range' (requires choices array in $args)
// 'button'
// 'date'
// 'email'
// 'tel'
// 'url'
// 'password'
// 'number'
// 'search'
'input_attrs' => array(
'value' => __( 'Example Text', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-css-class',
'style' => 'border: 1px solid #000000',
),
'capability' => 'edit_posts',
)
);
// =============================
// Controls - Radio
// =============================
$wp_customize->add_control(
'demo_radio_control',
array(
'label' => __('Text', 'textdomain'),
'description' => __( 'Description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'input_attrs' => array(
'value' => __( 'Example Text', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-css-class',
'style' => 'border: 1px solid #000000',
),
'capability' => 'edit_posts',
'type' => 'radio', // Input Types
// 'text'
// 'textarea'
// 'checkbox'
// 'radio' (requires choices array in $args)
// 'select' (requires choices array in $args)
// 'range' (requires choices array in $args)
// 'button'
// 'date'
// 'email'
// 'tel'
// 'url'
// 'password'
// 'number'
// 'search'
'choices' => array(
'value1' => 'Choice 1',
'value2' => 'Choice 2',
'value3' => 'Choice 3',
),
)
);
// =============================
// Controls - Checkbox
// =============================
$wp_customize->add_control(
'demo_checkbox_control',
array(
'label' => __('Text', 'textdomain'),
'description' => __( 'Description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'input_attrs' => array(
'value' => __( 'Example Text', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-css-class',
'style' => 'border: 1px solid #000000',
),
'capability' => 'edit_posts',
'type' => 'checkbox',
)
);
// =============================
// Controls - Select
// =============================
$wp_customize->add_control(
'demo_select_control',
array(
'label' => __('Text', 'textdomain'),
'description' => __( 'Description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'input_attrs' => array(
'value' => __( 'Example Text', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-css-class',
'style' => 'border: 1px solid #000000',
),
'capability' => 'edit_posts',
'type' => 'select',
'choices' => array(
'value1' => 'Choice 1',
'value2' => 'Choice 2',
'value3' => 'Choice 3',
),
));
// =============================
// Controls - Image Upload
// =============================
$wp_customize->add_control(
new WP_Customize_Image_Control($wp_customize,
'demo_image_control',
array(
'label' => __('Text', 'textdomain'),
'description' => __( 'Description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'input_attrs' => array(
'value' => __( 'Example Text', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-css-class',
'style' => 'border: 1px solid #000000',
),
'capability' => 'edit_posts',
)));
// =============================
// Controls - File Upload
// =============================
$wp_customize->add_control(
new WP_Customize_Upload_Control($wp_customize,
'demo_upload_control',
array(
'label' => __('Text', 'textdomain'),
'description' => __( 'Description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'input_attrs' => array(
'value' => __( 'Example Text', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-css-class',
'style' => 'border: 1px solid #900',
),
'capability' => 'edit_posts',
)));
// =============================
// Controls - Color Picker
// =============================
$wp_customize->add_control(
new WP_Customize_Color_Control(
$wp_customize,
'demo_color_picker',
array(
'label' => __('Text', 'textdomain'),
'description' => __( 'Description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'input_attrs' => array(
'value' => __( 'Example Text', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-css-class',
'style' => 'border: 1px solid #000000',
),
'capability' => 'edit_posts',
)
)
);
// =============================
// Controls - Background Image Control
// =============================
$wp_customize->add_control(
new WP_Customize_Background_Image_Control(
$wp_customize,
'demo_background_image_control',
array(
'label' => __('Text', 'textdomain'),
'description' => __( 'Description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'input_attrs' => array(
'value' => __( 'Example Text', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-css-class',
'style' => 'border: 1px solid #900',
),
'capability' => 'edit_posts',
) ) );
// =============================
// Controls - Header Image Control
// =============================
$wp_customize->add_control(
new WP_Customize_Header_Image_Control(
$wp_customize,
'demo_header_image_control',
array(
'label' => __('Text', 'textdomain'),
'description' => __( 'Description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'input_attrs' => array(
'value' => __( 'Example Text', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-css-class',
'style' => 'border: 1px solid #000000',
),
'capability' => 'edit_posts',
) ) );
// =============================
// Controls - Cropped Image Control
// =============================
$wp_customize->add_control(
new WP_Customize_Cropped_Image_Control(
$wp_customize,
'demo_cropped_image_control',
array(
'label' => __('Text', 'textdomain'),
'description' => __( 'Description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'input_attrs' => array(
'value' => __( 'Example text', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-class',
'style' => 'border: 1px solid #900',
),
'capability' => 'edit_posts',
'flex_width' => true, // Allow any width, making the specified value recommended. False by default.
'flex_height' => false, // Require the resulting image to be exactly as tall as the height attribute (default).
'width' => 1920,
'height' => 1080,
) ) );
// =============================
// Controls - Media Control
// =============================
$wp_customize->add_control(
new WP_Customize_Media_Control(
$wp_customize,
'demo_audio_control',
array(
'label' => __('Text', 'textdomain'),
'description' => __( 'description', 'textdomain' ),
'section' => 'section_id',
'settings' => 'settings_id',
'active_callback' => 'is_front_page', // Contextually show/hide customizer controls based on the customizer’s preview context
// Conditional Tags: https://codex.wordpress.org/Conditional_Tags
'priority' => 10,
'input_attrs' => array(
'value' => __( 'Add Post', 'textdomain' ),
'placeholder' => __( 'plceholder text', 'textdomain' ),
'class' => 'my-custom-class',
'style' => 'border: 1px solid #900',
),
'capability' => 'edit_posts',
'mime_type' => 'audio', // Other Options
// 'image',
// 'audio'
) ) );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment