Creating a web embed
Basic and Pro users can embed reel playlists into any site that allows iframes. Please note that web embeds only include audio playlists, they do NOT contain images, videos, or other text that appears on a full reel. These additional elements should be designed on the page where the reel is embedded. We do not include videos because they have already been embedded via YouTube or Vimeo; nesting embeds can create unpredictable results when it comes to layout—especially on mobile devices.
Embedding reel playlists into your website simply requires generating a piece of iframe code. The iframe should work in most website platforms, like WordPress, Squarespace, Wix or even custom site builds. If you need help embedding the reel, please contact support for your particular platform and let them know you are trying to add an iframe to your site.
Creating a web embed
You can create a web embed from any existing reel, or you can create a new reel specifically for the web embed. Remember, only the audio playlist will be displayed when you place the iframe code in a website, so the reel design options will not matter for the actual web embed.
- On the Reels page, navigate to the reel and click the title to expand the details
- Click the "Create Web Embed" button at the bottom (to the left of the "Preview" button) to open the web embed design options
- Once in the design window, choose Light or Dark theme
- Add a custom hex color for play button and volume control, if desired
- Add a custom hex color for the background, if desired
- Set the height for your iframe (this can be edited later to best fit your site, but we recommend 400px as a starting point)
- Click “Generate Embed Code”
- Copy the generated code and paste it into the appropriate place in your website’s code
Pro Tip: If your iframe is shorter than your playlist, it will become scrollable when placed on your website. It will also auto-advance as the listener plays through the tracks.
Editing your embedded reels
Any edits you make to your tracks or track names will instantly be pushed to your embedded reel, so no need to mess around with your iframe code again.
For edits to the colors or height of your iframe, you will need to regenerate your code and replace it on your website. If you are tech-savvy, you can also manually made these changes in the code already on your website. To regenerate the code, click the “Edit Web Embed” button on the reel.
Deleting your embedded reel
To remove a reel from your website you must delete the iframe code from your site. If you are on the Basic plan and have already the maximum allowed reels, you will also need to delete the embed code in ReelCrafter before you can embed an additional reel. Click “Edit Web Embed” to access the embed code and delete it—you will be prompted twice to delete the code. As soon as the code is deleted, the iframe on your website will appear to be broken, so be sure to make any appropriate edits to your website if you won’t be replacing the reel right away!