Multilevel (or Nested) Accordions

Unfortunately this is a limitation with WordPress. You can’t nest shortcodes of the same name within each other. The only way to achieve what you’re looking for would be to use another accordion shortcode as your inner shortcode, which might cause other issues.

I think the complexity of the code required to implement this within my plugin is too high for me to be willing to tackle it. My goal is to keep this plugin as lean and simple as possible. I’m sorry it couldn’t be more helpful.

Thanks.

Could you do a workaround by creating multiple shortcodes calling the same main function and then using these different shortcodes? So whatever function accordion calls.

add_shortcode(‘accordion2’, ‘SAMEFUNCTION’);

Code

[accordion clicktoclose=”true” scroll=”true” openfirst=”true”]
[accordion-item id=”Parent Accordion 1″ title=”Parent Accordion 1″]
[accordion2 clicktoclose=”true” scroll=”true”]
[accordion2-item id=”Child Accordion 1″ title=”Child Accordion 1″]
Child Sample Text 1
[/accordion2-item]
[accordion2-item id=”Child Accordion 2″ title=”Child Accordion 2″]
Child Sample Text 2
[/accordion2-item]
[/accordion2]
[/accordion-item]
[accordion-item id=”Parent Accordion 2″ title=”Parent Accordion 2″]
Sample Text 2
[/accordion-item]
[accordion-item id=”Parent Accordion 3″ title=”Parent Accordion 3″]
Sample Text 3
[/accordion-item]
[/accordion]

I suppose in theory that would be possible yes. You could easily modify the plugin to suit your needs.

So what is the function that the accordion shortcode points to that I would put in SAMEFUNCTION?

Thanks.

You should be able to duplicate these two lines of the plugin and update the shortcode names to (accordion to accordion2 and accordion-item to accordion-item2).

I haven’t tested this though, so you’re in uncharted territory. You should also back up your changes. Otherwise the next time you update the plugin it’ll override your changes and you’ll have to make them again.

Thanks Phil.

It was worth a shot but it did not work. I have a screenshot but cannot see where to attach the file.

Code added to accordion-shortcodes.php

add_shortcode('accordionchild', array($this, 'accordion_shortcode'));
add_shortcode('accordionchild-item', array($this,'accordion_item_shortcode'));

I created two widgets – Multilevel Accordion and Child Accordion Test.

Multilevel Accordion Code

[accordion clicktoclose="true" scroll="true" openfirst="true"]
[accordion-item id="Parent Accordion 1" title="Parent Accordion 1"]
[accordionchild clicktoclose="true" scroll="true"]
[accordionchild-item id="Child Accordion 1" title="Child Accordion 1"]
Child Sample Text 1
[/accordionchild-item]
[accordionchild-item id="Child Accordion 2" title="Child Accordion 2"]
Child Sample Text 2
[/accordionchild-item]
[/accordionchild]
[/accordion-item]
[accordion-item id="Parent Accordion 2" title="Parent Accordion 2"]
Sample Text 2
[/accordion-item]
[accordion-item id="Parent Accordion 3" title="Parent Accordion 3"]
Sample Text 3
[/accordion-item]
[/accordion]

Child Accordion Test Code

[accordionchild clicktoclose="true" scroll="true"]
[accordionchild-item id="Child Accordion 1" title="Child Accordion 1"]
Child Sample Text 1
[/accordionchild-item]
[accordionchild-item id="Child Accordion 2" title="Child Accordion 2"]
Child Sample Text 2
[/accordionchild-item]
[/accordionchild]

Child Accordion Test worked so WordPress recognized the code.

Multilevel Accordion Example did not work. When placed inside the parent accordion shortcode the overall child accordion just appeared open for each accordion item.

Here is an article the might help if you decide to tackle this in an upcoming update. https://articles.runtings.co.uk/2015/03/supporting-nested-shortcodes-in.html

Thanks again and have a great weekend!!