Documentation Link:
https://helix-warrior-4f9.notion.site/Scroll-to-Element-Plugin-Docs-1dde670f23ed80a5bca6d88bbd63f34b
1. Place the Element Scroll instance onto your page where you need programmatic scrolling. No other elements are required—this instance works entirely via its workflow actions.
2. Configure the instance’s fields
Set the Target Element ID to the DOM ID of the element you want to bring into view, and the Parent Container ID to the DOM ID of the scrollable container. Optionally enter an Animation Duration (ms) for a smooth scroll, and a Vertical Offset (px) to fine‑tune the final position.
3. Snapshot initial scroll positions
When you run Scroll to Element for the first time, the plugin automatically publishes your current scroll positions as Current Page Position and Current Parent Position. You don’t need to configure anything extra—these states update behind the scenes.
4. Trigger the scroll
In any workflow, add the Scroll to Element workflow action. This will scroll your container to the target element (plus offset), using smooth animation if you set a duration. The action fires the Scroll to Element Complete workflow event trigger when finished.
5. Chain follow‑up logic
Add a “When Scroll to Element Complete” workflow event trigger to run post‑scroll actions—such as highlighting the new section, loading additional data, or recording an analytics event.
6. Return to the original position
To bring users back, create another workflow and add the Scroll Back workflow action. This instantly returns the container to the previously captured Current Parent Position and fires the Scroll Back Complete workflow event trigger.
7. Optional cleanup
If you need to clear stored positions before a new scroll sequence, use the Clear Positions workflow action. This resets both Current Page Position and Current Parent Position to empty (null), giving you a fresh slate.
8. Build richer UX flows
Combine these steps to create guided tours, error‑focus jumps, or promotion reveals. By leveraging the built‑in states and event triggers, you can orchestrate complex scroll‑driven interactions without any custom code.