One page navigation with sticky header on mobile still doesn’t work

So the theme supports single page navigation with sticky header on desktop like any other theme.
To make it work on mobile the fiasco starts. The forums is full of snippets from you guys on how to make the mobile navigation sticky as well, and how to close the navigation after clicking,
because «X mobile menu items does not really have the functionality to collapse the dropdown because it does not have the option to be sticky in mobile.» Your argumentation was «X does not have a sticky mobile nav option so the menu should not collapse because the intended behavior is you use the Scroll to top button to go back to the opened menu. If it collapses, you will need to open the menu back again which is not ideal.»


Funnily you mention yourselves: “But, Static Top is not recommended because the navigation will be out of view once the page scrolls down past the header.” Isn’t that the exact same thing you’re offering for mobile instead?

You must agree that this was and still is hilarious and seems like a problem of your developers to implement that feature on mobile or other reasons behind it. After all you have a feature on desktop which is completely useless on mobile.
Where it started to get really weird is that part «In the past, we received numerous feature request for header customizations or flexibility and a sticky mobile bar is one of them. The response to that request is Pro.» So you have regular features like «sticky header» and «single page navigation» which turn out only to work on desktop, but if your customers want it to work on mobile, they have to buy another theme?

Not too sure still what’s your intention behind it, make people buy a second theme because of bugs in the first theme? (very unlikely to happen)
Your developers simply cant fix it or you’re trying to save development time?

As your last reply was «I’ll post this as feature request so it might be taken into consideration in the future.» my question is, has anything changed by now?
As mentioned already this is far from being a feature request though, this is actually a bug-fix request as the feature simply doesn’t work on mobile.

Can you provide me with a fixing snippet or have you actually managed or tried to fix this issue completely?

If not you should really make this clear beforehand:
«Sticky header and single page navigation are advertised BUT don’t work on mobile at all»

Hey @Ede,

Thanks for your feedback. Our statement about “Static top…” in our One Page Navigation documentation is outdated. If you assign the menu as the One Page Navigation menu, it will override the Static Top option on desktop.

On mobile though, regretfully, sticky header is not yet supported. It is not because of capability of our developers or saving time or even we are pushing Pro to our users but it’s maybe because of priorities. It isn’t simple to design a feature taking into account a lot of stuff like the stacks designs. It’s far from just plugging a piece of code.

Regarding recommending Pro, please bear in mind that a lot of users request a lot of stuff for the header for different scenarios and Pro was designed to accommodate for that. X header was intended for simple navigation design only.

If you just need the header to be sticky on mobile, we have an article here: https://theme.co/docs/add-fixed-navigation-on-mobile

For collapsing the dropdown, I gave it in the past here: https://theme.co/apex/forum/t/mobile-one-page-navigation-collapsing/47980/2?u=christian_y

Those snippets still work. Please just bear in mind that they will not be supported nor will we provide more header customizations.

Thank you for understanding.

In my world a working single page navigation on all devices is about as simple as it gets.
You made it very easy for yourselves by just «not supporting» sticky headers.

So looking at your PRO-docs, not even adding a fixed/sticky navigation on mobile works out of the box, according to this: https://theme.co/docs/add-fixed-navigation-on-mobile
«Therefore you will need this tweak to achieve a fixed navigation on mobile.»

Can you point me to a document where I can see how to set up a sticky header with single page navigation and working scroll spy on all devices without any css or js snippets on PRO please?

What can you offer me to get a PRO license then after this?

I mainly need the scroll spy to work on mobile, do you have a snippet for that?

Hey @Ede,

Watch the following video. Scrollspy (underlining of menu item when the section is in view) is not shown in the video but you’ll simply need to enable the Primary Particle of the Navigation Inline and Navigation Collapsed elements.

###One Page Navigation in Pro

###Particle Setup and Customization

Support for Pro especially if you get stuck setting up the one page navigation.

No. Scrollspy works out of the box in Pro.

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