organic_emma Posted May 11, 2022 Share Posted May 11, 2022 (edited) Are there any coding or tutorials to create a fixed sidebar navigation menu? I've found slide out and pop out menu plugins however I'm after a permanent fixed sidebar like this: http://www.wiseworkplacesolutions.com.au/ Edited May 13, 2022 by organic_emma Link to comment
tuanphan Posted May 13, 2022 Share Posted May 13, 2022 If you share link to your site, we can take a look 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
organic_emma Posted May 15, 2022 Author Share Posted May 15, 2022 @tuanphan I haven't started the site yet, I'm just planning and looking to see whether this is possible. I see it was an option for a template in 7.0 but I'd much rather build in 7.1 Link to comment
derricksrandomviews Posted May 15, 2022 Share Posted May 15, 2022 (edited) Sidebars as a standard feature are only available in Squarespace 7.0. Wells and Five have sidebars for all pages, others for blogs only. Here is the list. https://support.squarespace.com/hc/en-us/articles/206544967-Sidebars-in-version-7-0 You can bulid one for 7.0 templates that don't have a sidebar, ( and most don't) and for 7.1. Here is a good tutorial on how to do both: Edited May 15, 2022 by derricksrandomviews tuanphan 1 Link to comment
organic_emma Posted May 19, 2022 Author Share Posted May 19, 2022 Thanks @derricksrandomviews but I'm actually after replacing the navigation so rather than having the navigation situated in the header, to instead have it on the side like this: http://www.wiseworkplacesolutions.com.au/ I'm guessing it's not possible unless I go to a 7.0 template. Link to comment
derricksrandomviews Posted May 19, 2022 Share Posted May 19, 2022 (edited) I apologize, I misread your original post. Sidebar nav is a 7.0 feature. These template families support sidebar navigation. Click the links to learn more. Aviator - Offset or Business Card layouts create a site-wide sidebar navigation Bedford - Sidebar navigation displays on pages in folders and index pages. Five - When you select Top Navigation Position: None, the navigation links move into the content sidebar. Supply - Site-wide navigation sidebar Wells - Site-wide navigation sidebar with editable content area It can be done with 7.1 It takes lot of code, the easiest way is to use this inexpensive plug in: https://www.rebeccagracedesigns.com/plugins/p/vertical-navigation Edited May 19, 2022 by derricksrandomviews Link to comment
organic_emma Posted May 19, 2022 Author Share Posted May 19, 2022 Thanks @derricksrandomviews that's what I'm after! Have you seen any websites that currently have it installed? Link to comment
inscapestudios Posted October 6, 2022 Share Posted October 6, 2022 Hey Emma, Did you ever use this plug in? If so can I take a look. I'm also looking for the same thing at the moment. Link to comment
Leanie Posted November 16, 2022 Share Posted November 16, 2022 Hi, has anyone solved this? I am looking to do a fixed navigation on the right like this https://www.amazonicorestaurant.com/london/#top Link to comment
Leanie Posted November 16, 2022 Share Posted November 16, 2022 Hi, has anyone solved this? I am looking to do a fixed navigation on the right like this https://www.amazonicorestaurant.com/london/#top @tuanphan I found this code, which ads the navigation to the left and turns the text 90 degrees, but I want the text to remain horizontal but on the right side of the site as per the example I sent // Vertical Navigation // .header-nav-list { width: 135vh !important; padding: 25px; background: #000000; position: fixed; -webkit-transform:rotate(-90deg)translateX(-85%); -webkit-transform-origin: top left; left: 0px; top: 0px; text-align: center; z-index: 999; } Link to comment
tuanphan Posted November 21, 2022 Share Posted November 21, 2022 On 11/17/2022 at 3:11 AM, Leanie said: Hi, has anyone solved this? I am looking to do a fixed navigation on the right like this https://www.amazonicorestaurant.com/london/#top @tuanphan I found this code, which ads the navigation to the left and turns the text 90 degrees, but I want the text to remain horizontal but on the right side of the site as per the example I sent // Vertical Navigation // .header-nav-list { width: 135vh !important; padding: 25px; background: #000000; position: fixed; -webkit-transform:rotate(-90deg)translateX(-85%); -webkit-transform-origin: top left; left: 0px; top: 0px; text-align: center; z-index: 999; } What is your site url? We can check easier 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
mayah Posted December 4, 2022 Share Posted December 4, 2022 @tuanphan Hi there, is there an update to this question? Thanks! Link to comment
tuanphan Posted December 9, 2022 Share Posted December 9, 2022 On 12/4/2022 at 10:00 AM, mayah said: @tuanphan Hi there, is there an update to this question? Thanks! If you share link to your site, we can help easier 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
LiamBerrington Posted January 16 Share Posted January 16 Hello, I am also curious about this. My website is here www.liamberrington.com and similar to the other requests I wish to have it at the side left like this site: https://www.mikezielinskie.com/ Link to comment
tuanphan Posted January 18 Share Posted January 18 On 1/16/2023 at 4:21 PM, LiamBerrington said: Hello, I am also curious about this. My website is here www.liamberrington.com and similar to the other requests I wish to have it at the side left like this site: https://www.mikezielinskie.com/ Try this code 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
olyadot Posted January 26 Share Posted January 26 I've done a social media sidebar on the left with this code: https://www.minimist.ca/articles/how-to-add-floating-social-media-icons-to-squarespace-fluid-engine Link to comment
gcart Posted May 17 Share Posted May 17 This is an interesting site with a sidebar. You can scroll down to the images and/or click on an image and a column of thumbnails opens up between the sidebar and the images. Pretty slick but possibly confusing with the scroll or click for the sidebar. https://www.emmawebster.com/paintings 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