Jump to content

Accordion Help. (It works when it wants to)

Go to solution Solved by paul2009,

Recommended Posts

Site URL: https://tulip-ranunculus-xc8d.squarespace.com/build-your-trip

Hello,

I have coded accordions for my website and they seem to work for some people and not others.

I've been able to recreate the issue where the accordions don't open on google chrome and mobile view via google chrome. 

I'm not seeing any particular errors in the console that is pointing to this issue.

Could anyone see if they are able to recreate this issue in chrome or if they are able to help?

https://tulip-ranunculus-xc8d.squarespace.com/build-your-trip

Password: "SuperTrip"

Link to comment
4 hours ago, Dhowbearcat said:

Site URL: https://tulip-ranunculus-xc8d.squarespace.com/build-your-trip

Hello,

I have coded accordions for my website and they seem to work for some people and not others.

I've been able to recreate the issue where the accordions don't open on google chrome and mobile view via google chrome. 

I'm not seeing any particular errors in the console that is pointing to this issue.

Could anyone see if they are able to recreate this issue in chrome or if they are able to help?

https://tulip-ranunculus-xc8d.squarespace.com/build-your-trip

Password: "SuperTrip"

I used Edge and can't reproduce the issue, did it just randomly show up

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Keyword Highlighter
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
6 hours ago, Dhowbearcat said:

I have coded accordions for my website and they seem to work for some people and not others.

You are using a Brine-family template and this issue is because of Ajax Page Loading. I wrote about this issue and how to solve it here: Why does Squarespace code only work on refresh?

You can reproduce the issue if you use an incognito window to visit your homepage first. Then, navigate to the 'build your trip' page using the page link. You'll see the accordion doesn't work. When you refresh the page, the accordion will work.

Improve your online store with our extensions.
About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Buy me a coffee

Link to comment

@bangak36 - It would work for me then it would randomly do this. I've had others test it sometimes it works sometimes it does not.

@Paul2009 - Thanks Paul I was afraid this was going to be the issue. I disabled the Ajax loading. And it seems fine now when I try to recreate the issue. I'm going to have others test on different browsers and devices.

Link to comment
Quote

And it seems fine now when I try to recreate the issue. I'm going to have others test on different browsers and devices.

I followed paul2009's steps yesterday and was able to reproduce the issue.

I tested again after you made the change, just now, it appears to be working fine.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment
  • 2 weeks later...
  • Solution

If you are having difficulties with custom coded accordions, you may want to know that Squarespace launched a new Accordion Block yesterday.

This new native block doesn't require custom code and is therefore safer and easier to install.

spacer.png

It is ideal for FAQs and product specifications. You can choose and style the icon, add dividers and change row padding. For more information see Accordion blocks.

Improve your online store with our extensions.
About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Buy me a coffee

Link to comment

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.