WordPress customizer: load controls in a custom div

I have a custom div (holder for extra settings) which I need to load some specific controls from a specific section in there. I can get the controls in JavaScript but I can’t generate the necessary HTML as WordPress do in sections.

wp.customize.section( 'custom_div_1' ).controls();

It gives an array of controls but how to generate the HTML like Site title or Tagline controls in default WordPress section.

This custom div will toggle by the left button Open extra settings.

Screenshot for easier understanding:screenshot

Any help is appreciated.

2 Answers
2

Put below codes in your functions.php

function sorcey_customize_register($wp_customize){

$wp_customize->add_section('sorcey_footer', array(
  'title'    => __('New Section', 'text_domain'),
  'description' => '',
  'priority' => 120,
));


/*  =============================
      Text input
===============================*/
$wp_customize->add_setting("sr_copyright", array(
        "default"       => "",
        'capability'  => 'edit_theme_options',
        "transport" => "postMessage",
    ));
    $wp_customize->add_control(new WP_Customize_Control($wp_customize, "sr_copyright_ctrl",
        array(
            "label" => __("Title", "text_domain"),
            "section" => "sorcey_footer",
            "settings" => "sr_copyright",
            "type" => "text",

        )
    ));

}

add_action('customize_register', 'sorcey_customize_register');

Then chek there will be a ‘New Section’

Leave a Comment