Embedding is the process of adding the Podcaster player widget to your website, making it readily available to your website visitors.
On most website building platforms, placing this widget on your site can be as simple as copying and pasting the codes that we provide.
The iframe embed code is the most universally compatible embed code that can be used on any kind of web page or web application which supports HTML. SoundStack provides iframe embeddable codes that are readily available within the Podcaster Dashboard under the "Share" tab.
The following steps will guide you through the process of embedding your Podcast widget into a WordPress website. We picked WordPress for the tutorial as it is currently one of the most utilized CMS (Content Management System). If you are using a different website builder or you are directly editing your website's code, the process will be similar.
- Access the Content menu from the left side of Podcaster. Then, select a specific Show and navigate to Share tab:
- Configure the widget to your preference as shown in the outlined areas of the screenshot below. There are two predefined themes and you may customize further (1) with different colors for text and backgrounds. The widget will automatically update and provide you with a preview of how it will look on your web page. You can configure different themes (2) and save them as presets for later use. Lastly, you can limit your widget to display a certain number of episodes (3). Once all the changes are made, press Save Configuration button.
- After configuring the widget preferences, copy the generated code by pressing the Copy to clipboard button from the Quick Links tab.
- Next, you would switch over to your website editor. We're using WordPress for this example. In WordPress, you need to access your site and log in to the Administrator control panel. This can be usually be done by adding /wp-admin at the end of your site URL.
- Once in the Administrator control panel of WordPress, navigate to Pages then click on the page where you wish to add the widget to.
- The WordPress page editor will open up. Click the "+" button from the top left corner in order to add a new block. Select Custom HTML as a block type.
- Paste (CTRL+V or right click then "Paste") the code you've copied on Step 3 inside the freshly created Custom HTML block. Once pasted, you may choose to preview the result or directly publish the page from the top right corner of the editor.
Your Podcaster widget should now display on your website in the same format and configuration as you selected in Step 3.
This concludes our introductory tutorial on how to embed the Podcaster player to your website.