Adding a description to theme customizer controls

How could I add a description to $wp_customize->add_control? I’ve found I really need to include a short description on some of the controls but it doesn’t look like it’s possible.

I noticed you can add a description to $wp_customize->add_section but that’s only a tooltip.

Read More

This is ideally what I’d like to do, but unsure on how to output it and if this is possible:

$wp_customize->add_control( 'theme_options[some_option_name]', array(
    'label'   => 'This Is Some Option',
    'section' => 'theme_name_section',
    'type'    => 'text',
    'description' => 'Wish this existed', // this isn't possible
));

Related posts

Leave a Reply

3 comments

  1. Here is one way to do it by extending the control you want to use.

    Below is an example where we extend the text control and add an extra description like the one seen here on the screenshot:

    enter image description here

    function mytheme_customizer( $wp_customize ) {
        class Custom_Text_Control extends WP_Customize_Control {
            public $type = 'customtext';
            public $extra = ''; // we add this for the extra description
            public function render_content() {
            ?>
            <label>
                <span><?php echo esc_html( $this->extra ); ?></span>
                <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
                <input type="text" value="<?php echo esc_attr( $this->value() ); ?>" <?php $this->link(); ?> />
            </label>
            <?php
            }
        }
        $wp_customize->add_section('customtext_section', array(
                'title'=>__('My Custom Text','mytheme'),
            )
        );     
        $wp_customize->add_setting('mytheme_options[customtext]', array(
                'default' => '',
                'type' => 'customtext_control',
                'capability' => 'edit_theme_options',
                'transport' => 'refresh',
            )
        );
        $wp_customize->add_control( new Custom_Text_Control( $wp_customize, 'customtext_control', array(
            'label' => 'My custom Text Setting',
            'section' => 'customtext_section',
            'settings' => 'mytheme_options[customtext]',
            'extra' =>'Here is my extra description text ...'
            ) ) 
        );
    }
    add_action( 'customize_register', 'mytheme_customizer' ,10,1);
    

    It is helpful to check out the source of the WP_Customize_Control class:

    https://github.com/WordPress/WordPress/blob/master/wp-includes/class-wp-customize-control.php

    Hope this helps.

  2. The description argument adds a description under the control. If you want to add something above the control title, like an extra header or something, you can use the customize_render_control_{id} action. For example, if you wanted to add a button above a control with the id hi_shawn you could do this:

    add_action( 'customize_render_control_hi_shawn', function(){
        printf( '<a href="%s">%s</a>', 'http://hiroy.club', __( 'Hi Shawn', 'text-domain' ) );
    });