WP Theme Customizer - order of options

Question

I have a problem with theme customization. My code is:

function candyfloss_theme_customizer( $wp_customize ) { class Heading extends WP_Customize_Control { public $type = 'heading'; public function render_content() { ?> <label> <span class="customize-control-title" style="border-bottom: 1px dashed #666;"><strong><?php echo esc_html( $this->label ); ?></strong></span> </label> <?php } } $wp_customize->add_setting('products_heading', array( 'default', ) ); $wp_customize->add_control(new Heading ($wp_customize, 'products_heading', array( 'label' => __('Home - products section'), 'type' => 'heading', 'section' => 'home', ) ) ); $wp_customize->add_setting('candyfloss_product_first', array( 'deafault', ) ); $wp_customize->add_control('candyfloss_product_first', array( 'label' => __('First product page'), 'type' => 'dropdown-pages', 'section' => 'home', ) ); $wp_customize->add_setting('candyfloss_product_second', array( 'deafault', ) ); $wp_customize->add_control('candyfloss_product_second', array( 'label' => __('Second product page'), 'type' => 'dropdown-pages', 'section' => 'home', ) ); $wp_customize->add_setting('candyfloss_product_third', array( 'deafault', ) ); $wp_customize->add_control('candyfloss_product_third', array( 'label' => __('Third product page'), 'type' => 'dropdown-pages', 'section' => 'home', ) ); }; add_action( 'customize_register', 'candyfloss_theme_customizer', 11 ); 

And the problem is fine. The admin panel displays

second option, first option, heading, third option,

Can anyone know what I'm doing wrong? Could you help me? I'll be grateful

Answer 1

I have found the answer. Wordpress provides a random priority for control. To solve this problem, we just need to add a priority number to each control.

eg:

 $wp_customize->add_control(new Heading ($wp_customize, 'products_heading', array( 'label' => __('Home - products section'), 'type' => 'heading', 'section' => 'home', 'priority' => 2, ) ) );