Hello, i’m using X Theme and my page layout is set to Blank - No Containter | No Header, No Footer. So i’m looking for a way to edit or create the header needed in order to have the menu with links for home, about , etc at the bottom of the landing page over the video background and then the menu to become sticky to top as you scroll down in the landing page trough the whole scrolling process. I’m not sure where can i edit such section.
Hi Alexandru,
Thank you for writing in, please add another section on the bottom of your landing page, set the top and bottom padding of that section so it does not look too spacious. Then on that section add a Navigation Inline element and assign your Menu.
Menus can be create under Appearance > Menus
Hope it helps,
Cheers!
Hello, thanks. So i managed to get the menu over the video background but, i don’t see where can i set it to sticky when scrolling down on the one page landing page. I read this but i don’t see the option beign available : https://theme.co/apex/forum/t/how-to-change-elements-of-the-header-when-transforming-into-a-sticky-bar/65224/3 Is it because i setup a column as inline menu ? I am trying to have the look you have on https://theme.co/x/ exactly the same when you scroll.
Hi Alexandru,
That other thread is about Sticky Bar option, which is available on Header Builder of PRO. Regretfully section does not have that same option.
You can use a third-party plugin like Sticky Anything on Scroll. Here’s a demo setup by an X user https://youtu.be/sRNFHtr_k8c. Just note that we do not have support for third party plugins. For usage questions, please contact the plugin author.
Hope that helps,
Cheers!
Ok … no offence but when you enter your site demo linked above it says it represents X Theme, it doesn’t say Pro, and it says the demo has been done in X Theme. When i bought this theme i was expecting to have at least a layout or some functionality to be able to replicate the so called demo look and functionality you just made. This to me seems like false advertisement … i don’t want to use a 3rd party plug-in that i will not have support of, and a plug-in that will slow my site down and give me other compatibility issues. I would appreciate it if you can provide, a css code that i can inject in the Navigation Inline ? So i can set it to a fixed position property upon scroll ? Thanks ! Presenting a site done in a theme can have infinite posibilities with proper coding, every basic theme can have that, the purpose of a premium theme is that to easy the work of a designer, problem is i don’t know what ID i should call upon to make my menu sticky using css.
Hi Alexandru,
Sorry, but I was only referring to the Sticky Bar solution provided here, its for PRO. I understand that we are after this sticky menu on scroll here. We could do that easily in X if its the standard menu on the header (Theme Options > Header > Navbar Position > Fixed Top), but it’s not.
I understand the concerns about the 3rd party plugin, but that is the best path, for now, CSS alone will not work, add the CSS below to your section’s element CSS area to see what I mean. Regretfully we can not provide customization support further than that.
$el.x-section {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 9999;
}
Thank you for understanding,
What if i set the Page to Blank - No Containter but with Header, Footer can i customize that Header and Footer to position and make the header sticky ?
Hello Alexandru,
Thanks for updating in!
What if i set the Page to Blank - No Containter but with Header, Footer can i customize that Header and Footer to position and make the header sticky?
- You have a Pro theme license. You should use it. Pro theme has a powerful header and footer builder. You can create any header and footer. You can even make it sticky to the top of the page. And yes, please use Blank - No Container | Header, Footer page template. Go to Pro > Header to create one. You will need to create two bars. The first bar will be for your landing or hero image and then the second bar will be for the Navigation line. In the bar settings, there is the Sticky bar option as shown below:
If you are not familiar with the header and footer builder yet, please check out this article:
Hope this helps.
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.