Hi,
I do have a title (not header) that I want to make sticky on mobile devices. I tried it the following way:
I add “sticky” to a new row and placed my title in it. Now the the title is sticky, but only on deskop. But I need it exactly the other way round. On desktop the full page content is visible, so I have no need to make it sticky here. But on mobile where the user has to scroll I want this specific title sticky so that the user can see it all the time in his viewport.
Is there any way to achive this? Sticky on mobile while normal on desktop?
Thanks in advance for any help!
Oh I see its sticky for mobile as well it was just covered by the mobile sticky header. But is there any way to make it just sticky on mobile? it looks like if I remove the checkmark for desktop its removed for mobile as well.
Also on mobile it seems to be “smart snap” and not “always”.
So my remaining questions are:
1. is there a way to change it from “smart snap” to “always” for mobile?
2. is there any way to make it just sticky on mobile?
3. Is there a way to hide the sticky row after a certain scoll?
4. What classes / data attributes are used to make the row sticky? Is there a specific HTML structure or wrapper required for an element to be recognized as sticky? Are there JavaScript functions by the theme to manage sticky elements? Are there any action or filter hooks?
Hello,
I recommend using mobile template, and there you can set the row sticky and it will not affect the desktop.
To stop the sticky row you need to have a new row sticky.
If you are referring to using anchor links, you can do it easily. You need to set an extra class on the element, for example, I set it on the “Single Post Comment” => https://i.imgur.com/EewW11X.png and set the class on the element icon or button, in Scroll to class => https://i.imgur.com/O3x7xpV.png -> https://imgur.com/xqIOgu0
Thank you!
