Customizer Panels - For Grouping Related sections

Feature Request
1

Hi there,
Would be nice to have support for customizer panels… I believe it will bring more control and better use of the Wordpress Customizer through Pinegrow.

For example, one could have the different sections and controls for a all the ‘homepage’, grouped under a customizer panel named ‘Homepage’… Would be nice don’t you think?

Anyway, please see the attached image for the customizer object structure.

WordPress-Customizer-Panels
WordPress-Customizer-Panels992×554 25.2 KB

2

Thanks for your suggestion.

You can easily add as many panels as you want/need into your custom themes with a few lines of code. Then from Pinegrow, you will just have to specify the panel name in your customizer settings.

Here is a code sample that you can add in your custom.php file (or directly in functions.php).
Don’t forget to replace all the st2 items with your own theme slug.

/**
 * Customizer: Add Panels
 * This file demonstrates how to add Panels to the Customizer.
 * @package   code-examples
 * @copyright Copyright (c) 2015, WordPress Theme Review Team
 * @license   http://www.gnu.org/licenses/old-licenses/gpl-2.0.html GNU General Public License, v2 (or newer)
 */
 
/**
 * Theme Options Customizer Implementation.
 * Implement the Theme Customizer for Theme Settings.
 * @link http://ottopress.com/2012/how-to-leverage-the-theme-customizer-in-your-own-themes/
 * @param WP_Customize_Manager $wp_customize Object that holds the customizer data.
 */

function st2_register_customizer_panels( $wp_customize ){

	/*
	 * Failsafe is safe
	 */

	if ( ! isset( $wp_customize ) ) {
		return;
	}

	/**
	 * Add Panel for General Settings.
	 * @uses $wp_customize->add_panel() https://developer.wordpress.org/reference/classes/wp_customize_manager/add_panel/
	 * @link $wp_customize->add_panel() https://codex.wordpress.org/Class_Reference/WP_Customize_Manager/add_panel
	 */

	$wp_customize->add_panel(
		// $id
		'st2_panel_general',
		// $args
		array(
			'priority' 			=> 10,
			'capability' 		=> 'edit_theme_options',
			'theme_supports'	=> '',
			'title' 			=> __( 'ST2 General Settings', 'st2' ),
			'description' 		=> __( 'Configure general settings for the Theme Name Theme', 'st2' ),
		)
	);	
}
// Settings API options initilization and validation
add_action( 'customize_register', 'st2_register_customizer_panels' );
3

Thanks a lot @Emmanuel

4

Something useful to read, from the WordPress documentation

Panels #Panels

The Customizer Panels API was introduced in WordPress 4.0, and allows developers to create an additional layer of hierarchy beyond controls and sections. More than simply grouping sections of controls, panels are designed to provide distinct contexts for the Customizer, such as Customizing Widgets, Menus, or perhaps in the future, editing posts. There is an important technical distinction between the section and panel objects.

Themes should not register their own panels in most cases . Sections do not need to be nested under a panel, and each section should generally contain multiple controls. Controls should also be added to the Sections that core provides, such as adding color options to the colors Section. Also make sure that your options are as streamlined and efficient as possible; see the WordPress philosophy. Panels are designed as contexts for entire features such as Widgets, Menus, or Posts, not as wrappers for generic sections. If you absolutely must use Panels, you’ll find that the API is nearly identical to that for Sections.

Panels must contain at least one Section, which must contain at least one Control, to be displayed. As you can see in the above example, Sections can be added to Panels similarly to how Controls are added to Sections. However, unlike with controls, if the Panel parameter is empty when registering a Section, it will be displayed on the main, top-level Customizer context, as most sections should not be contained with a panel.

5

Thanks for this. It actually is helpful. :slight_smile: