Gatsby enables developers to build fast, secure, and powerful websites using a React-based framework and innovative data layer that makes integrating different content, APIs, and services into one web experience incredibly simple.

<aside> ℹ️ Note: Gatsby runs React meaning if your website runs on Gatsby you likely have a Single Page Application (SPA). This means there is a bit more work to do to get it working. Following the guide below should help you get up and running quickly. If that’s not the case, please reach out to us in our Slack community and ask for help in the #feedback channel.

</aside>

How to install the Userled Snippet on your Gatsby website

We went ahead and created a sample Gatsby website with the Userled Snippet installed for you to see it in action. Upon loading the website you will see a Userled prompt appear bottom-right. This shows you that the snippet configured works.

If you click on the prompt it will redirect you to Github where we share the required changes to get this working.

Note: the page call in layout.js should be wrapped in a useLayoutEffect instead of a useEffect to ensure we make the page call only after the dom has rendered all page changes

https://www.loom.com/share/0a33e04fe4de4b22abd2efe361a3569d

For more information or help installing the SDK on a Gatsby SPA please reach out to us in our Slack community.