How to Make a Widget Sticky While Scrolling?
Keep important content visible as users scroll
1. The Sticky Effect makes a widget stay fixed on the screen as you scroll the page instead of moving out of view. This is useful for keeping important content, like headers, menus, or calls to action, visible while scrolling. The Sticky Effect is available for Row, Container, and Block widgets. Select the Row Widget
2. Select the Settings tab for the Row Widget
3. Select the "Sticky relative to the parent widget" checkbox. The Row can only stick within its parent widget. It stops being sticky once you scroll past the parent’s boundaries.
4. If needed, specify Spacing to the Top. This will add spacing at the top of the Sticky Effect. The maximum value that can be set is 500 pixels
5. Click "Save" to confirm the changes
6. Click "View Page"
7. This is how it will look on the preview. If you scroll past the block, the Row with the Sticky Effect will stop being sticky once you scroll past the block boundaries
8. This is how it will look with the Spacing to the Top. There is a small gap above the sticky effect
9. Select the Container Widget
10. Click the Settings tab
11. Enable the Sticky Effect for the Container. It can stick through the entire page scroll, making it ideal for elements that should stay visible across long sections. If needed, you can also enable Sticky on Mobile
12. Click "Save" to confirm the changes
13. Click "View Page"
14. The Sticky Effect in the Container remains throughout the entire page scroll
15. Select Block Widget
16. Click the "Settings" tab
17. Enable the Sticky Effect for the Block. It sticks only within the current page, the sticky effect ends if you navigate to a different page. If needed, you can also enable Sticky on Mobile
18. Click "Save" to confirm the changes
19. Click "View Page"
20. The Sticky Effect in a Block stays active until you reach the bottom of the page.