Once you've got an animation that you're ready to add to your site, there are two main methods for embedding. We'll look at the use cases and provide some tips for each.
When choosing which embed method to use, you'll want to consider whether you need the animation to interact with anything outside of its canvas.
1. The Easy Method - iframe embed
Adding an interactive Rive animation is really easy with the iframe embed method. You can setup any animations and state machines you'd like and they'll all work within the canvas area of the Rive artboard.
2. The Advanced Method - JS runtime
Using the JS runtime requires more code writing/editing, but also enables much deeper integration with your website. Using this method allows you to reference the state machines, animation states, and inputs of your Rive file to affect changes within and beyond the canvas.