Search the Community

Hi, How can I remove the $ sign from my restaurant menu items. I found one post which gave the following code, but it didn't work on my Brine template. body.native-currency-code-usd .sqs-money-native:before { content: none; } Any help would be appreciated. Thank you

Hello everyone, I'm trying to display my navigation menu vertically instead of horizontally on my website : https://coconut-bagpipe-9nzc.squarespace.com/home I would highly appreciate your help as I've been trying for a few days to find this out ! Thank you Robin

Hi all, I'm looking for the right code to change the font on my menu navigation bar and buttons on the Colima template header. I've successfully applied the custom font to every piece of text except for the header and buttons, and nothing I've seen online helps so far. Any ideas? Thanks in advance!

Hi, Guys. I've just published my website and everything seems cool, except for the Hamburger Menu on a few mobile devices. It should appears in the right corner but it's placed under the logo but only in iPhones with bigger screens. I've already tried to open in Safari and Chrome from 2 different devices (iPhone 6s Plus and iPhone 8 Plus). It shows correctly on smaller iPhones (tested on iPhone 5 and iPhone 7). On Androids it seems to work properly. I've also try using a smaller logo for mobile version but still getting the same result. Searched for some light on Forum but no one was talking about that. I'm including a screenshot of the problem. Thanks in advance!

Hi everyone, I need your suggestions 🙂 . I've been contacted by a client to be whose site has been designed on SS 7.0 with Brine (not by me). Their compagny is growing and today they have 3 activities on one single site. They would like to separate the 3 activities while keeping (if possible) one single site. So their request is : 1) have a welcome page with these 3 activities only 2) have a different visual identity ie logo and navigation menu for each of the 3 activities. I have no problems with doing 1) but I'm not sure about 2) : you can have distinct logos on different pages ? or distinct navigation menus ? So far the options I have in mind is design a welcome page with the 3 options and hide header/footer with css, and redirect each to an index page. I can add a different logo on each index page but not sure about the navigation menu. I've been given the advice to hide some elements of the menu with css but not sure how to do that ? Thanks for your suggestions !

Hi all I have searched high and low through the forums and Googled my heart out, but I cannot find a straight forward answer to what seems to be a simple query. I am using the Brine template and forcing the mobile menu to display on desktop — this was relatively straight forward by adjusting the mobile breakpoint — but standard behaviour shows pages nested within folders hidden until you click through to the folder on mobile menus. To improve the UX, I'm looking to expand the nested pages within the mobile menu WITHOUT clicking through to the next level of the mobile menu to see all nested pages. In the Wells template for example, on desktop, all nested pages are expanded automatically and this is the type of behaviour I'd like to see in the mobile menu on Brine. Can someone please help me out with some code here? I've exhausted most solutions I'm aware of. I also think this information would be valuable to the forum and other users searching for this query 🙂 Thanks Sarah

Hi folks, I'm building a website for a client, and I'm debating whether to use Squarespace for them. The deal breaker will probably be if I can achieve the following: I want to be able to place a small image above a menu item when that page is loaded, to indicate which page is currently live. It might also be good to have this image appear over the menu item when it's hovered over too. Does anybody think this might be possible? I've attached an image with an illustration of what I'm hoping to achieve - it's that curved orange line currently above 'HOME'. Many thanks!

I was a bit disappointed to read that sublayers in the Nav are not yet supported. I love the ability to add products and have drop down lists for product specificity but I feel the lack of organization right there in the menu might junk up my users online experience as there will be hundreds of products on the site. Does anyone know if adding a CSS navigation menu created by a CSS menu maker will work? Can the code be successfully implemented into Squarespace in lieu of the built in one? Many great attributes to Squarespace but I find this one troubling for me. It may not be a deal breaker if I can find a work around or somehow creatively organize the products.

After adding a custom menu with multiple language options, for which it is important to add the language es / en / fr / de at the beginning of a URL. It doesn't seem to function completely, except for the English version. When navigating through the main navigation for Spanish/French/German website it seems to work: http://www.dametulengua.org/es/school, until entering into a blog post such as this one http://www.dametulengua.org/escuela-2/es/tallerconversacional. The top navigation titles suddenly changes to English (I have no idea why it changes to English out of all four languages). How can I edit this? Does it have to do with the page being a blog post of which I can't edit a custom URL? Moreover, I can't seem to hide the menu in the top black part, due to custom code, is there a way to hide this?This is because we get more mobile users, but the custom menu doesn't work for them so I manually added navigation in red text on all pages, to make it work on mobile. However on the desktop version, this leads to both the menu in the black header and the red added text menu showing up. Thank you in advance.

Hi, does anyone know how to reduce the width of a dropdown header menu (from a Folder) in 7.1.? I am building a multi-lingual website, and the menu looks quite odd being significantly wider than the options (see screenshot). Any help would be great!

Hello everyone. Please help me, this is really turning me mad. I can't find a way to change the fonts of the menu on the mobile version of my website. I'm a real noob at CSS but could find a way to copy some code from the forum to design my website. Unfortunatly, there's nowhere I can find a code that's working. I only want to change the font of the sections in the menu. Tanks for your help, I've been searching for days now... Here's the CSS I tried to use: main-nav {font-family: 'FAVORIT'; font-weight: 200; font-style: normal; font-size: 30px; letter-spacing: 0em; } Thank you so much for helping ! You can find my website here: t1bureau.uk

