Embeds
Arcades can be embedded inside anything that supports iframes. Here, we cover embedding basics and sample instructions for specific sites.
Last updated
Was this helpful?
Arcades can be embedded inside anything that supports iframes. Here, we cover embedding basics and sample instructions for specific sites.
Last updated
Was this helpful?
If you want to learn more about a particular platform, feel free to jump down to the specific section:
/ / / / / / / / / /
If you have a question about a particular website or service you don't see below, !
Embedding your Arcade on your website is the most seamless way to share it. To start, click the blue Share button in the top-right corner of any Arcade. You'll see several options, including:
Public link
Team member sharing
Export as GIF or video
Step-by-Step Guide
Socials
Website embed (Get code) ā This is what youāll want to select for embedding.
Click Share on your Arcade
Select Get code under the Website option
A new window will appear showing your embed preview and options
Choose either HTML or React at the bottom
Click Copy code to grab the iframe
You can paste this code anywhere that accepts iframes ā like CMS platforms, blogs, or landing pages.
You can control how your Arcade displays on both desktop and mobile. There are three options available for each:
Inline (recommended): The Arcade will appear directly on the page where you place it ā no clicks needed to play.
Popout Tab: When clicked, the Arcade opens in a new tab where it plays full-screen. After clicking Done, the viewer returns to your site.
Popout Modal (advanced): When clicked, the Arcade opens as a full-screen modal overlay on your website. This requires a small inline script in addition to the iframe.
Youāll see a real-time preview of your embed as you change these settings. Use the toggle at the top of the embed preview to switch between desktop and mobile views.
[Insert Screenshot: Display setting panel with preview]
Yes. You can:
Choose to remove rounded corners using the toggle
Choose between HTML and React output
Adjust styling manually in your own code (if desired)
For more advanced styling or custom integrations, reach out to our support team.
Email providers do not support embedding.
However, if the recipient is using Superhuman, Outlook, or Gmail and has the Arcade extension installed, Arcades can expand and be interactive within your emails.
Reminder: This will only work if your recipient has the Arcade extension installed. If they don't have the extension installed, the Arcade link will not become interactive. In that case, we recommend you use a GIF or video download of your Arcade.
Here's what Arcades will look like in an email:
See below for a list of platforms that support the use of embedded Arcades
*This is not an exhaustive list.
Inside Webflow, go to the HTML block. ā ļø You will need to upgrade to get this feature.
Enter your Arcade snippet inside the block, and then publish.
Hereās an Arcade that walks through this:
Webflow CMS: If you're embedding within the CMS, you'll need a new different steps.
In Wordpress, start typing HTML and then paste in the snippet. Click on Preview and then click Update.
Sometimes Arcades have an issue if you have not updated your Wordpress cache. If you are having issues seeing your Arcade, clear your CDN and local cache.
First, ensure that your settings allow iframes. Hereās how you set that up:
Then use the HTML bar within the help desk article:
Inside the article, enter āInsert Embedded Contentā and then enter the Arcade snippet HTML.
Gitbook supports Arcades as embeds. In order to do that, you can do ā/ inside Gitbook, and then you'll see the Embed option.
Here's the most meta Arcade of all time...
To embed an Arcade in Notion, it's as simple as pasting in the public Arcade link and then choosing the "Create embed" menu item:
Intercom, unfortunately, does not support iframes. You can include links to Arcades within your Intercom chat or articles, but they won't expand within Intercom.
To embed an Arcade in ClickUp, type /embed and paste in the Arcade website code.
To embed an Arcade in Tettra, choose Embed and then paste the shareable link.
To embed an Arcade in Framer, use the embed control.
To embed an Arcade in Articulate, use the Embed Multimedia block.
In Evolve LML, you'll need to slightly adjust the embed code to allow fullscreen and stretch to full capacity. You can use the adjusted code below: