Search the Community

I am wondering if there is a way to create a side menu that would pull the titles of each blog post. Either at the top of a page or on the side. I know I could manually build links to each blog post page, but I'm wondering if there's a way to do it automatically.

Site URL: https://lightsandtracks.squarespace.com/ Hi there, Site password: lightsandtracks I am finalising a client site and need assistance with two items: 1. I have set up the menu to be the burger menu at all sizes. However, I can only get the hover state to work on one line of the bun, not both – I've tried everything! Does anyone know how to get the hover state to work on the full menu? 2. I have added an arrow to show on the menu items on hover - I'd love to add a transition to this hover so the arrow appearing is smoother. Does anyone know how to do this? Thanks so much! Ash

Site URL: https://bigkidbakesale.squarespace.com/ site password: bigkidbakesale Hi there, Has anyone used Tock for scheduling a pick-up time for food services? My client's site that I'm working on brings different bakers together to sell their goods; however, they want to be able to have the customer schedule their pickup time. My client wants to use Tock for this but I'm having trouble implementing the code. I am not sure where exactly to put the code for the widget...ideally it would be when they go to check out but is there anywhere to put the code for the cart page? They made it seem like it needed to be a page header code injection. Anyway, having a lot of trouble with this one. Any help is appreciated! Thank you! Blayne

Site URL: http://www.alexandra-lyon.com Hi! Seeking help on this, is it possible to either hide the announcement bar when visitors are accessing the mobile menu or have the mobile menu cover the announcement bar completely? I still want the announcement bar visible on mobile just not on the menu. I'd like to achieve the effect below: Right now, the mobile menu displays like this: Any help is appreciated so much! Thank you!

Site URL: https://www.rpc21.ph/ There's a mystery white space that appears at the top of my site when I go in a main nav / menu folder. It does not seem to be the same container as the close button. I cannot identify it because it shows that there is nothing wrong when I check on its mobile view via laptop: Would appreciate help on how to fix! Thank you so much!

Site URL: https://www.letsbonfire.com/ This is what I want the menu to look like - or as close to it as possible. I've tried a variety of codes for the transparency and rounded edges and nothing seems to affect it.

Site URL: https://gecko-flugelhorn-am5r.squarespace.com/ Hello everyone ! I tried to find some information on this forum but I only found partial answers. I began to use the Balboa template. My goal would be to have a vertical menu. Not only vertical in a header staying at the head of the page but as a fixed sidebar stayling left during the scrolling on the page content (I hope it is clear). To be clearer, I added a screen shot of my old website to keep it more understandable. I saw that some templates naturally does this kind of things. I tried bedford but didn't find the place to create a side menu. The best template (Supply) for that seems to be uavailable now. have you got any solution ? Many thanks for who could help me ! Have a nice day ! 😉 Greg

Site URL: https://www.runawayhusbands.com/ Hello, for some reason it appears the footer is jumping into the navigation menu in mobile, any suggestions? Display: none on the footer solves the problem, but of course then it gets rid of the footer at the bottom. We heard back from Squarespace, they said it's a problem with Javascript added to the site, however we have only edited the custom CSS. The site was made many years ago by a Squarespace designer, but it has functioned properly since then. Thanks in advance-

Site URL: https://www.bombshell.ee/ Hi I am using Bedford Family template and now I'd like to change my design. First thing I'd like to change is navigation bar. Currently there is a button for navigation menu but I'd like to have navigation bar in header from left to right including links to pages. We have been trying to customize it by using code but it hasn't worked. So could you please recommend ways to customize my site on Bedford template? What could be the reason that by changing the code nothing changes? I have business plan that should allow make these kind of changes. Thank you in advance Andre

Due to the colours of the logo and the backgrounds on each page, my website requires different version of my logo on some pages than others. The most challenging part appears to be on mobile, when you enter the overlay menu, the background is white, so I need to use a black version of my logo rather than the white version used on most pages, including the homepage. How can I do this? I'm using the Colima template.

Site URL: https://www.bnkservices.com.au Hi, I'm having an issue with my sqaure space header, my menu items are stacking when I go on a laptop with a smaller screen. and my footer also isn't in a stright line on a smaller screen. Is there any coding i need to do?

Site URL: http://www.playtekitchen.com This is all great information! Is there a way to adjust the look of the Mobile Menu so that it does not cover the entire screen once clicked?

Site URL: https://www.shootiezproductions.com/ I am wondering how to add my logo or image to the mobile menu. My mobile menu is currently really dull and boring as it just has text on it. I want to make it look more visually appealing but I can not find any place in the style design to make it look more aesthetically pleasing. Any help or suggestions is greatly appreciated!

Hello ! I love the floating menu button from Nicole website, can someone make this ? Or where can I found these? Thanks !

Site URL: http://wwww.drophouseamsterdam.nl Hello Guys, I hope you can help with my question, drophouseamsterdam.nl is my website and i would like to add a button next to the contact us button in the top menu and redirect it to another page. Could be please tell me how is it possible to add that button ? Thank you in advance!

