Sticky vs Static header menu not working

Re: Sydney Pro. I would like my header nav menu to be Static. The “control button” in the customizer does not have any effect. How do I get a static menu on all pages of the site? Thanks. (Terrific Theme, guys! Love it.) Jan

Hello Jan,

Can you please provide a link to your website?

Kind Regards, Roman.

Roman,

The site is:
wardelectriccompany.com

Thanks for your help - my client is anxious to get this fixed.
Let me know if you need access to this.
Jan

Hello Jan,

You can try to temporarily deactivate all plugins except Sydney Toolbox and Page Builder by SiteOrigin, and see if that Customize option works.

Kind Regards, Roman.

Roman,
I did try what you suggested - deactivating plugins for troubleshooting, but to no avail.

Can you provide a snippet of css that would allow the [#masthead] element to stay fixed to the bottom of the [div.container div.header-contact-info] element when scrolling?

Currently, the element which contains the site title, site description and primary menu stays about 50-80px from the top of the viewport. I really need it to either hug the very top of the viewport or scroll off the top with the header-contact-info.

Please help!
Thanks,
Jan

Hello Jan,

Try to use this custom CSS code:

#masthead {
    background-color: #000000 !important;
    margin-top: 52px !important;
}

…instead of this:

#masthead {
    background-color: #000000 !important;
    margin-top: 40px !important;
    position: fixed;
}

Kind Regards, Roman.

Roman,
I tried the custom CSS you suggested. (no change)
I also tried changing the position
from : fixed;
to : relative;
and to : static;
all proving to either eliminate the [div.header-contact] bar completely/partially or to hide the [#masthead] -
all efforts screwing up the layout.

I need the [#masthead] to either
a.) scroll out of sight with the [div.header-contact]
OR Preferably
b.) scroll and stick to the top of the viewport

Currently, I notice a change in the height attribute of the [#masthead] at a determined scrolling point.
Can we add to that directive a positioning property using css?
Thank you so much for your help, Roman.

Hello Jan, try this:

#masthead.fixed {
    margin-top: 0 !important;
}

Kind Regards, Roman.

Roman,

Hmmm… no luck.

Since I’m implementing a child theme, I figured I had some access to the header-no-header.php file.
So, I added a “sloppy” inline style to div.container (as shown).

<?php dynamic_sidebar( 'sidebar-header' ); ?>

It did allow the sidebar-header widget to stay positioned under the #masthead and scroll off the top of the page.
I had to give up all my header images on internal pages using the “No header image” template. I can live with that sacrifice, though.

BUT
I still haven’t figured out how to accomplish this for the Gallery page. I need the “Full width” template here.

NOR
the Blog template. It must use a template all it’s own?

So, my next question is, how to adjust templates that control fullwidth page header and blog header?

Thanks so much, Roman - I really appreciate you slaying this dragon with me!
Jan

Hello Jan,

It looks like this issue requires close inspection of your modifications, this goes beyond our support policy. As an option, you can contact Codeable for this kind of service, or find a reputable freelancer on Upwork.

Kind Regards, Roman.

Roman,

Thank you very much for your support thus far.
I do recognize my customizations are extensive.
And I have been able to modify some of the templates in the child theme to accomplish my goals.
I have nearly completed the template ‘rewriting’ to the customer’s satisfaction.

It has been a great learning experience for me and I appreciate all your expert guidance and suggestions.
You and AThemes have been fantastic associates in my project.

I look forward to working with you all in the coming year!
Jan
topnotchusa.com

You are always welcome Jan!

And thank you for understanding :slight_smile:

Kind Regards, Roman.