Guest Posted July 26, 2020 Share Posted July 26, 2020 Hi, Most sites allow the creation of a Main page that is a clickable link to all dropdown sub pages. Example Products-clickable link that takes you to every page listed below as a grid display of all products. product-A dropdown menu, clicking this takes you to product A product-B dropdown menu, clicking this takes you to product B product-C dropdown menu, clicking this takes you to product C Is there a way to do this on squarespace? I see you can make folders with a dropdown menu, but then the folder itself is not clickable... Thanks Link to comment
derricksrandomviews Posted July 26, 2020 Share Posted July 26, 2020 (edited) Possible but under certain parameters. 1. You can have an index page with thumbnails of all the pages in that index but you cannot put an index page in an index page. 2 You cannot put a folder in an index page either. Folders cannot go into folders. 3, Summary Blocks on a page work like an index and they can be placed in an index as well. Summaries in 7.0 pull content from blogs, projects, shop pages and gallery pages. This explains things a bit more. https://support.squarespace.com/hc/en-us/articles/205813748-Folders-vs-Index-Pages and this would be good for you to see as well: https://chloeforbesk.com/blog/squarespace-drop-down-menu Edited July 26, 2020 by derricksrandomviews Link to comment
tuanphan Posted July 27, 2020 Share Posted July 27, 2020 Hi. If you share link to your site, we can give the code to make folder title clickable. Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Guest Posted July 29, 2020 Share Posted July 29, 2020 Hi thanks for replying, my site is not currently published yet. Here is a code injection I did to make a products folder a clickable link. <script> (function() {window.addEventListener("load",function(){ var tours = document.querySelector('[href="/products-folder"]'); tours.addEventListener("click",function(){ window.location="/products"; }); })} )(); </script> It is working for desktop view, but not mobile view. On desktop view it makes the screen flash twice like the page has reloaded as well though. Any idea or suggestions to fix this? Link to comment
derricksrandomviews Posted July 29, 2020 Share Posted July 29, 2020 (edited) It will not work on mobile, due to the fact that mobile has no hover function. Mobile viewers have to touch the folder to open it, if it were to work they would not able to select any item in the folder other than the page the clickable folder goes to. Edited July 29, 2020 by derricksrandomviews Link to comment
Guest Posted July 29, 2020 Share Posted July 29, 2020 15 hours ago, derricksrandomviews said: It will not work on mobile, due to the fact that mobile has no hover function. Mobile viewers have to touch the folder to open it, if it were to work they would not able to select any item in the folder other than the page the clickable folder goes to. I think it is wise for me to simply hope for an update in the future, that allows Folders to be clickable like most websites. The site is now published https://www.octaneworkholding.com/index.html , but on mobile view the gallery on the homepage has a lot of white space above and below. Is there a way to reduce this? The SSL security also is working right yet, it is pointing to my domain. Link to comment
derricksrandomviews Posted July 29, 2020 Share Posted July 29, 2020 (edited) SSL certificate propagation, it takes about a day for it to make its way thru the internet. This code is used by many to clean up some of the empty white space on mobile: Add to LAST LINE in Home > Design > Custom CSS @media screen and (max-width:767px) { #page article section:first-child { padding-top: 20px !important; } } Edited July 29, 2020 by derricksrandomviews Link to comment
Guest Posted July 29, 2020 Share Posted July 29, 2020 I tried this, it does not change anything? Thanks Link to comment
derricksrandomviews Posted July 30, 2020 Share Posted July 30, 2020 Well, if one thing doesn't work try something else: @media screen and (max-width:640px) { body { margin-top: 0 !important; } } Link to comment
jun2023 Posted May 24 Share Posted May 24 I tried to override it on mobile like have a click event on the span tag of the text while the arrow icon in its default action of opening the sub pages but still it doesn't work. I think this kind of set up is quite good, right? 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