Search the Community

Hello - I used the following code found on another thread to auto-scroll my testimonials (I used a carousel summary block). It works great. However, I'm hoping someone can help me figure out how to slow it down. It's currently scrolling every 3 seconds. FYI - I'm new to using code. 🙂 Thanks a ton! <script> Y.on('domready', function () { var galleries = Y.Squarespace.GalleryManager.getGalleries(); for( i = 0; i<galleries.length; i++){ galleries[i].setAttrs({"autoplay":true}) } }); </script>

Site URL: https://domus-ie.squarespace.com/servicios-proyectos/autoconsumo I think general Animations with 7.1 is a great feature, but I often think if there is a way by coding to "make things" appear before, with less vertical scrolling. Any idea? Thanks a lot! 🤘

Hello, can you please help? I would simply like to have my site do the following: 1. When you click the back button in a browser, it takes you back to where you were on the previous page. Currently, it takes you back to top of page, which is frustrating if you were 10 images down in a gallery or on mobile. I am okay with a load time... 🙂 Is this possible on Squarespace? Example can be found here: https://www.nicholaskonert.com/art Thank you for your help and support.

Hey all, Im trying to add a fixed image to the background of a single page on my site. I want it for when the user scrolls down, the image stays in place. I found a tutorial online, but it doesn't seem to be working on my site... It might be perhaps because I am using 7.0. https://thirtyeightvisuals.com/blog/fixed-background here is the link to the tutorial. I attached the image I am wanting to use for the background.

Site URL: https://www.core4.com.au/ Hi! Hoping someone can help with this? I'm trying to achieve the same functionality as this navigation bar in the link attached. Transparent but changes to a fixed position and colour when scrolling. Thank you!

Site URL: https://www.dazeddigital.com/beauty Hi! I've recently started discovering the options Squarespace offers for site customization, but was left without answers on this question. Is it possible to create a Floating/Scrolling Logo, like the one the Dazed Beauty site has? If so, how would you/should I go about it? I appreciate the answers!

Site URL: https://bat-primrose-64j6.squarespace.com/config/ Hi, I wonder if anyone can help with a bit of code? I want the header logo to be invisible when you land on the page and only appear once you scroll down the page. There's a large hero logo on the first page so I don't want two logos on the screen at the same time. I've set the header to be fixed so that's sorted, it's just getting the code so the logo is invisible and then appears. Thanks in advance Jordan

Hi guys! I've seen a few websites with parallax scrolling on one of their pages and then the next page below is enabled. I think that's such a cool feature that I would love to implement. I searched the web for a long time to try to find the code for this but I just got this link https://blog.alexgittings.com/disable-parallax-on-one-squarespace-page/ with a code, but I have no idea where to put the code as it's poorly described. THIS IS WHAT THE ARTICLE SAID: To do this you will need to inject a script into the page. Navigate to the page cog and select advanced and enter the following: <script> Static.SQUARESPACE_CONTEXT.tweakJSON["tweak-overlay-parallax-enabled"] = false; </script> Once saved the parallax feature for that page should be disabled. But I have no idea where to put this code. Do any of you have any suggestions or know of another way? Thank you! Eager to hear back 🙂

Site URL: https://www.theraplant.com/ I've noticed that in all of the Squarespace sites (7.0 and 7.1) I've designed there is a design issue that allows one to scroll laterally on mobile. I'm no expert designer and I'm hoping this is a simple fix that I'm overlooking. I've attached an image of an exaggerated example of this issue. Ideally the mobile view will be fixed and no lateral scrolling will be possible...

Hey everyone! In 7.1, how would you set the header to a "Fixed position", on only one specific page? I.e., on all other pages it should disappear when you start to scroll. I've searched high and low and it appears that no one has addressed this issue yet. Any help would be greatly appreciated! Pierre

