Jump to content

Customised Nested Accordion Block

Recommended Posts

Posted

Hi, 

No experience coding here but I want to use this code - https://codepen.io/Maja-Shapiro/pen/ExzQKWL - as a nested accordion to present content from a report on our website. We want to be able to toggle between the chapters, sub-chapters, images, graphs, key takeaways and so on. 

I have tried pasting the HTML, CSS and JS codes both individually in the custom CSS, code block and code injection footer, as well as all into the same code block but neither is working.  It ends up incorrectly formatted in the top left corner of the page. See website - j12ventures.com/whatsnexttest (password: pw1234). 

Would appreciate any help with this, how I can create multi layered accordions and add my own content, or if you have other suggestions of how we can present the report in an intuitive way on the website through the accordion module that already exist in Squarespace. Any help is much appreciated!

 

  • Replies 1
  • Views 968
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted

@mrsj12 Hi there! We can set up a main accordion along with nested accordions inside it using custom CSS and JavaScript. Implementing this feature may take some time and effort. Unfortunately, there's no quick solution for this.

If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. 

Sam
Web Developer & Digital Designer

 Did you find my contribution helpful? Buy me a coffee?

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.