App DocsSharing & ExportAdd the autoplay script to Framer

Add the autoplay script to Framer

Let viewers start your Flare video with sound by clicking or tapping your Framer page. If a muted preview is already playing, the video restarts from the beginning when the browser allows sound.

Copy the autoplay script

This script is the same for every Flare account and video. Click Copy script below. You do not need to change the code or find it in the video settings.

HTML
<script async src="https://flarefasthost.com/autoplay.js"></script>

Keep your existing Flare video embed on the page. Add this extra script once in Framer’s site settings; it works with videos that have Autoplay on load or a loop thumbnail enabled.

1. Open your Framer project

Open the project containing your Flare video embed.

Your website open in the Framer editor
Open the Framer project you want to update. Click any screenshot to view it full size.

2. Open Settings

Click the Canvas menu in the top-left corner, then choose Settings.

The Canvas menu with Settings highlighted
Canvas → Settings.

3. Open Custom Code

Under Site Settings, click Code. In the Custom Code area, click Add Script. If you already have scripts, use the + button to add another.

Framer Site Settings with Code selected and the Add Script button
Select Code in the sidebar, then Add Script.

4. Paste the script

Fill in the form with these settings:

SettingValue
NameFlare autoplay
PlacementEnd of <body>
PageAll, or the pages containing your Flare embeds
RunOnce
CodePaste the script copied above

Click Add to save it. The script belongs here in Custom Code, rather than inside the video’s Embed component.

The Add Script form filled with the Flare autoplay script
Edited setup example showing the exact script, End of <body>, and Once.

5. Check your Flare video settings

In Flare, open the video’s embed customization modal. Under Appearance → Autoplay, enable Autoplay on load, or use a loop thumbnail. Click Publish in Flare to save any video-setting changes.

When Autoplay on load is enabled, the Using Framer? info box beneath it links to this guide. You can copy the script at the top of this article, or from the Embed code tab (the </> icon) → Advanced settings → Autoplay with sound on your website.

Annotated Flare modal pointing to the Embed code tab with the autoplay script
Annotated example: the </> icon opens Embed code. The script shown here is the same one you can copy above.

6. Publish your Framer site and test

Click Publish in Framer. Open the published website in a fresh browser tab to test the setup.

  1. Let the muted video or loop preview start.
  2. Click or tap the page outside the video.
  3. When the browser permits it, the video restarts from the beginning with sound.
  4. Further page interactions will not keep restarting a video that has successfully started with sound.

Test on the published website, rather than only in the Framer editor.

If the video stays muted

  • Check that you added the script in Site Settings → Code, saved it, and published your Framer site.
  • Make sure Page includes the page you are testing and the Flare video has autoplay or a loop thumbnail enabled.
  • Click or tap to test. Scrolling, hovering, and moving the mouse do not unlock audio.
  • Some browsers and device settings still require a tap on the video itself. Keep the player’s play and unmute controls available.

For Framer’s general instructions, see How to add custom code.