LMallon10 Posted December 8, 2021 Share Posted December 8, 2021 Site URL: https://amethyst-orchid-6rbh.squarespace.com/config/ Hi. So when designing my website, I have used a list section to allow users to choose between two options. However, I cannot find a way to allow the users to select their option by clicking on the respective image. Instead, they would have to click on the button below the image. Is there any way to set it so that members can choose their option by clicking on the image instead of having to use the button? I would prefer it this way as I feel as though the button looks unprofessional. Let me know! Link to comment
paul2009 Posted December 8, 2021 Share Posted December 8, 2021 1 hour ago, LMallon10 said: Is there any way to set it so that members can choose their option by clicking on the image instead of having to use the button? It should be possible with code, if you are on a business plan or above. However we can't view the site right now so we'll need you to set a password in the visibility settings and share it with us. LMallon10 and karleidei 1 1 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
Solution paul2009 Posted December 9, 2021 Solution Share Posted December 9, 2021 (edited) Thanks for the details @LMallon10 (sent by DM). I've published a solution here: Make Squarespace list items clickable. This takes the link that you've assigned to each CTA button and applies it to the entire list item. This means that users can click the image or any other aspect of an item to trigger the CTA action on your 'Simple' (not scrollable) List Section. If this post has helped you, please click a 'Like' or 'Thanks' icon below ⬇️ Edited October 17, 2022 by paul2009 edited for clarity 5018, LMallon10 and DrewSomething 3 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
DrewSomething Posted May 29, 2022 Share Posted May 29, 2022 (edited) Thank you @paul2009, this is great! Is there a way to have the image clickable/tappable to link, but remove the buttons so that it is just the pictures and their respective titles showing? Edited June 1, 2022 by DrewSomething tagged Squarespace Expert, corrected spelling mistake Link to comment
paul2009 Posted June 1, 2022 Share Posted June 1, 2022 On 5/29/2022 at 5:12 AM, DrewSomething said: Is there a way to have the image clickable/tappable to link, but remove the buttons? You should be able to hide the buttons with CSS. For example, something like: .list-item-content__button-wrapper { display: none; } DrewSomething 1 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
DrewSomething Posted June 4, 2022 Share Posted June 4, 2022 Thank you @paul2009. I've seen your responses everywhere in the forum. Much respect. paul2009 1 Link to comment
misa2022 Posted July 8, 2022 Share Posted July 8, 2022 Hi, @paul2009 I'm trying to make the list section item clickable using the code. But it's not working. Only buttons are clickable. I also used the CSS code to hide buttons. Each item has already assigned link to other page (within site). I'm still building the site so images and titles are just for placement. I'd greatly appreciate if you can help me for any possible reason. Thank you so much! https://iguana-trout-6w5m.squarespace.com/projects Link to comment
paul2009 Posted July 8, 2022 Share Posted July 8, 2022 (edited) On 7/8/2022 at 6:52 PM, misa2022 said: I'd greatly appreciate if you can help me The screenshot shows that the interactive 'Banner Slideshow' mode is being used. If you change this to 'Simple List' mode, the code will allow items to be clicked. Edited October 17, 2022 by paul2009 edited for clarity 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
baileyeidahl Posted October 17, 2022 Share Posted October 17, 2022 @paul2009 I tried your post with the code for making the list section images clickable and it is also not working for me. Are you able to help? Link to comment
paul2009 Posted October 17, 2022 Share Posted October 17, 2022 35 minutes ago, baileyeidahl said: I tried your post with the code for making the list section images clickable and it is also not working for me. There are no known issues so if it isn't working, do check that: you are applying it to a "list section", not a summary block or similar you've added it correctly to code injection footer If it still isn't working please provide a working link to the page on the site so that we can take a look. See How to Post a Forum Question if you need help with this. 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
baileyeidahl Posted October 17, 2022 Share Posted October 17, 2022 @paul2009 Thank you! the website is https://megankarp.com/ It's the section" Latest plus products" on the homepage. Link to comment
paul2009 Posted October 17, 2022 Share Posted October 17, 2022 1 hour ago, baileyeidahl said: It's the section" Latest plus products" on the homepage. Thank you for the link. The "Latest Plus Products" list section is using the Carousel design option, and so it is not possible to use the code in this case. When Carousel is used, the entire section can be clicked and dragged to allow users to scroll through the visible list and reveal more items. It is therefore not possible make these areas clickable to trigger the CTA. I hope that helps to explain. 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
baileyeidahl Posted October 17, 2022 Share Posted October 17, 2022 Ahhh okay that makes sense! thank you for your help! Link to comment
Swiftline Posted October 24, 2022 Share Posted October 24, 2022 Thanks @paul2009. This is a great solution. I appreciate you responding to each of these posts as well. I'm running into one issue: Even if I choose to have a URL open in a new window through the link editor, this solution opens the link in the same window. Is there a way to force links to open in new windows? Thanks in advance for the help. Link to comment
paul2009 Posted October 24, 2022 Share Posted October 24, 2022 27 minutes ago, Swiftline said: Even if I choose to have a URL open in a new window through the link editor, this solution opens the link in the same window. Are you testing this whilst logged out of the website, or whilst logged in? Links set to Open in New Window will always open in the same tab when you're logged into your site. 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
Swiftline Posted October 24, 2022 Share Posted October 24, 2022 @paul2009 Thanks for your response. This happens even if I'm not logged in. You can see it happening on the live version of the site now in the Highlights section of https://swiftlinestudio.com/ All of the items listed in this section have Open in New Window turned on in the Link Editor. Here's an example screenshot: Link to comment
MonicaW Posted November 7, 2022 Share Posted November 7, 2022 On 10/24/2022 at 2:41 PM, paul2009 said: Are you testing this whilst logged out of the website, or whilst logged in? Links set to Open in New Window will always open in the same tab when you're logged into your site. Thank you for sharing the linking solve. I am running into the same problem as @Swiftline - my Simple List links that are toggled to "open in new window" are not opening in a new window. I've tested using other web browsers, logged out. Swiftline 1 Link to comment
paul2009 Posted November 8, 2022 Share Posted November 8, 2022 9 hours ago, MonicaW said: my Simple List links that are toggled to "open in new window" are not opening in a new window. If it isn't working as expected then I recommend contacting Squarespace Customer Care directly. Swiftline and MonicaW 2 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
5018 Posted November 15, 2022 Share Posted November 15, 2022 Hi @paul2009, Thanks for this awesome solution! Just a note on what others have mentioned re: opening links in new window. I've removed your script from code injection and "open in new window" works as expected, so the issue doesn't seem to be on the Squarespace end. I know you're providing this for free and "as is" (and am very grateful that you do), just wanted to let you know 🙂 Thanks again! paul2009, MonicaW, tuanphan and 1 other 3 1 Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment