Search code examples
javascriptwordpresspluginsjquery-ui-accordion

Wordpress Plugin Javascript Issue

I purchased a Wordpress accordion plugin that's an addon for the WPBakery Page Builder and the support has been less than helpful. What I would like is to have users click on the title once to open a panel and click on the title again to close the panel. I have all the panels closed by default when the page loads.

You can see the accordion here: Wordpress accordion plugin, it's about the 10th one down:

this is the accordion the accordion

The javascript that is being provided is:

jQuery(document).ready(function(){
        jQuery('.uc_material_accordion .uc_trigger-{{uc_id}}').click(function(){
        if( jQuery(this).next().is(':hidden') ) {
        jQuery('.uc_material_accordion .uc_trigger-{{uc_id}}').removeClass('active').next().slideUp();
        jQuery(this).toggleClass('active').next().slideDown();
        }
        return false;
        });
    });

If anyone can help me, I would greatly appreciate it.

Solution

  • They get the money and we should do support for free! :) you can do something like this:

    JS

    jQuery(document).ready(function(){
    jQuery('.uc_material_accordion .uc_trigger-{{uc_id}}').click(function(){
        if( jQuery(this).next().is(':hidden') ) {
            jQuery(this).toggleClass('active').next().slideDown();
        } else {
            jQuery(this).toggleClass('active').next().slideUp();
        }
    return false;
    });
});

    P.S: You want to make an accordion to act like tab widget. This line of code will make your widget accordion 

    jQuery('.uc_material_accordion .uc_trigger-{{uc_id}}').removeClass('active').next().slideUp();