Using an iFrame allows you to showcase podcast episodes directly to your employees - whether it's a company podcast hosted on Spotify or a popular show you'd like to share with your team.
Before you start:
- You'll need to be assigned the System Manager permission to access the Site Settings
- You'll need to be assigned the Homepage Manager to edit the homepage where you will be embedding the podcast
Whitelisting the external source
- The first thing you must do is whitelist the external source where the podcast is hosted. For example, Spotify or Apple Podcasts. A System Manager can do this by navigating to the Actions button > Configure > Site Settings
- Within Site settings, select Integration > External Sources > Add
Add a title for the source and paste the full URL, followed by selecting Validate. Oak will provide you with the option to choose how specific you would like the URL to be.
- Select Confirm to add your new external source. This can be removed at any time by clicking the X to the right of the source from the list.
- Following this, go to the platform where the podcast is being hosted. Find the Share > Embed option on the podcast episode. On Spotify: select the three dots that appear below the podcast details to find the embed code. You do not need to be logged into Spotify to share a podcast.
- Depending on the platform where the podcast is being hosted, you may have some configuration options to choose from. In Spotify, choose from one pre-defined theme and choose your size and width percentage. If required, also choose the time the podcast will start from once embedded.
Find the code/iframe information. In Spotify, this is at the bottom of the share window - tick Show Code to view the iframe code, or simply click on Copy to save to your clipboard.
Embedding the podcast on a homepage
Now that the embed code has been copied to your clipboard, you can add it to a Custom Content applet. Here's how to paste the code into the applet's source code so it appears on your homepage.
- Navigate to the page options in the top-right of the homepage and select Edit this homepage
- Click the pencil toolbox and find the applet. Drag and drop it onto the homepage where a blue line appears
- To configure the applet, hover over it and click the three dots in the top-right
- Once you have configured the applet, such as providing it with a title and removing the background, click on the text box within the Custom Content Applet.
- In the Content Editor Toolbar, go to Tools > Source Code.
Paste the embed code into the Source Code box and hit OK.
- The podcast will be added to the Custom Content applet and ready to publish. A preview isn't available before publishing, so once you're happy with the applet and have finished configuring it, click Publish. You can then view and listen to the podcast.
Top tip: In addition to homepages, podcasts can be embedded on content, such as a News Article or Page.