Search the Community

Hi guys, For some reason, I have a client who dislikes the scrollbar on the right of his site (attached image, it's the thin gray vertical bar to the right of the site) Is there a code to hide it? Thanks, James

Site URL: https://hen-semicircle-g5hj.squarespace.com/ Hi All, I would like to hide the navigation bar during scrolling. If you see now, when I'm scrolling down, it disappear but when I'm scrolling up, it appears. https://hen-semicircle-g5hj.squarespace.com/ PW : bubu How do I disable it during scrolling? I would like it to appear at the top of the page only. Thank you very much in advance! Best regards, Adrian

Hi. I'm looking to find a way to keep my background image stable when user is scrolling. How can i lock the background image in place?

Site URL: https://tremont-demo.squarespace.com Hello, I'm looking to create this scrolling effect where you scroll down the page and then it returns to the top when you get to the bottom. Shown here on the TREMONT template. https://tremont-demo.squarespace.com The challenge is this template isn't available on the latest version of Squarespace and I've already designed my website and don't want to start completely over. Anyone know how to create this effect through custom code ?

Hi there, I have seen variations of this question asked but none of the suggested solutions have worked. I'd like to stop the header from reappearing on scroll-up, and only have it reappear once the user reaches the very top of the page, is its possible to achieve this just using CSS? Many thanks, Rory.

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.

I installed an anchor link on my homepage in Squarespace 7.1 and when i click the link it jumps to the section instead of scrolling down to it. I'm using a CODE block with a DIV ID in the section I want to scroll to. see code below: <div id="pp"></div> and for the text link I put: /homepage/#pp It doesn't scroll, it just loads the section that has the Code Block with ID. Any help is appreciated. Thx

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.

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

Hey! Wondering if I could get some code help on the site I design. https://www.zdigital.com/ I want to fix the nav to the top of the page when a user scrolls past the header, turning into a new color. #333333 Could not get the code in other posts to work for me on my site. I already have the following in CSS for other things. Not sure if I would need to change any of It if I'd need to body { text-align: justify }; p, h1, h2, h3 { -webkit-hyphens: manual !important; -moz-hyphens: manual !important; -ms-hyphens: manual !important; hyphens: manual !important; }; .collection-5e150xxxxx .transparent-header.view-list .banner-thumbnail-wrapper, .transparent-header.collection-type-page .banner-thumbnail-wrapper { padding: 120px 0 80px; }; .sqs-block.form-block .form-wrapper input[type=submit], { background-color:#044971; color:#fff} .sqs-block.form-block .form-wrapper:hover input[type=submit], { background-color:#066399;color:#FFF };

Site URL: http://collaborativeperformance.org Hi fellow Squarespace users 🙂 On our website we are currently using sticky navigation, so the navigation follows when scrolling on our page. I would really like to change that to a normal navigation that goes away when scrolling down, BUT that appears again when you, anywhere on the site, scroll back up just a tiny bit (not scroll all the way to the top). Unfortunately I haven't been able to google my way to a solution Does anyone know how to accomplish this? :-)

Site URL: http://www.haley-jensen.com Hi! I am using the Wells template on my site and am running into an issue. I have so many photo series that my drop down side bar is getting very long. When I drop it down and scroll down to view my templates, I end up scrolling past my gallery image to a full blank page. If you look at my website, open the sidebar and scroll down, you'll see what I mean. Is there a way to make the gallery static, without "fitting to page" because when I fit to page it cuts off my image. Or maybe there's a way to fit it to the page without cutting the image? If anyone has any guidance on this please holler! I don't know too much about code other than basics... Feel like it should be a pretty simple matter to fix but I don't have the key! Best, Haley

Site URL: http://pureimagevideography.com Has anyone had any luck removing either the lower or side scroll bar? I don't particularly like either one of them showing on my page but the lower scroll bar is showing a portion of a background image I don't want shown & the scroll bar at the bottom just brings your attention to this issue. Any one have any luck with a code? All the other ones I've tried don't work the way I. was hoping they would.

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 🙂

I have been given the task of admin on a site and I am totally unfamiliar with SqSp. (I am otherwise a developer that usually develops on other platforms/CMS's) The issue with the site is that the page is too wide for mobile and causes a chronic amount of horizontal scrolling. The previous developer apparently found a solution by adding the viewport meta tag to the Custom CSS area! {huh??}. While this does fix the horizontal scrolling issue, it introduces an error in the Custom CSS (of course) and then the standard formatting on desktop/laptop causes the #page content to be narrower than it should be. The template in use is Bedford and this is the meta tag code added in the Custom CSS area: <meta name="viewport" content="width=device-width, initial-scale=1"> (I have tried adding this to the 'Advanced' area of Page Settings - and removing it from the Custom CSS, but it has no effect. Still too wide on mobile, but desktop display returns to normal width) I would love it if anyone more familiar with SqSp might be able to point me in the right direction please. I've tried having a look via browser devtools but I can find nothing. NOTE: ** if viewing in a browser, only Chrome emulates the mobile display issue correctly. Firefox does not. The mobile display of the site in SqSp admin also displays correctly. The site is at robe.com.au Thanks in advance if anyone should have a look.

Site URL: https://www.nateburdette.com/ Hi all, I'm wondering if there's a way to eliminate the slight scroll on my homepage on mobile. There's not much content, and I want the homepage to not scroll at all. (I'd like to even remove the scroll bar, like my homepage on desktop.) This code does the trick on desktop, but doesn't seem to be working on mobile. header#header { margin-top: 0; padding-top: 3vw; } Any help at all would be greatly appreciated!

Site URL: https://www.christysellstampa.com/search-mls Disclaimer: Total amateur at work I've inserted html IDX code into my site using a code block. The result should look like the first image attached here -- you should be able to see the entire search form with no scroll bar. No matter what I do, I can't get my site to show the whole search form. Instead, the site cuts off the search form and adds a scrollbar. Below is the code. Help, help! <iframe src="https://stellar.mlsmatrix.com/Matrix/public/IDX.aspx?idx=707e52cd" width="100%" height="100%" frameborder="0" marginwidth="0" marginheight="0"></iframe>

How can you adjust the scrolling on your page to simply flip the content instead of the typical/continuous scroll?

Hello, I have an image that I want to prevent from getting too small while on mobile. Initially, the image would just scale with the screen size, forcing the entire image to be visible on mobile. I've restricted it within the Custom CSS by setting the min-width to 600px for the image, but now it is no longer becoming too small, but I am unable to scroll horizontally to access the full image. Does anyone know how to allow horizontal scrolling on a single image? Thanks in advance for any help!

I would like to find the code to stop the logo from scrolling along with the site on the Tudor template. Either that or put a white background behind it. Any suggestions? Thanks so much! :)

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 all, Looking for some help in trying to do a fixed header on the Mentor template. Any help is much appreciated! Thanks!

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.

Hi everyone. I'm using Squarespace as a tool to post announcements in my app, like the following screen. (Banner A/B/C is different pages and click them can open a in-app webview of that page. I already got few of them running on my app.) FYI image >>> https://imgur.com/axl1UQj My question is: Can I use Squarespace to automatically combine all my pages as a continuous view? For example, when I open Banner A, I can scroll to the bottom of it and Banner B can automatically show up and Banner C/D/E... etc. Which means, after click every banner, it still shows its page but you can scroll up and down to see former/later pages. I saw there is Infinite Scroll function in tutorial, but only for certain template and I'm not sure it's suitable for my case. https://support.squarespace.com/hc/en-us/articles/217417087-Infinite-Scroll Please share the solution with me or where I can find the answer. Thanks and happy new year!

Hello ! I'm wondering if there is any way to modify the index navigation tool in Brine template, so it can display sections titles at all time. I'm talking about this kind of side bar, displayed as dots, radio, or bars... The sections titles are only visible while you hover the dots. The idea would be to keep them visible, so it would look like a index side menu. Thank you !