Full-screen Slider Revolution in Header Builder

Hi there,
I am trying to use a full screen slider, but allow for the bar below and above the slider (created in Pro’s header builder). I’ve edited the slider settings to allow for the .x-masthead offset. However, when I add in the .x-masthead class, only the “Static / Global Layers” show. If I take out the offset, the slider shows perfectly but is too big (doesn’t take into account the bars).
Any ideas?
Thank you :slight_smile:
Jarrod.

Hi Jarrod,

Thank you for writing in, the idea here, is to subtract the height of the header (.x-masthead), the height of bottom bar (.x-bar-bottom), and height of the admin bar if you’re login (#wpadminbar) from the total height of the Slider.

To do that, open your Slider Settings, under the Increase/Decrease Fullscreen Height (Optional), add this classes:
.x-masthead, .x-bar-bottom, #wpadminbar

Clear all your caching plugin and browser’s cache after doing this changes.

If this did not work, please provide us the site URL and a login credentials in a secure note so we can take a closer look.

Cheers!

Thanks for the quick reply! Still having the same problem- only the global layers are showing. I’ll send through login details. Appreciate the help! (I have no additional plugins, no theme modifications- in fact, very little on this site as I only just started)
Jarrod.

Hi again,

Thank you for providing the credentials. I went ahead and gave classes to your header logo bar and header bottom bar and added those classes .header-top-bar, .header-bottom-bar, #wpadminbar in Increase/Decrease Fullscreen Height (Optional) field and this seems to have fixed the issue.

Don’t forget to clear all caches including your browser’s cache and check the site again. Hope this helps!

Great, thank you Nabeel! Any idea as to why the conventional masthead way wasn’t working?
Thanks again!

Hi,

It does not work because your slider is part of your masthead, so the height of your masthead is the full height of the screen.

In the conventional masthead, the slider is separate from the header, so masthead height is just the height of your navbar.

In your case, its full screen minus .header-top-bar, .header-bottom-bar, #wpadminbar and the remaining height shows your slider.

Hope that makes sense.

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.