Inline accordion or content toggle

[hivehouse]

Is there a way to use global blocks, then insert its shortcode into paragraph text, such that, the accordion or content modal text toggle would be inline with the end of the paragraph text instead of being bumped down to the next line?

[nico]

Hi @wbgTHEMECO,

Thanks for writing in.

Not sure what are you trying to create or achieve. Would you mind sharing us more details on what you want to achieve.

You can use shortcode of an accordion to inserted inside a paragraph using raw html element. Not sure if that what you meant however you could give it a try.

Thanks.

[hivehouse]

Hi Nico.

I’ve added a secure note with the link to the page. Can the read more link be inline with the paragraph copy, instead of below the paragraph copy? I had tried doing this with a global block shortcode, but it still put the read more link below the paragraph copy.

[christian]

Hey @wbgTHEMECO,

It is not structurally possible even if you use Global Blocks. What you can add a link to your paragraph that will trigger the accordion. Here’s a sample code.

jQuery('.test').click(function(e) {
	e.preventDefault();
	jQuery('#tab-e1635-5').trigger('click');
});

Here’s how it works. You will need to change the selectors in that code. It will work with your current setup but if you will update your content, that code might not work because the tab button ID (tab-e1635-5) might change because it is dynamic. If that happens, you can show that code to a developer so he can update the code for you.

Hope that helps.

[hivehouse]

I see where you are going and followed your example (and the video), I unfortunately get a range error. I’m guessing this is out of scope for support, but I’ll keep this option around in case the stack size error can be resolved.

Uncaught RangeError: Maximum call stack size exceeded
at new a.fn.init (jquery-migrate.min.js?ver=1.4.1:2)
at n (jquery.js?ver=1.12.4:2)
at HTMLAnchorElement. ((index):1391)
at HTMLAnchorElement.dispatch (jquery.js?ver=1.12.4:3)
at HTMLAnchorElement.r.handle (jquery.js?ver=1.12.4:3)
at Object.trigger (jquery.js?ver=1.12.4:3)
at Object.a.event.trigger (jquery-migrate.min.js?ver=1.4.1:2)
at HTMLButtonElement. (jquery.js?ver=1.12.4:3)
at Function.each (jquery.js?ver=1.12.4:2)
at a.fn.init.each (jquery.js?ver=1.12.4:2)

[paul.r]

Hi,

I don’t see that error anywhere in your site.

Can you provide us a step by step instruction on how we can replicate it so we can check.

Thanks