Skip to main content
Magic Embed is the quickest way to integrate BeyondWords with any web platform. Add a script to your article template and BeyondWords will automatically ingest content from live pages, generate audio and/or video, and install the player—no backend integration required. Magic Embed is also known as the client-side integration. If you’re using the JavaScript SDK directly, the equivalent setting is clientSideEnabled.
Using WordPress with Elementor or another page builder? The WordPress plugin can use Magic Embed as an alternative to its default REST API integration. You can also set up other distributions for your audio and video content, or configure Magic Embed via the Magic Embed API.

​
How it works

Magic Embed is a client-side integration. The script runs in the visitor’s browser each time an article page loads, but content ingestion works differently on the first visit versus later ones.
  • First visit: When an article hasn’t been ingested before, the script triggers content extraction from the live page and starts audio/video generation. The player appears once generation is complete.
  • Later visits: The player loads existing audio/video straight away. BeyondWords periodically re-checks the live page for updates, but not on every visit. If you’ve edited the article on your website, changes are picked up automatically over time.
If you don’t pass an identifier, the page URL (window.location.href) is used by default. This works out of the box, but we recommend passing a sourceId—your CMS article ID—in the embed code wherever you can. Magic Embed will use it as the content’s source_id, which lets you search for content by source ID in the dashboard, embed the player on other surfaces using the same ID, and take advantage of platform features such as webhooks and syndicated content that key off source_id.
URLs can change if an article moves. A sourceId tied to your CMS article ID is more stable and consistent across your site, apps, and integrations.
On the first visit, the player won’t appear until audio/video generation is complete. If a domain isn’t in your allowed domains list, content won’t be ingested and the player won’t load.

​
Install Magic Embed

1

Enable Magic Embed

Go to Settings → Integrations → Magic Embed in your project dashboard and switch the toggle on.
2

Add allowed domains

In the Allowed domains field, enter each domain where Magic Embed should work, then click Add.Include production, staging, preview environments, and any subdomains (e.g., www.example.com and staging.example.com are separate entries). If a page’s domain isn’t on this list, BeyondWords won’t ingest content from it.
3

Copy the embed code

In the Embed code dropdown, select what type of content you want to embed: , , , or .Click the copy icon alongside the embed code—you’ll need this in step 6.Then, click Save changes.
4

Set request headers (optional)

For paywalled or protected content, configure authentication headers so BeyondWords can access your pages. These are project-level extraction settings, shared with the RSS Feed Importer and URL imports.
  1. Go to Settings → Extraction in your project dashboard
  2. Add a Header name and Header value
  3. Click + to add additional headers if needed
  4. Click Save changes
Requests will be made with User-Agent: BeyondWords Importer
5

Enable static IP (optional)

If your website requires IP allowlisting, enable static IP in your extraction settings.
  1. Go to Settings → Extraction in your project dashboard
  2. Switch the Static IP toggle on
  3. Allowlist the displayed IP addresses within your firewall, CDN, or server configuration
  4. Click Save changes
Requests will be sent from 20.234.8.180
6

Add the embed code to your website

Paste the script into your article template where you want the player to appear. The player is inserted immediately after the script tag.A typical embed code looks like this. Pass your CMS article ID as sourceId if your template has access to it:
<script async defer
  src="https://proxy.beyondwords.io/npm/@beyondwords/player@latest/dist/umd.js"
  onload="new BeyondWords.Player({
    target: this,
    projectId: YOUR_PROJECT_ID,
    sourceId: YOUR_ARTICLE_ID,
    clientSideEnabled: true,
  })">
</script>
Copy the base snippet from your dashboard—it will include your project ID and the correct settings for your chosen content type—then add sourceId in your article template.

​
Content filters

Magic Embed uses automatic extraction by default, which identifies editorial content on your page and ignores most non-article elements. In practice, most publishers also set up content filters to fine-tune what gets included or excluded—for example:
  • Exclude newsletter sign-ups, related-article blocks, social embeds, or author bios that shouldn’t be read aloud
  • Include only a specific container when automatic extraction picks up more than you need
Filters are applied alongside automatic extraction, so you don’t need to switch extraction modes to use them. Configure them in Settings → Extraction → Filters in your project dashboard. See content filters for how to create include and exclude rules, and the available filter types (class, ID, XPath, text, and more).
If you need precise control over metadata such as title, author, or publish date, use data attributes alongside filters.

​
Fine-tuning your integration

Beyond filters, you can further refine how Magic Embed processes your pages:
  • Content extraction—extraction modes and advanced filter configuration
  • Data attributes—explicitly define title, author, publish date, and other fields in your HTML
  • Player settings—customize player appearance and behavior
  • Segment detection—Magic Embed automatically retrieves segment markers from your page for text highlighting
You can also distribute generated content beyond the player using playlists, podcast feeds, and downloads.

​
FAQs

BeyondWords periodically re-checks your live article for changes and regenerates audio/video when it detects an update—it doesn’t re-ingest the page on every visit. This happens automatically unless you’ve disabled automatic updates in the Editor (see below).
If you make changes to content generated via Magic Embed in the Editor, the content will be regenerated accordingly. However, any future changes to your live article may trigger regeneration, which will overwrite changes you made in the Editor.To preserve your edits, go to the Info tab in the Editor and disable API updates. This stops automatic sync from your website—future changes on your live article will no longer be picked up.If you want article updates to continue syncing automatically, use content filters to control what gets included or excluded from audio generation instead of editing articles manually in the Editor.
No. The player only appears once content has been generated and is ready to play.
Magic Embed uses automatic extraction by default. If the extracted content is incorrect, use content filters or data attributes to control what BeyondWords includes or excludes.

​
Getting help

If you encounter issues or have questions, contact support.