Site URL: https://briannaughton.uk Hi there, I'm really hoping someone can help me out - total newbie with custom CSS! I'm using a Brine 7.0 template. The header currently disappears when you scroll down the page, which I partly like. I found some code online which works for fixing the header (sticky header) but I basically want the best of both worlds, so that the header only appears if the user starts scrolling back up again. This is a menu option for 7.1 but not 7.0 7.1 menu option instructions: Click to the STYLE tab, then turn on Fixed Position using the toggle button. Make sure the next toggle underneath (you may have to scroll a bit) for Fixed Header Style is set to Basic. This means the header is visible at all times. If you instead select Scroll Back, the header is only visible when you start reverse scrolling the site back toward the top. ___________ It's the last bit of that - the 'scroll back' option that I want to use. The code I injected that works to fix the header at the top (make it sticky) is below (I have currently removed it from the site until I can figure out part 2 to the problem) /* Fixed Header */ Header { position: fixed; z-index: 9999; width: 100%; top: 0px; } .Content-outer { margin-top: 50px; } I guess there's an "if/then/else" component to it that I need to deploy but like I said I'm a complete newbie, if anyone has a workable solution I'd be delighted and very grateful! Thanks in advance, Brian

Site URL: http://www.courtney-crews.com/ Hi, I need help solving two things: 1. I want my images to scroll like these websites: https://www.arnaldoabba.com/ https://www.lukassuarez.com/LUKAS-1/Archives http://meaghancurry.squarespace.com/02hi3mtbqahiow24d6za5cgf8z4mab (this one seems buggy when the images load) 2. In Mobile View, I want to freeze the header at the top so when scrolling the viewer always has access to the menu.

Site URL: https://emsah.world Hi, I’d like to add custom CSS to my site in order to achieve an endless scroll/loop on my home page, where content would begin again seamlessly from the beginning/top of page once you reach the bottom. I’m hoping this works the same in reverse, where you could scroll seamlessly in the opposite direction directly to the bottom of page from the content at top. I would also like to remove the footer once I achieve this loop. Here is an example of what I am trying to achieve: https://codepen.io/vincentorback/pen/zxRyzj I’d really appreciate if anyone can share the solution/code to this! Thanks!! website: emsah.world

Hello, I have a Forte website and I would like to have my galleries scroll horizontally, not as a carousel, but simply one next to the other. I've been looking at this for years. Here's my website https://www.arnaldoabba.com/overview-1 Any help would be very much appreciated, thanks

Hi, I am looking at making a website that scrolls horizontally. A very simple site with title and menu in the top left hand corner. There would be a few galleries which I would like to scroll horizontally containing different sizes of images. I have already started something but the galleries only allow you to click through. Any help would be much appreciated .

Hi, Trying to emulate the scrolling content change effect of this page on SS - https://www.hioscar.com/app Any direction appreciated thanks. K Screen Recording 2020-08-19 at 12.48.46.mov

Site URL: http://www.sublimelashstudio.com I am not a website developer and have very limited knowledge of CSS or anything to do with websites. But, I can generally follow instructions and have managed to add a few custom CSS elements to my website. I'm having an issue that I know only some custom code can fix, but I don't know how to code and I'm hoping someone can help. The current issue I am facing is outlined here in a post someone made in February: https://forum.squarespace.com/topic/156546-primary-nav-anchor-link-scrolling-problem/ Short story is that I have an index homepage and I wanted to add anchor links to navigate to the different sections. I managed all of that and was enjoying the scrolling effects until I realized that if I navigate to another page on my site (not the index page) and attempt to click one of the navigation anchor links to bring me back to a section on the homepage, nothing happens. Or, it navigates back to the top of the homepage, but does not scroll down to the appropriate section. In the previous post, the suggestion was to create two separate sets of anchor links, one with /#section-name, and one with /home#section-name and then use custom code to have only one or the other display depending on where you are on the page. I tried this with varying results, but none worked completely. None of my other pages were showing in the navigation at one point, only the anchor links. I'm sure you can tell from my post that I am not super knowledgeable. My website works just fine without the anchor links, but I really love that scrolling effect and want to make it work. Please help.

Site URL: http://www.pantryphilosophy.com My site has parallax effect but it needs an arrow to indicate there is more content below the banner image. I would like this arrow to allow users to jump to the next section.

