Using WordPress ‘customize_render_section_{$this->id}’ PHP action

The customize_render_section_{$this->id} WordPress PHP action fires before rendering a specific Customizer section.


add_action('customize_render_section_your_section_id', 'your_custom_function');
function your_custom_function() {
    // your custom code here


  • None

More information

See WordPress Developer Resources: customize_render_section_{$this->id}


Change the title of a Customizer section

Before rendering the ‘title_tagline’ section, modify its title:

add_action('customize_render_section_title_tagline', 'change_title_tagline_section_title');

function change_title_tagline_section_title() {
    // Change the title of the 'title_tagline' section
    global $wp_customize;
    $wp_customize->get_section('title_tagline')->title = __('New Title', 'your-textdomain');

Add content to the top of a Customizer section

Add a custom message to the top of the ‘colors’ section:

add_action('customize_render_section_colors', 'add_content_to_colors_section');

function add_content_to_colors_section() {
    // Add a custom message at the top of the 'colors' section
    echo '<p class="custom-message">' . __('This is a custom message.', 'your-textdomain') . '</p>';

Add a button to a Customizer section

Add a ‘Reset’ button to the ‘background_image’ section:

add_action('customize_render_section_background_image', 'add_reset_button_to_background_image_section');

function add_reset_button_to_background_image_section() {
    // Add a 'Reset' button to the 'background_image' section
    echo '<button class="reset-background-image button">' . __('Reset Background Image', 'your-textdomain') . '</button>';

Display a notice before a Customizer section

Show a notice before the ‘widgets’ section is displayed:

add_action('customize_render_section_widgets', 'display_notice_before_widgets_section');

function display_notice_before_widgets_section() {
    // Display a notice before the 'widgets' section
    echo '<div class="widgets-notice notice">' . __('Please note that changes may not be visible immediately.', 'your-textdomain') . '</div>';

Add custom CSS to a Customizer section

Add custom CSS to style the ‘header_image’ section:

add_action('customize_render_section_header_image', 'add_custom_css_to_header_image_section');

function add_custom_css_to_header_image_section() {
    // Add custom CSS to style the 'header_image' section
    echo '<style>.customize-control-header_image { background-color: #f1f1f1; }</style>';