I've done tons of food sites before, but I had to use a menu block "tabs" based menu for the first time. Shouldn't the underline switch when the taxonomy is active? Reason to have them in the first place was for easy use on mobile... but it's even worse accessibility there. I've cleared cache etc.

Anyone know how to add social icons to the mobile menu?

Hi. I've noticed that the hamburger icon on 7.1, which on my site comes up with a narrow window or on mobile, is strangely only 2 lines rather than the standard 3. I've had feedback from a friend saying that it might not be immediately clear on mobile that the 2 thin lines lead to a menu, whereas a bolder one with the usual 3 would be more obvious. The helpdesk told me there's no way around this apart from with custom code so can somebody please help me with how to achieve this?

It's possible I'm overlooking something totally obvious, but I'm trying to figure out the CSS to create an in-page dropdown menu that someone would click on and have the option to click on links to multiple other pages or files. I don't just want a standard button that links to one thing. I'm looking to create something like pictured in this image: Please help! Thanks!

Id like to change the mobile menu navigation "MENU" in Wells to a logo (PNG). is that possible

Hello all, I would like to change the default menu icon + interaction to the one I found on this code-pen page: https://codepen.io/yousafkhan/pen/XWWJQyp I'm using the Sofia template. Does anyone know how I'd be able to do this?

is it possible to add a background image to the menu mobile display?

i'm trying to build my own website but i would like to edit my mobile version of it. so i wish to have the menu and the logo on top of my image banner on the top. i provide examples

I want to group Menu items under one folder but I don't want the top level item to go anywhere. e.g. Shop Menswear Womenswear Kidswear In that example, Menswear, Womenswear and Kidswear would fly out when the cursor hovers on Shop but if you click on Shop nothing happens. How do I do this??

I designed a one-page website, the page will scroll down when you click the selected item in the top of the menu bar in desktop mode.The Problem is that in mobile mode( will change to hamburger menu), even when I clicked the selected item, the menu panel doesn't go away due to the one-page design which won't reload the page.

I designed a one-page website, the page will scroll down when you click the selected item in the top of the menu bar in desktop mode. The Problem is that in mobile mode( will change to hamburger menu), even when I clicked the selected item, the menu panel doesn't go away due to the one-page design which won't reload the page.

Hey all, Just thought I'd share my little hack to create navigation on a group of subpages belonging to the same folder in the main navigation. Disclaimer: This was done in somewhat of a hurry, and I haven't used jQuery in a long time, so there's likely a more efficient way to code it. If you know or come up with a better way, please do share it! The way to use this, is simply by creating a folder in the main navigation with pages in it. Then on each page, using the code block, insert a DIV with the ID "pageMenu". Then add the code below using code injection to all pages (Settings > Advanced > Code Injection) in either the Header or Footer, making sure to replace "yourdomain" with – you guessed it, your domain 😉 The code first checks if a DIV with ID "pageMenu" exists on the page currently being viewed. If it doesn't, the code won't run. If it does exist, the code then looks through all Main Navigation folders for a match between the current page url and links inside those folders. If one is found, that parent folder's code and all the links inside it (basically a UL list) will be appended to the DIV with ID "pageMenu". All you need to do then is style it using some custom CSS. Also, I wanted to make it possible for the guy responsible for the content on this site to hide any folders with subpage menus on its pages. So to do that, using this code, all he needs to do is name the folders "Foo" (feel free to change this). If you do this, chances are you might want to also hide the folder name from the new page menu, which the code below also does. FYI 1: Of course no code is actually moved, as you can see by viewing source on the resulting page, the page only acts as if it was. FYI 2: You may need to tweak the selectors a bit depending on which template you are using, since not all main navigation menus are constructed the same way. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ //Move Main Nav folder where current page is a child to wherever an object with ID "pageMenu" is placed manually on page if ($("#pageMenu").length){ //Get current page url without domain var canonical = $('link[rel="canonical"]').attr('href'); var pageurl = canonical.replace('https://www.yourdomain.com', ''); //Find menu in Main Nav that contains a link matching the url of current page and get its HTML content into a variable var mainmenuFolder = $(".main-nav .folder-parent a").filter( function(index) { return $(this).attr("href") === pageurl; return false;} ).closest("div.folder-parent").get(0).outerHTML; //Append the Main Nav folder found to the #pageMenu object $("#pageMenu").append(mainmenuFolder); //Hide the Parent Folder link in the newly created Page Menu $("#pageMenu .folder-parent a:first").hide(); } //Hide all Parent Folders in Main Nav if they're named "Foo" $(".main-nav span").filter(function(index) { return $(this).text() === "Foo";}).parent().hide(); }); </script>

Hi, How can I adjust padding of the navigation on the menu? screen attached: https://imgur.com/FX8LdFl website:https://marigold-onion-dm3a.squarespace.comPassword: Campcamp1 @tuanphan Regards

Hi, How can I do this? (screen attached) https://imgur.com/AT5fMXr website: https://marigold-onion-dm3a.squarespace.comPassword: Campcamp1 @tuanphan Regards