Archived topic
Sticky menu not sticky on all pages
10 replies · Started by Marge on August 27, 2017
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
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
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?
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.
Thanks!
Marge
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/
Hi this is the code, but slider is not showing at all now Should I wrap it in a
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
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;
}
Glad you found the solution!
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
Oops! Just added:
.site-header {
display: none;
}
And fixed it!
Thanks!
Glad you found the solution!