Site URL: https://www.rubenvanriel.nl/performance-method I've created the site www.rubenvanriel.nl and use in the header a white logo. I've changed on certain pages (for example: https://www.rubenvanriel.nl/performance-method) the logo because the background is white. I've used this code in the header code: <style> .header-title-logo a { content: url("https://static1.squarespace.com/static/604a2484aa92df0f526d7479/t/604a6076ce3f69737ba12e41/1615487094484/Logo+Ruben+van+Riel_RGB.png"); } </style> I only want to hide the logo for the mobile menu overlay because the logo is not visible anymore on the dark red background. I've tried a few solutions and codes but none of them are working for me. Can anyone help me out? Thanks a million!

Site URL: https://www.kwerling.com/ Hi all! Can someone help here? For my portfolio site, I wanted my logo to show on the left side of the top nav, and the two menu items to display on the far right, for balance. I found CSS on this forum to do exactly that, and it works great on the desktop and tablet versions of my site! The issue is that on mobile, it now displays both the default "menu" link above my logo, as well as the two items separately, right aligned underneath the logo. How do I adjust the CSS to display these two items, right aligned, only on desktop? And leave mobile as the default single menu item above the logo? ** Ideally, I would also replace the word "menu" with a hamburger icon on mobile, but I am fine settling with just removing the duplicate nav items, if that's much easier.** Here is the code I used that is working fine for desktop and tablet only: #navigator header#topBar ul#nav { display: block; float: right; }

Site URL: https://www.phasesfilm.com Hello, I would like my landing page in the second language (https://www.phasesfilm.com/tr/ana-sayfa) have the menu items under the logo. However, perhaps because it's not the home page, the header appears over the logo. Is there a way to make them look the same? Thank you!

Site URL: https://www.hoyden.no Hello! I have installed this plugin to get a mega-menu on our site: https://thompsonweb.design/squarespace-plugins/p/mega-menu-plugin-squarespace Our header menu has a transparent background when you are on top of the page. When you scroll down, the menu gets a background color. When you hover the menu, the mega menu appears below the header menu. And when you do this when you are on top of the page, it looks a bit strange, since the mega menu has a background color. I wonder if it's possible to make the header-menu have a background color when you have "opened" the mega menu? So that everything displays with the same background color? Har to explain, but I'm attaching a screenshot. It would be great if anybody could help with this. www.hoyden.no Erlend

Site URL: https://lychee-carnation-4cdg.squarespace.com/ Hi! I'm trying to create a multilingual website and everything is working except for the items on folder that are not showing up on mobile. I followed this tutorial: https://www.creationsbyfaria.com/blog/multilingual-site-squarespace Basically I've created every page I need for each language, and I'm using custom CSS on each page to hide the navigation items I don't want to show on a specific language. Everything is working perfectly fine on desktop, but on mobile, on the second and third language, the items on the folder I have are not showing up. I've attached a print of what my Pages look like. The first language is Portuguese, the second English, and the third French. The Products folder is the one I'm having trouble with on Mobile. Basically when I click the folder the options are not visible, but this only on the second and third language. On Portuguese they show up fine. This is the code I'm using on the English Pages to hide the Portuguese and the French ones: <style> #header .header-nav-item:nth-child(1) {display:none} #header .header-nav-item:nth-child(2) {display:none} #header .header-nav-item:nth-child(3) {display:none} #header .header-nav-item:nth-child(4) {display:none} #header .header-nav-item:nth-child(5) {display:none} #header .header-nav-item:nth-child(6) {display:none} #header .header-nav-item:nth-child(7) {display:none} #header .header-nav-item:nth-child(15) {display:none} #header .header-nav-item:nth-child(16) {display:none} #header .header-nav-item:nth-child(17) {display:none} #header .header-nav-item:nth-child(18) {display:none} #header .header-nav-item:nth-child(19) {display:none} #header .header-nav-item:nth-child(20) {display:none} #header .header-nav-item:nth-child(21) {display:none} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(1) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(2) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(3) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(4) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(5) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(6) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(7) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(15) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(16) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(17) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(18) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(19) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(20) {display:none}} @media screen and (max-width:767px){#header .header-menu-nav-item:nth-child(21) {display:none}} What can I do to solve the problem of the folder items not showing on mobile? Thanks a lot! Error Folder Menu.mp4

Hi, I would like to create menu like this? Round buttons (different collours) with the menu text in them. They do not have to be buttons. They can also be round objects. I cannot find the correct answer. Hope somebody can help me

Hello, Apologies if this is something basic but I'm looking to have my color rollover state stay. Right now with my current code, it's just changing with the mouse rollover but would love for the color to stay. Can you help? This is my current code: /* Nav item color */ .header-nav-item a { color: #ffffff !important; transition-duration: 0.4s; } /* Nav item hover color */ .header-nav-item a:hover { color: green !important; transition-duration: 0.4s; } /* Nav item active color */ .header-nav-item--active a { color: green !important; }

Site URL: http://www.kidzculture.org Hello, I'd like to have my dropdown menu background to be purple, but it washes out the logo. How do I change the logo color just on the drop down menu for mobile? Please and thank you!

Hey, I'm building my site in 7.1 (mainly to get to grips with using it) and I've come across one problem I can't seem to fix. The dropdown navigation has white text & a white background(image attached) My header colour palette is yellow, whereas the main website has a white background, I'm wondering if this is part of the problem. It'd be greatly appreciated if anyone can find any workaround for me. Site is here: https://hexaflexagon-star-bh8p.squarespace.comPasword: 123123