Navigation Issues - Pacific Template

Site URL: http://www.pentagon-orca-b5y5.squarespace.com

Two navigation issues I'm running into using the Pacific template:

1. I am using a code to hide the first listing on my navigation bar but I'm running into an issue as it now seems that when I click on the header to go to that page, it's refreshing and loading twice before allowing me to stay on the page. Any way to solve this issue?

2. I am using a code for sticky navigation for the header and it's covering up my anchor links. Any fix for this?

1. 2. Which code did you use? Can you post here?

1. #mainNavigation > div.folder > div > div:nth-child(1){
 display:none;
}

2. /* make nav sticky */#header {  position: fixed;   margin-top: -45px;  z-index: 9999;  background-color: #FF9E9E;}#page {  margin-top: 145px;}
div.subnav {background-color: #FFFFFF !important;}

Thank you!

Your site is private. Can you setup password & share url?

Yep: https://pentagon-orca-b5y5.squarespace.com/

PW: Tester123

On 3/23/2020 at 11:22 PM, Dbaumgartner said:

Yep: https://pentagon-orca-b5y5.squarespace.com/

PW: Tester123

I see it fine here. Did you solve?

One of the issues was solved (the double loading of pages), the jumping to anchor links and having it cover the title because of the sticky navigation bar isn't fixed.

The website is live now at www.nancyguppy.org

Additionally, the sticky nav covers the navigation header when it's in mobile.. do you know any fix for this?

On 3/30/2020 at 10:41 PM, Dbaumgartner said:

One of the issues was solved (the double loading of pages), the jumping to anchor links and having it cover the title because of the sticky navigation bar isn't fixed.

The website is live now at www.nancyguppy.org

Additionally, the sticky nav covers the navigation header when it's in mobile.. do you know any fix for this?

and having it cover the title because of the sticky navigation bar isn't fixed.

Where title? can you take screenshot?

Additionally, the sticky nav covers the navigation header when it's in mobile.. do you know any fix for this?

Add to Home > Design > Custom CSS

@media screen and (max-width:640px) {
main#page {
    margin-top: 0;
}
header#header {
    margin-top: 0;
}
}

Thank you for the code for mobile, that worked!

Sorry if I'm being unclear about the other issue. I'm attaching another video of what I'm talking about. On the page in the video for example, I click on the drop down "Interviews" and the page jumps me down to that section but lands me right in the middle of all the content but not to the actual title that says "Interviews" so I have to scroll back up to get there. It seems it's something with the sticky header navigation that I have is covering it but I've tried tweaking the header and no matter the numbers I change the top and bottom margins too, the issue still persists. 

On 4/3/2020 at 1:59 AM, Dbaumgartner said:

Thank you for the code for mobile, that worked!

Sorry if I'm being unclear about the other issue. I'm attaching another video of what I'm talking about. On the page in the video for example, I click on the drop down "Interviews" and the page jumps me down to that section but lands me right in the middle of all the content but not to the actual title that says "Interviews" so I have to scroll back up to get there. It seems it's something with the sticky header navigation that I have is covering it but I've tried tweaking the header and no matter the numbers I change the top and bottom margins too, the issue still persists. 

Screen Recording 2020-04-02 at 2.56.23 PM.mov

How did you create anchor link "#interviews"?

Also, next time you can send videos with a tool like Loom.com, it will be better, not everyone wants to download the video to watch.

Cool - will do re Loom. The code for the anchor link: <a name="interview"></a> is it's own code block and then added a "link" as a drop down for each page.