Show a Flow On Scroll (Advanced)

Appcues provides a way to trigger a flow at any time using the Javascript call "Appcues.show(FLOWID)". This can be used to show a flow when a user takes a specific action on a page in your application. Below we'll cover how to use this call to show a specific flow on scroll just like we've done in our docs!

NOTE: This option requires you to add code within your application, and cannot be implemented without development work. You'll need to add the show call to the appropriate section of code within your application. You can find more information on this and other calls is in the Javascript API doc.

  

Example

You may have noticed a Slideout being triggered on our docs pages. We use a Javascript call within our help docs to trigger the Slideout after you've scrolled more than 75% down any article. Take a look below, or try it out by scrolling down a bit.

To achieve this we added the following snippet to the code for our documentation pages:

window._appcuesshown = false;
window.onscroll = function(e) {
if (!window._appcuesshown &&
((window.scrollY + window.innerHeight) / document.body.scrollHeight > 0.75)) {
window._appcuesshown = true;
Appcues.show(“FLOWID”);
}
};

You'll want to update the FLOWID above to the Flow ID that you'd like to show upon scroll. Finding Your Flow ID

   

Important Disclaimer

Its necessary to note that anytime you're using Appcues.show(), all targeting rules will be ignored. This can result in a show once flow showing multiple times and/or the flow showing to people outside of the Audience targeting. The analytics page will show the stats for the flow and the CSV will have the form results as normal. 

Another thing to keep in mind is that if you'd like to switch this flow out for another one in the future, you may need to get your developers involved so they can update the snippet above. 

There is currently no a way to trigger Appcues flows on scroll while also respecting targeting. If this functionality is important to you we'd love to hear about it!

  


If you have specific questions about the above, feel free to reach out to us at support@appcues.com for assistance. 

Still need help? Contact Us Contact Us