Widgets not displaying in theme customizer

Question

I am developing a new theme and I am using several sidebars in this theme. All works fine, but the widgets are not showing up in the theme customizer section. All widgets are working fine under "appearance -> widgets" section but not in "appearance -> customize". I am using wordpress 3.9.1.

This is how I declared them in functions.php

if(function_exists('register_sidebar'))
 {

    register_sidebar ( array (
            'name' => 'Widget Area 1',
            'id' => 'widget-1',
            'description' => 'Widget Area 2.',
            'before_widget' => '<div id="%2$s" class="widget %2$s">',
            'after_widget' => '</div>',
            'before_title' => '<h3>',
            'after_title' => '</h3>' ,
    ) );



    register_sidebar ( array (
            'name' => 'Widget Area 2',
            'id' => 'widget-2',
            'description' => 'Widget Area 2.',
            'before_widget' => '<div id="%2$s" class="widget %2$s">',
            'after_widget' => '</div>',
            'before_title' => '<h3>',
            'after_title' => '</h3>' ,
    ) );


    register_sidebar ( array (
            'name' => 'Widget Area 3',
            'id' => 'widget-3',
            'description' => 'Widget Area 3.',
            'before_widget' => '<div id="%2$s" class="widget %2$s">',
            'after_widget' => '</div>',
            'before_title' => '<h3>',
            'after_title' => '</h3>' ,
    ) );

    register_sidebar ( array (
            'name' => 'Widget Area 4',
            'id' => 'widget-4',
            'description' => 'Widget Area 4.',
            'before_widget' => '<div id="%2$s" class="widget %2$s">',
            'after_widget' => '</div>',
            'before_title' => '<h3>',
            'after_title' => '</h3>' ,
    ) );

}

And this is how I call them.

<?php
    if (! function_exists ( 'dynamic_sidebar' ) || ! dynamic_sidebar ( 'Widget Area 1' )) :

endif;?>

It is showing fine when I have one widget area but as soon as I add multiple ones it disappears from customizer.

Answer 1

Widgets DO appear in the Customizer, but only if you are on the page that they are used on.

For example, I have a sidebar for the Archive page. When I'm in the Customizer and on the homepage, that sidebar doesn't appear. But if I navigate to an archive page while in the Customizer, it then appears in the widget area.

Answer 2

This is the Real Solution to your problem: All you have to do is make sure the you have add this function to the footer and before the closing tag </body> :

<?php wp_footer();?>

also make sure you have <?php wp_head();?> before </head> tag. I hope this help......

Answer 3

I know you asked this a long time ago, but I just had the same issue, and finally figured out the problem. In my functions.php file, I had de-registered jquery (wp_deregister_script('jquery')). This apparently causes the widgets to not work in the customizer, even though my page was still loading jquery (through wp_enqueue_script).

In order to fix the problem (assuming you're having the same problem as me), you need to re-register jquery by calling wp_register_script('jquery', ('url_to_jquery'), false, '1.11.1'[or whatever your jquery version is]).

Answer 4

Widget will never showing up calling by its name instead or call by ID.

Please check sidebar.php or footer.php where you would like to show your widget is that the sidebar ID you register in functions.php page is same or not.

If you use you widget ID 'something' in functions.php and 'something-else' in where you would like to show your widget is appeared than its nothing worked out!

Example:

If you register your widget in functions.php using "page-sidebar" then you must call your widget using <?php dynamic_sidebar( 'page-sidebar' ); ?> in your sidebar or footer page.

Answer 5

@PieterGoosen is correct, in dynamic_sidebar ( 'Widget Area 1' )) you are calling the name, not the ID, which is widget-1.

Try using the ID instead.

Answer 6

I encountered this problem, and solved it. Please open your browser to the console, it is clear that there is a javascript error. fixed the error and widgets shown