Archived topic
Merge page header with site header (Revolution Slider) not working as expected
8 replies · Started by View on IT on October 30, 2018
Hi,
I'm trying to use a Revolution Slider as header, and want to place it behind the site logo and between the secondary and primary navigations. So the order it all should be placed in, would be the following:
1. Secondary navigation
2. Slider background, with logo floating on the left
3. Primary navigation
What's happening now, is that the secondary and primary navigation is floating on top of the page header/slider, which is resulting in a bad display.
Is there a known solution to this?
With kind regards,
Wilrik
Hi there,
Is the Secondary Navigation currently set to display before the header?
It's possible to move the primary navigation below the header, but it will take some PHP.
I suggest migrating to our Elements module instead of the Page Header first though: https://docs.generatepress.com/article/moving-hooks-page-headers-to-elements/
Let me know if you do that or not and we'll figure out the PHP :)
Hi Tom,
The Secondary Navigation is set to display after the header, the Primary Navigation is set to display before the header. Reasons for this are based on which navigation should show as sticky navigation, which navigation should be shown on top of the screen, and in which navigation the WooCommerce cart icon should be shown.
But I did migrate to the Elements module now, great module by the way! :)
If we could figure out the PHP that's necessary to do the following, it would be great:
- Move the logo to vertical center on the slider
- Move the Secondary Navigation down so it shows underneath the slider, and doesn't float on top of the slider or on top of the page content.
Please let me know, thanks!
With kind regards,
Wilrik
First, set the Secondary Navigation Location to "No Navigation" in Customize > Layout > Secondary Navigation.
Then add a new "Hook" element using the Elements module.
In the hook content, add this:
generate_secondary_navigation_position();
Set the priority to: 15
Check the "Execute PHP" checkbox.
Then set the Display Rules to "Entire Site" (or whatever conditions you need).
Let me know if that does it or not :)
Hi Tom,
Works great, thanks a lot!
You're welcome :)
Hi,
I want to do something similar to this, but I've attempted to add the code above to the hook element and it is simply showing the text of the above code ( i.e. this text - generate_secondary_navigation_position(); )
I'm sure I'm doing something wrong because I haven't used Generatepress for a while and I am not a developer. I'm not really sure how to add the filters to the hook element exactly and can't find it in the documentation for the new element modules.
I am attempting to reproduce a layout that is essentially as follows:
1. Secondary Menu at the top
2. Slider Revolution Slider (has logo and text on it)
3. Then Primary Menu below the slider
I want it to show across the whole site.
I've managed to get the slider to show, by adding a header element with the slider shortcode in it. But (as was the problem above), the main menu shows over the middle of the slider, and the secondary menu overlaps the top of the slider.
I'd love some help to get it working as I envisaged.
Thanks,
Sam
Actually, I played around and instead of setting the slider shortcode into a header, I added the shortcode into a hook and displayed it in 'header'.
There is an area there that was displaying whitespace, so I used css to hide it:
.inside-header {display: none}
Not sure if this is the best way of doing things though, so I'd love to hear about how it is best to achieve this.
Thanks,
Sam
Hi there,
If you are still having some issues with this, any chance you can open a new topic and link us to the site in question?
Thanks!