[Resolved] Sticky menu not sticky on all pages

[Marge]

I find the sticky nav menu isn’t sticky with some of my pages.

Sticky here: https://abilityjobs.com/job-search/

But not here: https://abilityjobs.com/job-seeker-resources/ (using beaver builder)

I thought it may be the beaverbuilder, but it works on this page:
https://abilityjobs.com/state-home-templ/

I’m using this:

.custom-fixed-header {
position: fixed;
top: 0;
background: #000000 !important;
width: 100%;
z-index: 2000;
}
.custom-fixed-header + * {
padding-top: 120px;
}

Thanks in advance!
Marge

[Leo]

Hi Marge,

Instead of using that code, I would recommend adding that picture using the generate_inside_navigation hook:
https://docs.generatepress.com/article/generate_inside_navigation/

Then use this method here:
https://docs.generatepress.com/article/navigation-logo/#navigation-as-header

[Tom]

That’s definitely a good solution.

Otherwise, there must be some sort of broken HTML on the pages that aren’t working. Can you confirm that the closing </div> is set in the After Header hook?

[Marge]

Hi guys thanks for the responses. I’m confused.

@Leo when you say “add that picture” are you talking about the slider? I tried to do that with php and it broke the site. I take it that shortcodes are not allowed in php? I used code snippets plugin. The slider is revolution slider.

The slider part is sticky, but the nave menu isn’t. I used customizer for the nav logo. https://www.screencast.com/t/8LYYc6tiXJq

Can you tell me what I’m doing wrong? Do I need to remove the logo from the customizer?

@tom, I don’t see any stray div’s. The code is in the ‘before_header” hook.

[rev_slider alias=”banner-ads-posts”]

Thanks!
Marge

[Leo]

Yup the slider. It’s currently in before header hook? Try it in generate_inside_navigation hook:
https://docs.generatepress.com/article/generate_inside_navigation/

[Marge]

Hi this is the code, but slider is not showing at all now Should I wrap it in a

and give it a class like before instead of the do_shortcode?

add_action( ‘generate_inside_navigation’,’ajob_insert_into_wp_head’ );
function ajob_insert_into_wp_head() { ?>
 echo do_shortcode(‘[rev_slider alias=”a-d-a_mem”]’);
<?php }

This code removes the logo all together:
https://docs.generatepress.com/article/navigation-logo/#navigation-as-header

Thank you for the help!

p.s. I just added the

and not showing still. If I add the custom fixed header, the banner shows, but no nav.

[Marge]

OK, I understand now! The code below worked. Thanks gain for the help!!!

.custom-fixed-header {
position: fixed;
top: 0;
width: 100%;
z-index: 2000;
background-color: #000000 !Important;
}
.inside-navigation.grid-container.grid-parent {
padding-top: 130px;
}

[Leo]

Glad you found the solution!

[Marge]

Hi Guys,
This solved the problem mostly, but there is still movement of the nav menu on some pages. I deactivated the bb page builder and the movement is still there on some pages. https://abilityjobs.com/new-aj-home/

There seems to be some left over style (padding 20px 0px 20px 0px and color #383838). This is really odd since that is old style that was removed from Simple CSS. I can’t find any other style sheet where this would be. No child theme.

Would I use some kind of clearfix for the above?

Thanks very much!

Marge

[Marge]

Oops! Just added:

.site-header {
display: none;
}

And fixed it!

Thanks!

[Leo]

Glad you found the solution!

[Author]

Posts