Sidebar navigation in 7.1

Does 7.1 support sidebar navigation like the Wells template.   If not, is there custom css code?

You can try this plugin to create sidebar (need Business Plan)

You can also use CSS (I haven't tested yet), but I guess CSS can.

There is a tutorial here. However there are still other things need fixing / more tutorials needed ~

1. Element & typographic spacing ~ if you follow the above tutorial, all spacing will be jampacked next to each other, and that nav links may appear squashed to left or right (depending on the overall Header Style you picked). The tutorial above didn't cover this issue, but so far the only way to make this work is to add more margin and position css overrides on the "header a" and  "header-nav-wrapper" as follows: 

   header a {
     margin: 5px;
   }
   
   .header-nav-wrapper {
       position: relative;
       left: 20px;
     }

   I'm no coder nor developer so please do not hold me accountable if anything breaks at your end. 
    
2. Announcement bars will ALSO be rotated to the left. So far I have not been able to find a way to bypass this effect on announcement bar. 
3. Following from announcement bar problem - once you clicked exit "X" it out ~ the entire nav suddenly shifts to the right. So far again, still troubleshooting my way through this. 

If anyone else can contribute to this thread, will help a lot. Since 7.1 gets RID of Well's beautiful sticky left nav style, we need to raise enough voice for side bar based navigation! 

On 6/16/2020 at 4:25 PM, AW85 said:

There is a tutorial here. However there are still other things need fixing / more tutorials needed ~

1. Element & typographic spacing ~ if you follow the above tutorial, all spacing will be jampacked next to each other, and that nav links may appear squashed to left or right (depending on the overall Header Style you picked). The tutorial above didn't cover this issue, but so far the only way to make this work is to add more margin and position css overrides on the "header a" and  "header-nav-wrapper" as follows: 

   
   header a {
     margin: 5px;
   }
   
   .header-nav-wrapper {
       position: relative;
       left: 20px;
     }

   I'm no coder nor developer so please do not hold me accountable if anything breaks at your end. 
    
2. Announcement bars will ALSO be rotated to the left. So far I have not been able to find a way to bypass this effect on announcement bar. 
3. Following from announcement bar problem - once you clicked exit "X" it out ~ the entire nav suddenly shifts to the right. So far again, still troubleshooting my way through this. 

If anyone else can contribute to this thread, will help a lot. Since 7.1 gets RID of Well's beautiful sticky left nav style, we need to raise enough voice for side bar based navigation! 

Hi. Sorry for the late reply.

Have you solved it yet?

We will take a look

On 6/21/2020 at 9:08 PM, tuanphan said:

Hi. Sorry for the late reply.

Have you solved it yet?

We will take a look

hi Tuanphan,

No unfortunately still tinkering around amidst other things going on at the moment sorry for the late reply. 

8 hours ago, AW85 said:

hi Tuanphan,

No unfortunately still tinkering around amidst other things going on at the moment sorry for the late reply. 

 

If you share link to your site, I can check easier.

20 hours ago, tuanphan said:

If you share link to your site, I can check easier.

Tuanphan,

Thank you so much to willingly look into this for me. I have PM'd you the password needed to assess my rough trial site. AW.

...For anyone who's wondering. This problem is still unresolved. Meanwhile for anyone who's more able at providing further insights to this thread is appreciated.

Dear all / whoever in angst of this issue RE: Sidebar Nav / Vertical nav in SQ 7.1,

I have tried my best nearing an entire month around-the-clock; at liaising with various member/s in and outside of the forum clarifying whether or not vertical navigations are pragmatically possible on PERSONAL subscription plan. At least without luxury assistance of plugins or coding injections via Business plan or above. 

Unfortunately, so far ~ all alternative workarounds seems compromised. All efforts points to a likely "no". Unless one is truly willing to put their necks in the sand and grind things through manually themselves.

The best tutorial I have so far sought upon is here.  But beware: this solution is halfway complete and/or half-baked. You cannot properly display all icons, nav items and cta-button ALL ON simultaneously. And you must find a way to revert vertical menu  BACK TO horizontal menu if it is in mobile environment. 

Squarespace® sadly brings their 7.1 an ambivalent direction. It is one step forward, three step backwards. A step forward for those who are completely unaccustomed to web design. Three steps back for everyone else - that we have to tinker, troubleshoot and find workaround alternatives far too exhaustive, and unnecessarily numerous-jumping-through-hoops. I fear for the "what-if" scenarios - what if 7.1 were a mandatory global upgrade, like what they did from V6 to V7? 

Many thanks to @tuanphan for charitable efforts. I am not a developer hence please consider any or all workaround discussion a subjective one at best until you have proven to your existing needs and environment~ that it indeed works in all cases. 

Hopefully they pick this up,

AW85. 

The only "solution" in fixing the announcement bar also should one resorts to the other tutorial, can only be done via code injection (Business plan).  Once again, many thanks to @tuanphan. For those unfamiliar / get up to speed ~ that tutorial also rotates the announcement bar which we do not want.

This code injection fixes that so it remains horizontal. 

Add to Home > Settings > Advanced > Code Injection > Header

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
  jQuery(document).ready(function($) {
	$(".header .sqs-announcement-bar-dropzone").insertBefore("header#header");
});
</script>
<style>
  .sqs-announcement-bar-text p {
    padding-top: 0 !important;
}
</style>

checking all the unanswered questions and seeing this. I recently purchased a course on this

Do you still need help on this?

tuanphan I would love to be able to know how to do a sidebar menu if you are able to share how it's done. I've been trying to use the above tutorial as well but having challenges too. Thank you!

Would love to know how  to do this as well without purchasing business plan! 

Tuanphan, have you come to a conclusion with this after the course? The Thirty Eight Visual tutorial is no longer available and I'm stumped.

On 9/14/2020 at 11:47 AM, KimLala said:

Tuanphan, have you come to a conclusion with this after the course? The Thirty Eight Visual tutorial is no longer available and I'm stumped.

Have you solved it yet?

Good Mornng All - looking to create custom nav for Quincy. Having some trouble

I did this but in the brine template. I used the index navigation and customized it. Not sure if you can do the same in 7.1 which I hope you can because I want to upgrade.

I just came across this plugin which seems promising. I haven't bought it or tested it. Anybody try this yet?

https://www.rebeccagracedesigns.com/plugins/p/vertical-navigation

1 hour ago, iannoli said:

I just came across this plugin which seems promising. I haven't bought it or tested it. Anybody try this yet?

https://www.rebeccagracedesigns.com/plugins/p/vertical-navigation

Also just heard back from the plugin developer. I asked her if the vertical nav can be customized. Here's what she said:

"The plugin can have the text left justified and you can change the background to be whichever color you choose. Most of the plugin uses CSS. However at times you may come across a situation where the header loads horizontally and then bounces to the vertical navigation. I have provided code to fix this issue, but you would need to have a Business Plan or Higher to use that portion of the code. "

I'd like to be able to have sidebar navigation similar to the squarespace help center. 

https://support.squarespace.com/hc/en-us/articles/207135178-Creating-anchor-links#toc-page-slugs-and-anchor-links

Is this possible? I have stumped all Fiverr custom developers and no reply from anyone on 99 designs yet. 

I'd like all of the articles in blog 1 to appear in the sidebar when inside blog 1. Same for Blog 2 or any other sections that I create with related content to appear in the respective sidebar. 

5 minutes ago, ianlearobinson said:

I'd like to be able to have sidebar navigation. I'd like all of the articles in blog 1 to appear in the sidebar when inside blog 1.

It should be possible to add an organised lists of links to blog posts by using an Archive Block, although this will obviously will be limited to the usual 50 groups (months, years, authors, categories, or tags) with a maximum of 100 items per group.

It's difficult to be more specific as you haven't provided us with a working link to the blog and I therefore don't know which template or Squarespace version you are using - some are easier to customise than others.