Nested Content Toggle

  • Resolved greentreefrog

    (@greentreefrog)


    1 year, 11 months ago

    I am using Content Toggle for FAQ’s and that part works fine. However, I wanted to put “References” at the bottom of the first panel and not display the actual references until someone clicks on “References.” Theoretically, if I inserted a Content Toggle box inside the first FAQ, I could get exactly what I want.

    I have all panels closed by default when the page first loads and that’s working fine. The problem is that the “References” Content Toggle is ALWAYS open as soon as its parent’s FAQ is open after the page first loads. If I click on it to close it, it works fine. If I click the parent closed after I click “References” to close and then reopen the parent, “References” is still closed, which is perfect.

    I have the settings on the child set to “Collapsed” and “Collapse on Mobile.” For the parent, “Collapsed” is also set but “Collapse on Mobile” is not.

    When I inspect the HTML, the div attributes for the child for data-mobilecollapse and data-desktopcollapse are both set to “true”, yet the panel is showing. The div tag around the panel does not have the “ub-hide” class until I close it manually. In fact, it doesn’t have “ub-hide” on it when the page first loads either, even though the parent panel DOES have the “ub-hide” class initially. I think if “ub-hide” were added to the child when the page loaded, everything would work perfectly.

    I could fix this with my own JavaScript but if you’d like to fix it, I would be most grateful!

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter greentreefrog

    (@greentreefrog)

    I just added my own JQuery so you won’t be able to see the problem on my page anymore. I added my own class to the inner content toggle block. Here is the resulting JQuery code, which runs once after the page is loaded:

     function mjbHideNestedToggle() {
        $('.mjb-ub-inner-toggle .wp-block-ub-content-toggle-accordion .wp-block-ub-content-toggle-accordion-content-wrap').each(function(){
            $(this).addClass('ub-hide');
        })
    }

    Everything is perfect now!

    Please let me know if you update the plugin to handle this so that I can remove my code.

    Thanks!

    Plugin Contributor Alexis Pandaan

    (@alexius08)

    Hi @greentreefrog ! A recent update to the way WordPress handles blocks that contains inner blocks introduced bugs to the rendering of our content toggle block. We’ll be including a fix for this to the upcoming version of the plugin, which would hopefully render your custom fix redundant. We’ll let you know when it becomes available.

    Plugin Contributor Alexis Pandaan

    (@alexius08)

    Hi @greentreefrog ! We’ve released a new version of the plugin that includes a fix for your issue with the content toggle block. All new instances of the block should no longer have that problem. For your current content, you can make new content toggle blocks and copy the contents of the old ones there, which should work without your workaround.

    Please let us know how it goes.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Nested Content Toggle’ is closed to new replies.