Add a custom panel to the Theme Customizer

In WordPress to add a custom panel to the Theme Customizer. The add_panel() method of the WP_Customize_Manager class allows you to create a group of sections that can be used to organize options within the customizer.

$wp_customize->add_panel( 'panel_id', array(
'priority' => 10,
'capability' => 'edit_theme_options',
'theme_supports' => '',
'title' => '',
'description' => '',
) );

1. $wp_customize->add_panel( 'panel_id', array( ... ) );

This line is the main function call. It adds a new panel to the customizer.

  • $wp_customize: This is an instance of the WP_Customize_Manager class. It’s passed as an argument to the function that hooks into the customize_register action.
  • add_panel( 'panel_id', array( ... ) ): This method adds a new panel to the customizer. The first argument is the unique ID of the panel, and the second argument is an array of options that define the panel’s properties.

2. 'panel_id'

This is the unique identifier for the panel. It should be a string and unique among all panels in the customizer.

3. array( ... )

This is an array of options that define the panel’s properties:

  • 'priority' => 10: This determines the order in which the panel appears relative to other panels. Panels with lower numbers appear higher in the customizer. A priority of 10 means this panel will appear near the top.
  • 'capability' => 'edit_theme_options': This defines the capability required to view and edit this panel. The capability 'edit_theme_options' is typically assigned to administrators, meaning only users with this capability can see and edit the panel.
  • 'theme_supports' => '': This optional parameter allows you to restrict the panel to themes that support a specific feature. If set, the panel will only appear if the current theme supports the feature specified here. If left empty (''), it applies to all themes.
  • 'title' => '': This is the title of the panel that will be displayed in the customizer. You should provide a string here to name your panel.
  • 'description' => '': This is an optional description for the panel. It can be used to provide additional context or instructions to the user. The description will be displayed below the panel title in the customizer.

Example of a Complete Panel

$wp_customize->add_panel( 'my_panel', array(
'priority' => 10,
'capability' => 'edit_theme_options',
'theme_supports' => '',
'title' => 'My Custom Panel',
'description' => 'This panel contains settings for customizing my theme.',
) );

In this example:

  • The panel is titled “My Custom Panel.”
  • It appears near the top of the customizer (priority 10).
  • It’s accessible to users with the edit_theme_options capability.
  • It’s available to all themes (theme_supports is empty).
  • It has a description that explains its purpose.

How to Use the Panel

Once you’ve created a panel, you can add sections to it by specifying the panel parameter when adding sections:

$wp_customize->add_section( 'my_section', array(
'title' => 'My Section',
'panel' => 'my_panel', // Associating this section with 'my_panel'
'priority' => 10,
) );

This way, the section will be grouped under “Your Custom Panel” in the customizer.

About admin

Leave a Reply

Your email address will not be published. Required fields are marked *