Hi friends, I am trying to trigger my navigation to change color after scrolling past the hero. Is there a way I can trigger the change by div or pixel? I currently have my nav as a sticky nav and want to keep that. this is what I'm working with. /*sticky nav https://forum.squarespace.com/topic/142732-brinekeene-sticky-navigation/#comment-184292*/ Header { position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; } // fix mobile nav .Mobile-bar--top { position: fixed; top: 0; left: 0; right: 0; background: #173d56; } .Mobile-bar { position: fixed; z-index: 99999; } // move mobile overlay down .Mobile-overlay-menu-main { padding-top: 80px; } any help would be GREATLY APPRECIATED link to site

Site URL: https://www.thirty-square.com I'm trying to figure out how to set my header section to change from transparent to a solid colour but only when the page is scrolled. Can anyone help?

Site URL: https://www.lsankowich.com/ Hello, I'm working on a site for my team's startup. Trying to create an affect where the banner image shrinks or collapses upon scroll, and the top navigation stays fixed. The site is currently hosted on a staging site, I'm not adept w/coding so any code snippets or suggestions would be greatly appreciated.

Site URL: https://www.libbypeterson.com Does anyone know what template has a scroll like this? If it isn't a template feature, is it something that can be easily added via HTML or CSS? thanks

Site URL: https://opticair.co.uk/ Using the Sonora template, I have my home page set up as several sections, with anchor links within a fixed position primary navigation to enable the user to quickly navigate around the page, with a tidy scrolling visual effect. This would work (and has worked) fine if this were the only page on my site, using the link format '#section-name' to take the user to 'domain.co.uk#section-name'. There are additional pages in my site, which the user can access through links within the body of the home page and on which the primary navigation is obviously still displayed. However, the primary navigation links in the format '#section-name' do not work from this page as they attempt to take the user to 'domain.co.uk/subpage#section-name' and the sections do not exist within the sub page. I addressed this by changing the primary navigation link format to '/home#section-name', which solves the problem when navigating from the sub page. However, now when using the links whilst already on the home page, the link takes the user to the correct section, but the scrolling effect does not always show. On the first click of a primary navigation link (whichever link) after loading the site, the page reloads, rather than scrolling, with the appended '/home' (from 'domain.co.uk' to 'domain.co.uk/home#section-name'), landing the user at the correct section. Upon clicking any further links, the scrolling effect shows correctly as the '/home' page is already loaded in the address bar. What I would like to achieve is that when using the primary navigation when already viewing the home page, the content always scrolls, whether it is the first click of a link or not. When clicking the link from any other page, it already correctly loads the home page at the required section; no scrolling is required here as the user is actually navigating to another page. Two possible solutions I can think of are either to force the site home page to always show its full 'domain.co.uk/home' url upon loading, rather than just 'domain.co.uk', or to make the primary navigation links dynamic so that on the home page they take the format '#section-name' but on all other pages they take the format '/home#section-name'. I do not know how to implement either of these ideas. I have also considered having the sub page content open in something like a lightbox, rather than a separate page, to avoid navigating away from the home page at all, but I expect the site to grow and this will not be suitable for all future content, so I would rather address this by other means. Can anyone help with implementing either of my suggested solutions, or does anyone have any other solutions? I have tried to be thorough but this seems like a lot of explanation for a simple issue! Hopefully there is a simple solution. Thanks in advance.

I am developing a website using the Minetta theme (latest version). When I am editing gallery content blocks, the scroll bar in the pop up window for the gallery doesn't work. This means I cannot scroll down to reorder images in the gallery. See screenshot attached. I have tried on Firefox, Safari and Chrome on two different computers and no luck. Could someone from Squarespace Dev team please look into this? Thank you.

Site URL: https://perfectingproperty.co.uk Hi please can you advise how to add scroll tags(?) at 20 or 25% increments, so I have a record in my analytics of how far people are looking on whichever landing page they're directed to? password is George version 7.1 Many Thanks - Lucy