Accordion Panels

[Judy Asman]

Hi, Andre,
Thanks for including an accordion feature in this theme. I usually use a plugin but really like your built-in version, especially that we can change the colors of each panel heading.

I’m customizing mine now. When you’re available, will you please let me know how I can delete the wide gap that appears between panel headings? I worked from the code you have in the demo but for some reason the spacing appeared on my site. http://64.78.29.189/wp/members/

Thank you!

[Sushil Adhikari]

Are you using a plugin that does grids or something? This I found:

#pg-65-0, .panel-grid-cell .panel {
margin-bottom: 30px;
}

The class .panel is adding 30px to each accordion panel in the theme’s code because mine has a class of .panel as well. I’m guessing I need to update the HTML snippet for the accordion code because I changed the class on mine to go from .panel to .cir-panel so it doesn’t conflict with plugins.

In your code, you can fix it by adding cir- to each of your panel’s class .panel

…becomes

[Judy Asman]

Thanks, Andre! That took care of that padding issue. :cheer:

I’ll look for the plugin that may be adding that extra panel styling. Meanwhile, now that the spacing issue is fixed, I notice that when I open one panel and click on the next one below it, that it is no longer closing the previous panel before opening the next one.

Can you please tell me what I need to adjust to fix this? My guess is it’s also in the div classes. Correct?

Thank you again 🙂

[Sushil Adhikari]

It will close if you click it again, but my guess something else is conflicting with the script so it doesn’t close when you click on another panel…more likely a plugin. The accordion I use is from Bootstrap but it uses jQuery (in this case jQuery that WordPress uses).

[Judy Asman]

Thanks — I’m going to look for the css style you mention above and see if I can deal with the issue that way. I checked all of my plugins but to no avail. I’m sure I’ll find it.

Thank you again for all of your help and hard work.

[Judy Asman]

Hi, Andre,
The good news is, I found the culprit. The good and bad news is that it was the Site Origin page builder plugin that was conflicting. The good news to this is that I prefer to use the classic page editor for this page and was going to switch out of page builder anyway.

But I thought I’d give you a heads up in case you receive another question about this. I hope this helps.

Thanks again for everything!

[Sushil Adhikari]

Thanks for the information as it will help others who might experience the same thing.

[Judy Asman]

You are welcome!

[Author]

Posts