Title: WP_Customize_Panel
Published: September 4, 2014
Last modified: August 20, 2026

---

# class WP_Customize_Panel {}

## In this article

 * [Description](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#description)
    - [See also](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#see-also)
 * [Methods](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#methods)
 * [Source](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#source)
 * [Related](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#related)
 * [Changelog](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#changelog)

[ Back to top](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#wp--skip-link--target)

Customize Panel class.

## 󠀁[Description](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#description)󠁿

A UI container for sections, managed by the [WP_Customize_Manager](https://developer.wordpress.org/reference/classes/wp_customize_manager/).

### 󠀁[See also](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#see-also)󠁿

 * [WP_Customize_Manager](https://developer.wordpress.org/reference/classes/wp_customize_manager/)

## 󠀁[Methods](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#methods)󠁿

| Name | Description | 
| [WP_Customize_Panel::__construct](https://developer.wordpress.org/reference/classes/wp_customize_panel/__construct/) | Constructor. | 
| [WP_Customize_Panel::active](https://developer.wordpress.org/reference/classes/wp_customize_panel/active/) | Check whether panel is active to current Customizer preview. | 
| [WP_Customize_Panel::active_callback](https://developer.wordpress.org/reference/classes/wp_customize_panel/active_callback/) | Default callback used when invoking [WP_Customize_Panel::active()](https://developer.wordpress.org/reference/classes/wp_customize_panel/active/). | 
| [WP_Customize_Panel::check_capabilities](https://developer.wordpress.org/reference/classes/wp_customize_panel/check_capabilities/) | Checks required user capabilities and whether the theme has the feature support required by the panel. | 
| [WP_Customize_Panel::content_template](https://developer.wordpress.org/reference/classes/wp_customize_panel/content_template/) | An Underscore (JS) template for this panel’s content (but not its container). | 
| [WP_Customize_Panel::get_content](https://developer.wordpress.org/reference/classes/wp_customize_panel/get_content/) | Get the panel’s content template for insertion into the Customizer pane. | 
| [WP_Customize_Panel::json](https://developer.wordpress.org/reference/classes/wp_customize_panel/json/) | Gather the parameters passed to client JavaScript via JSON. | 
| [WP_Customize_Panel::maybe_render](https://developer.wordpress.org/reference/classes/wp_customize_panel/maybe_render/) | Check capabilities and render the panel. | 
| [WP_Customize_Panel::print_template](https://developer.wordpress.org/reference/classes/wp_customize_panel/print_template/) | Render the panel’s JS templates. | 
| [WP_Customize_Panel::render](https://developer.wordpress.org/reference/classes/wp_customize_panel/render/) | Render the panel container, and then its contents (via `this->render_content()`) in a subclass. | 
| [WP_Customize_Panel::render_content](https://developer.wordpress.org/reference/classes/wp_customize_panel/render_content/) | Render the panel UI in a subclass. | 
| [WP_Customize_Panel::render_template](https://developer.wordpress.org/reference/classes/wp_customize_panel/render_template/) | An Underscore (JS) template for rendering this panel’s container. |

## 󠀁[Source](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#source)󠁿

    ```php
    #[AllowDynamicProperties]
    class WP_Customize_Panel {

    	/**
    	 * Incremented with each new class instantiation, then stored in $instance_number.
    	 *
    	 * Used when sorting two instances whose priorities are equal.
    	 *
    	 * @since 4.1.0
    	 * @var int
    	 */
    	protected static $instance_count = 0;

    	/**
    	 * Order in which this instance was created in relation to other instances.
    	 *
    	 * @since 4.1.0
    	 * @var int
    	 */
    	public $instance_number;

    	/**
    	 * WP_Customize_Manager instance.
    	 *
    	 * @since 4.0.0
    	 * @var WP_Customize_Manager
    	 */
    	public $manager;

    	/**
    	 * Unique identifier.
    	 *
    	 * @since 4.0.0
    	 * @var string
    	 */
    	public $id;

    	/**
    	 * Priority of the panel, defining the display order of panels and sections.
    	 *
    	 * @since 4.0.0
    	 * @var int
    	 */
    	public $priority = 160;

    	/**
    	 * Capability required for the panel.
    	 *
    	 * @since 4.0.0
    	 * @var string
    	 */
    	public $capability = 'edit_theme_options';

    	/**
    	 * Theme features required to support the panel.
    	 *
    	 * @since 4.0.0
    	 * @var mixed[]
    	 */
    	public $theme_supports = '';

    	/**
    	 * Title of the panel to show in UI.
    	 *
    	 * @since 4.0.0
    	 * @var string
    	 */
    	public $title = '';

    	/**
    	 * Description to show in the UI.
    	 *
    	 * @since 4.0.0
    	 * @var string
    	 */
    	public $description = '';

    	/**
    	 * Auto-expand a section in a panel when the panel is expanded when the panel only has the one section.
    	 *
    	 * @since 4.7.4
    	 * @var bool
    	 */
    	public $auto_expand_sole_section = false;

    	/**
    	 * Customizer sections for this panel.
    	 *
    	 * @since 4.0.0
    	 * @var array
    	 */
    	public $sections;

    	/**
    	 * Type of this panel.
    	 *
    	 * @since 4.1.0
    	 * @var string
    	 */
    	public $type = 'default';

    	/**
    	 * Active callback.
    	 *
    	 * @since 4.1.0
    	 *
    	 * @see WP_Customize_Section::active()
    	 *
    	 * @var callable Callback is called with one argument, the instance of
    	 *               WP_Customize_Section, and returns bool to indicate whether
    	 *               the section is active (such as it relates to the URL currently
    	 *               being previewed).
    	 */
    	public $active_callback = '';

    	/**
    	 * Constructor.
    	 *
    	 * Any supplied $args override class property defaults.
    	 *
    	 * @since 4.0.0
    	 *
    	 * @param WP_Customize_Manager $manager Customizer bootstrap instance.
    	 * @param string               $id      A specific ID for the panel.
    	 * @param array                $args    {
    	 *     Optional. Array of properties for the new Panel object. Default empty array.
    	 *
    	 *     @type int             $priority        Priority of the panel, defining the display order
    	 *                                            of panels and sections. Default 160.
    	 *     @type string          $capability      Capability required for the panel.
    	 *                                            Default `edit_theme_options`.
    	 *     @type mixed[]         $theme_supports  Theme features required to support the panel.
    	 *     @type string          $title           Title of the panel to show in UI.
    	 *     @type string          $description     Description to show in the UI.
    	 *     @type string          $type            Type of the panel.
    	 *     @type callable        $active_callback Active callback.
    	 * }
    	 */
    	public function __construct( $manager, $id, $args = array() ) {
    		$keys = array_keys( get_object_vars( $this ) );
    		foreach ( $keys as $key ) {
    			if ( isset( $args[ $key ] ) ) {
    				$this->$key = $args[ $key ];
    			}
    		}

    		$this->manager = $manager;
    		$this->id      = $id;
    		if ( empty( $this->active_callback ) ) {
    			$this->active_callback = array( $this, 'active_callback' );
    		}
    		self::$instance_count += 1;
    		$this->instance_number = self::$instance_count;

    		$this->sections = array(); // Users cannot customize the $sections array.
    	}

    	/**
    	 * Check whether panel is active to current Customizer preview.
    	 *
    	 * @since 4.1.0
    	 *
    	 * @return bool Whether the panel is active to the current preview.
    	 */
    	final public function active() {
    		$panel  = $this;
    		$active = call_user_func( $this->active_callback, $this );

    		/**
    		 * Filters response of WP_Customize_Panel::active().
    		 *
    		 * @since 4.1.0
    		 *
    		 * @param bool               $active Whether the Customizer panel is active.
    		 * @param WP_Customize_Panel $panel  WP_Customize_Panel instance.
    		 */
    		$active = apply_filters( 'customize_panel_active', $active, $panel );

    		return $active;
    	}

    	/**
    	 * Default callback used when invoking WP_Customize_Panel::active().
    	 *
    	 * Subclasses can override this with their specific logic, or they may
    	 * provide an 'active_callback' argument to the constructor.
    	 *
    	 * @since 4.1.0
    	 *
    	 * @return bool Always true.
    	 */
    	public function active_callback() {
    		return true;
    	}

    	/**
    	 * Gather the parameters passed to client JavaScript via JSON.
    	 *
    	 * @since 4.1.0
    	 *
    	 * @return array The array to be exported to the client as JSON.
    	 */
    	public function json() {
    		$array                          = wp_array_slice_assoc( (array) $this, array( 'id', 'description', 'priority', 'type' ) );
    		$array['title']                 = html_entity_decode( $this->title, ENT_QUOTES, get_bloginfo( 'charset' ) );
    		$array['content']               = $this->get_content();
    		$array['active']                = $this->active();
    		$array['instanceNumber']        = $this->instance_number;
    		$array['autoExpandSoleSection'] = $this->auto_expand_sole_section;
    		return $array;
    	}

    	/**
    	 * Checks required user capabilities and whether the theme has the
    	 * feature support required by the panel.
    	 *
    	 * @since 4.0.0
    	 * @since 5.9.0 Method was marked non-final.
    	 *
    	 * @return bool False if theme doesn't support the panel or the user doesn't have the capability.
    	 */
    	public function check_capabilities() {
    		if ( $this->capability && ! current_user_can( $this->capability ) ) {
    			return false;
    		}

    		if ( $this->theme_supports && ! current_theme_supports( ...(array) $this->theme_supports ) ) {
    			return false;
    		}

    		return true;
    	}

    	/**
    	 * Get the panel's content template for insertion into the Customizer pane.
    	 *
    	 * @since 4.1.0
    	 *
    	 * @return string Content for the panel.
    	 */
    	final public function get_content() {
    		ob_start();
    		$this->maybe_render();
    		return trim( ob_get_clean() );
    	}

    	/**
    	 * Check capabilities and render the panel.
    	 *
    	 * @since 4.0.0
    	 */
    	final public function maybe_render() {
    		if ( ! $this->check_capabilities() ) {
    			return;
    		}

    		/**
    		 * Fires before rendering a Customizer panel.
    		 *
    		 * @since 4.0.0
    		 *
    		 * @param WP_Customize_Panel $panel WP_Customize_Panel instance.
    		 */
    		do_action( 'customize_render_panel', $this );

    		/**
    		 * Fires before rendering a specific Customizer panel.
    		 *
    		 * The dynamic portion of the hook name, `$this->id`, refers to
    		 * the ID of the specific Customizer panel to be rendered.
    		 *
    		 * @since 4.0.0
    		 */
    		do_action( "customize_render_panel_{$this->id}" );

    		$this->render();
    	}

    	/**
    	 * Render the panel container, and then its contents (via `this->render_content()`) in a subclass.
    	 *
    	 * Panel containers are now rendered in JS by default, see WP_Customize_Panel::print_template().
    	 *
    	 * @since 4.0.0
    	 */
    	protected function render() {}

    	/**
    	 * Render the panel UI in a subclass.
    	 *
    	 * Panel contents are now rendered in JS by default, see WP_Customize_Panel::print_template().
    	 *
    	 * @since 4.1.0
    	 */
    	protected function render_content() {}

    	/**
    	 * Render the panel's JS templates.
    	 *
    	 * This function is only run for panel types that have been registered with
    	 * WP_Customize_Manager::register_panel_type().
    	 *
    	 * @since 4.3.0
    	 *
    	 * @see WP_Customize_Manager::register_panel_type()
    	 */
    	public function print_template() {
    		?>
    		<script type="text/html" id="tmpl-customize-panel-<?php echo esc_attr( $this->type ); ?>-content">
    			<?php $this->content_template(); ?>
    		</script>
    		<script type="text/html" id="tmpl-customize-panel-<?php echo esc_attr( $this->type ); ?>">
    			<?php $this->render_template(); ?>
    		</script>
    		<?php
    	}

    	/**
    	 * An Underscore (JS) template for rendering this panel's container.
    	 *
    	 * Class variables for this panel class are available in the `data` JS object;
    	 * export custom variables by overriding WP_Customize_Panel::json().
    	 *
    	 * @see WP_Customize_Panel::print_template()
    	 *
    	 * @since 4.3.0
    	 */
    	protected function render_template() {
    		?>
    		<li id="accordion-panel-{{ data.id }}" class="accordion-section control-section control-panel control-panel-{{ data.type }}">
    			<h3 class="accordion-section-title">
    				<button type="button" class="accordion-trigger" aria-expanded="false" aria-controls="{{ data.id }}-content">
    					{{ data.title }}
    				</button>
    			</h3>
    			<ul class="accordion-sub-container control-panel-content" id="{{ data.id }}-content"></ul>
    		</li>
    		<?php
    	}

    	/**
    	 * An Underscore (JS) template for this panel's content (but not its container).
    	 *
    	 * Class variables for this panel class are available in the `data` JS object;
    	 * export custom variables by overriding WP_Customize_Panel::json().
    	 *
    	 * @see WP_Customize_Panel::print_template()
    	 *
    	 * @since 4.3.0
    	 */
    	protected function content_template() {
    		?>
    		<li class="panel-meta customize-info accordion-section <# if ( ! data.description ) { #> cannot-expand<# } #>">
    			<button class="customize-panel-back" tabindex="-1"><span class="screen-reader-text">
    				<?php
    				/* translators: Hidden accessibility text. */
    				_e( 'Back' );
    				?>
    			</span></button>
    			<div class="accordion-section-title">
    				<span class="preview-notice">
    				<?php
    					/* translators: %s: The site/panel title in the Customizer. */
    					printf( __( 'You are customizing %s' ), '<strong class="panel-title">{{ data.title }}</strong>' );
    				?>
    				</span>
    				<# if ( data.description ) { #>
    					<button type="button" class="customize-help-toggle dashicons dashicons-editor-help" aria-expanded="false"><span class="screen-reader-text">
    						<?php
    						/* translators: Hidden accessibility text. */
    						_e( 'Help' );
    						?>
    					</span></button>
    				<# } #>
    			</div>
    			<# if ( data.description ) { #>
    				<div class="description customize-panel-description">
    					{{{ data.description }}}
    				</div>
    			<# } #>

    			<div class="customize-control-notifications-container"></div>
    		</li>
    		<?php
    	}
    }
    ```

[View all references](https://developer.wordpress.org/reference/files/wp-includes/class-wp-customize-panel.php/)
[View on Trac](https://core.trac.wordpress.org/browser/tags/7.1/src/wp-includes/class-wp-customize-panel.php#L24)
[View on GitHub](https://github.com/WordPress/wordpress-develop/blob/7.1/src/wp-includes/class-wp-customize-panel.php#L24-L409)

## 󠀁[Related](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#related)󠁿

| Used by | Description | 
| [WP_Customize_Themes_Panel](https://developer.wordpress.org/reference/classes/wp_customize_themes_panel/)`wp-includes/customize/class-wp-customize-themes-panel.php` |

Customize Themes Panel Class

  | 
| [WP_Customize_Nav_Menus_Panel](https://developer.wordpress.org/reference/classes/wp_customize_nav_menus_panel/)`wp-includes/customize/class-wp-customize-nav-menus-panel.php` |

Customize Nav Menus Panel Class

  |

## 󠀁[Changelog](https://developer.wordpress.org/reference/classes/wp_customize_panel/?output_format=md#changelog)󠁿

| Version | Description | 
| [4.0.0](https://developer.wordpress.org/reference/since/4.0.0/) | Introduced. |

## User Contributed Notes

You must [log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fdeveloper.wordpress.org%2Freference%2Fclasses%2Fwp_customize_panel%2F)
before being able to contribute a note or feedback.