Support Forums

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Accordion Default To Compressed

Featured Lock Resolved Task
How can I change the default behavior of the accordion to all compressed?

13 Answers

Toufiq - Staff

More than a month ago #Permalink
udi wrote:

Toufiq wrote:

Hi,

Thanks for your query. Please follow this instruction.

[b]File location line on 362 to 365 remove below code
components\com_sppagebuilder\assets\js\sppagebuilder.js

Remove this code

$items.first().addClass('active');
$handlers.first().addClass('active');
$('.sppb-panel-collapse').css('display', 'none');
$panels.hide().first().removeAttr('style');


Add this code


$('.sppb-panel').removeClass('active');
$('.sppb-panel-heading').removeClass('active');
$('.sppb-panel-collapse').css('display', 'none');


-Thanks
Hi Toufiq,
thank you for detailed instructions.
Please direct to the filename and its location.

regards,
Udi


Thanks for your mail. Please check below path url and file name
components\com_sppagebuilder\assets\js\sppagebuilder.js

-Thanks

Arun Sasi

More than a month ago #Permalink
Hi,

Did you mean all collapsed?. Which accordion module your are user : Helix 2 shortcode / SP Page builder?

Thanks
Arun

bayden10

More than a month ago #Permalink
Hi Arun,

SP Page Builder and yes collapsed so no content is displayed on initial load.

Thanks,
Jim

Arun Sasi

More than a month ago #Permalink
Hi,

Try below code



$('.sppb-panel').removeClass('active');
$('.sppb-panel-heading').removeClass('active');
$('.sppb-panel-collapse').css('display', 'none');



Thanks
Arun

bayden10

More than a month ago #Permalink
Hi Arun, but where would I place that code?

Arun Sasi

More than a month ago #Permalink
Hi,

Add in main .js

Thanks
Arun

Robert Goldbeck

More than a month ago #Permalink
Hi Joomies ;)

Same question here. I want all my Panels to be closed on page load. I am using Pagebuilder.

Where can i find the Main.js to add the Code?

Thanks for help!

udi

More than a month ago #Permalink
Arun Sasi wrote:

Hi,

Try below code



$('.sppb-panel').removeClass('active');
$('.sppb-panel-heading').removeClass('active');
$('.sppb-panel-collapse').css('display', 'none');



Thanks
Arun
Hi Arun,

Where I have to add the code you sent to make it closed when loading the page?
regards,
Udi

Toufiq - Staff

More than a month ago #Permalink
Hi,

Thanks for your query. Please follow this instruction.

[b]File location line on 362 to 365 remove below code
components\com_sppagebuilder\assets\js\sppagebuilder.js

Remove this code

$items.first().addClass('active');
$handlers.first().addClass('active');
$('.sppb-panel-collapse').css('display', 'none');
$panels.hide().first().removeAttr('style');


Add this code


$('.sppb-panel').removeClass('active');
$('.sppb-panel-heading').removeClass('active');
$('.sppb-panel-collapse').css('display', 'none');


-Thanks

udi

More than a month ago #Permalink
Toufiq wrote:

Hi,

Thanks for your query. Please follow this instruction.

[b]File location line on 362 to 365 remove below code
components\com_sppagebuilder\assets\js\sppagebuilder.js

Remove this code

$items.first().addClass('active');
$handlers.first().addClass('active');
$('.sppb-panel-collapse').css('display', 'none');
$panels.hide().first().removeAttr('style');


Add this code


$('.sppb-panel').removeClass('active');
$('.sppb-panel-heading').removeClass('active');
$('.sppb-panel-collapse').css('display', 'none');


-Thanks
Hi Toufiq,
thank you for detailed instructions.
Please direct to the filename and its location.

regards,
Udi

udi

More than a month ago #Permalink
Toufiq wrote:

udi wrote:

Toufiq wrote:

Hi,

Thanks for your query. Please follow this instruction.

[b]File location line on 362 to 365 remove below code
components\com_sppagebuilder\assets\js\sppagebuilder.js

Remove this code

$items.first().addClass('active');
$handlers.first().addClass('active');
$('.sppb-panel-collapse').css('display', 'none');
$panels.hide().first().removeAttr('style');


Add this code


$('.sppb-panel').removeClass('active');
$('.sppb-panel-heading').removeClass('active');
$('.sppb-panel-collapse').css('display', 'none');


-Thanks
Hi Toufiq,
thank you for detailed instructions.
Please direct to the filename and its location.

regards,
Udi


Thanks for your mail. Please check below path url and file name
components\com_sppagebuilder\assets\js\sppagebuilder.js

-Thanks
Hן Toufiq,

Thank you !!!

It works.

The 3rd row was missing .. any dammage? [ $('.sppb-panel-collapse').css('display', 'none');]

regards,
Udi

Toufiq - Staff

More than a month ago #Permalink
udi wrote:

Toufiq wrote:

udi wrote:

Toufiq wrote:

Hi,

Thanks for your query. Please follow this instruction.

[b]File location line on 362 to 365 remove below code
components\com_sppagebuilder\assets\js\sppagebuilder.js

Remove this code

$items.first().addClass('active');
$handlers.first().addClass('active');
$('.sppb-panel-collapse').css('display', 'none');
$panels.hide().first().removeAttr('style');


Add this code


$('.sppb-panel').removeClass('active');
$('.sppb-panel-heading').removeClass('active');
$('.sppb-panel-collapse').css('display', 'none');


-Thanks
Hi Toufiq,
thank you for detailed instructions.
Please direct to the filename and its location.

regards,
Udi


Thanks for your mail. Please check below path url and file name
components\com_sppagebuilder\assets\js\sppagebuilder.js

-Thanks
Hן Toufiq,

Thank you !!!

It works.

The 3rd row was missing .. any dammage? [ $('.sppb-panel-collapse').css('display', 'none');]

regards,
Udi


Hi, Thanks for your reply. No problem in future. Thanks


There are no replies made for this post yet.
Be one of the first to reply to this post!

Leaderboard (30 days)

Paul Frankowski

Paul Frankowski

Total Accepted Answers: 129
Sifat

Sifat

Total Accepted Answers: 88
Toufiq

Toufiq

Total Accepted Answers: 41
Pavel

Pavel

Total Accepted Answers: 6
Al Mamun

Al Mamun

Total Accepted Answers: 3

114

Templates

292559

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us