I'm trying to add an accordion/dropdown to a website (it's still in trial at the moment so can't share web link). It is going to be used on a page showing the team of a company, so within each entry it also needs to include a picture of them.
I have used the standard markdown used for an accordion, which by itself (without an image in it) works fine. I have then used an HTML image reference within it, and when it does this, only the first name appears. And when it is opened/clicked, the next name then appears below it (and so forth). But then when you close the top name, they all disappear (apart from the top one).
I have also tried created an animated collapsible using HTML, CSS and Java (https://www.w3schools.com/howto/howto_js_collapsible.asp). This code was copied exactly, using a code block for the HTML, adding the CSS into the custom CSS, and adding the Javascript into the page specific code injection. The list options are created, but don't actually open when clicked on.
If anyone can provide any insight into how to get either of these solutions to work that would be greatly appreciated. Screenshots are attached for reference.
Question
jamesmabrown
Hello,
I'm trying to add an accordion/dropdown to a website (it's still in trial at the moment so can't share web link). It is going to be used on a page showing the team of a company, so within each entry it also needs to include a picture of them.
I have used the standard markdown used for an accordion, which by itself (without an image in it) works fine. I have then used an HTML image reference within it, and when it does this, only the first name appears. And when it is opened/clicked, the next name then appears below it (and so forth). But then when you close the top name, they all disappear (apart from the top one).
I have also tried created an animated collapsible using HTML, CSS and Java (https://www.w3schools.com/howto/howto_js_collapsible.asp). This code was copied exactly, using a code block for the HTML, adding the CSS into the custom CSS, and adding the Javascript into the page specific code injection. The list options are created, but don't actually open when clicked on.
If anyone can provide any insight into how to get either of these solutions to work that would be greatly appreciated. Screenshots are attached for reference.
To confirm, I'm using the Henson template.
Many thanks,
James
Link to comment
Top Posters For This Question
2
6
11
6
Popular Days
Jan 13
3
Jan 17
2
Jan 10
2
Jan 12
2
Top Posters For This Question
alejoreinoso 2 posts
laurensmithart 6 posts
tuanphan 11 posts
jamesmabrown 6 posts
Popular Days
Jan 13 2021
3 posts
Jan 17 2021
2 posts
Jan 10 2022
2 posts
Jan 12 2022
2 posts
Popular Posts
jamesmabrown
Just an update, this has now been resolved. For anyone that wants to do something similar in the future, the full code is here. HTML here <div class="row"> <div class="col"> <
tuanphan
I think this is require a lot of code. You should post this on some FB groups to hire some devs Squarespace Customization Resource Group Squarespace Community (I don't offer service)
Posted Images
25 answers to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment