Embed audio automatically

Automatically embed the Small Player on pages with audio versions.

️ If you have followed setup instructions for the WordPress plugin or Ghost integration, this feature is already enabled.

If you use the BeyondWords RSS Feed Importer, API integration, or Text-to-Speech Editor, you can automatically embed audio versions alongside their corresponding text versions on your website or app using our:

The code will check whether there is an audio version of each page on your website or app by comparing the page URL/ID against the audio metadata. (If you are using our Text-to-Speech Editor, you will need to enter the URL as metadata when requested.)

When an audio version is available, the Small Player will render with corresponding audio. It will not render on pages where an audio version is unavailable.

Enable automatic embed on AMP

To enable automatic embeds on AMP, you will need to add the AMP-specific embed code into your article template:

<amp-iframe
    width="295" height="43"
    sandbox="allow-scripts allow-same-origin allow-popups"
    layout="responsive" scrolling="no" frameborder="0"
    src="https://spkt.io/amp/{project_id}?podcast_id={podcast_id}">
  <amp-img
    width="643" height="150"
    layout="responsive" placeholder
    src="https://s3-eu-west-1.amazonaws.com/speechkit-js/logo.svg"></amp-img>
</amp-iframe>

You will need to replace project_id with your own Project ID and pass one of the following parameters: podcast_id | external_id | article_url.

You can open this example in the AMP Playground.

The Small Player does not render when audio is unavailable. However, due to AMP restrictions, we cannot hide an amp-irrame (as we do normally) when audio is unavailable. To solve this you will need to add a function checker to show/hide the amp-frame and this must be added on your side due to the restrictions.

The function needs to make a request to our API and to check whether the audio exists or not. You can then show/hide the iFrame depending on the response. The following snippet will give you the request URL:

 [https://app.speechkit.io/api/v2/projects/{project_id}/podcasts/search?url={article_url}](https://app.speechkit.io/api/v2/projects/%7Bproject_id%7D/podcasts/search?url=%7Barticle_url%7D)
curl -X GET "https://app.speechkit.io/api/v2/projects/{project_id}/podcasts/search?url={article_url} \
 -H "Accept: application/json"

When you make a request using sRequestUrl, it will return a 200 JSON response for an existing audio article, or a 404 Not Found response for an article that can't be found. You can then show/hide the iframe according to this response.

Response

Meaning

🟢 200: OK

Audio exists

🔴 404: Not Found

Audio cannot be found

FAQs

Will the Player slow down my website?

Our Player should not slow down your website. We’ve designed BeyondWords to minimize any effect on latency. Our default JavaScript Player is lightweight and, when embedded via iFrame, it only loads after all other page content has loaded. We’re also the only text-to-speech service that transcodes audio for HLS (HTTP Live Streaming), which splits audio into 15-second segments at different bit rates to ensure frictionless listening.


What happens if the audio is scheduled for later?

If you have scheduled the audio for later, the Player will not show on the page until the scheduled time.



Did this page help you?