Embed Episode In A Website

With a few steps you can embed an episode and customize it to the style you want to your website!

Embed an episode in a website

We have a fully customizable embeddable podcast player that you can use on your website. You can choose to either embed a specific episode or embed your show (which displays a playlist of all your episodes). 

How to embed an episode in a website

1. Sign into your Whooshkaa account, select “Shows & Episodes” from the side menu on the left. Now click the "Episodes" button on the show that the episode belongs to.

2. Choose the episode you'd like to embed, click the “Actions” button next to it and then “Embed.”

3. Select and customise the player that best matches your site.

4. Important: The "Autoplay" option is there for special cases where the player is lazy-loaded or enabled via a primary play function that is implemented on your website. Do not use the "Autoplay" option unless you are certain that this is what you would like as this may have unwanted results in your listen analytics. If unsure, please contact us.

5. When you're ready, navigate to the “How To Embed It” tab. Here you can choose to embed your Show via our Javascript (JS) widget or an iframe. Click the "Copy Embed Code" button of your preferred embed method to place the embed code onto your clipboard.

  1. Embed via JS - Paste the code from the clipboard into the JS code section of your site/blog post.
  2. Embed via iFrame - Paste the code from the clipboard into the HTML code section of your site/blog post. Please note that the editor of your site/blog post must support iframe tags in order for the player to work, otherwise it may not render correctly.


Audio and Video

Whooshkaa has the ability to serve both audio and video in the embeddable player, depending on the Show and Episode settings. If the episode has both an audio and a video file used, there will be an option available for the user to switch, preferring audio by default.

The "playVideoIfAvailable" directive can be used to add preference to use videos over episodes, if available. To use it, add the following to the embed code, depending on whether you're using the "Embed via JS" or the "Embed via Iframe" option.

Embed via JS

Add data-play-video-if-available="true" to the code. For example:

<script src="https://webplayer.whooshkaa.com/js/widget/loader.umd.min.js"></script>

Embed via Iframe

Add &playVideoIfAvailable=true to the URL in the Iframe. For example:

<iframe src="https://uat-webplayer.whooshkaa.com/episode/286527?theme=light&enable-volume=true&iframe-height=190&playVideoIfAvailable=true" height="190" width="100%" scrolling="no" frameborder="0" allow="autoplay"></iframe>

Iframe "sandbox" setting

Some content management systems may append additional code to the iframe, including the "sandbox" attribute. This attribute may block the loading of the player on some browsers.

In the case that this restricts the loading of the player, you may need make sure the following attribute values are set for the "sandbox" attribute (which will actually deem the sandbox ineffective -- please ensure that this is what you want to do):

  • allow-same-origin
  • allow-scripts

In case you wanted to know....