Skip to main content

Get Started

Here are some basic steps for getting started for web:

  1. Add basic integration
  2. Add custom configuration and themes
  3. Listen to Speechify API events
  4. Run actions on the Speechify API

Basic Integration Example​

To integrate the API, you'll need to:

  1. Import the package using import
  2. Get the parent element for the content you want to make listenable (or your article)
  3. If you'd like to use the inline player, get the element for the title of the content you want to make listenable. The inline player will be placed under that title.
  4. Mount the Speechify API!

Vanilla JS​

You need to have the following element in the place where you want to attach the inline player.

<div id="speechify-root"></div>

In plain JS, this looks like:

import(
"{CDNLinkToLibrary}"
).then(async (speechifyWidget) => {
// this parent element for your article or listenable content
const articleRootElement = document.querySelector("article");

const widget = speechifyWidget.makeSpeechifyExperience({
rootElement: articleRootElement,
useSpeechifyRoot: true
});
await widget.mount();
});