Elementor and other page builders

3 min read

TTSWP works with every major page builder. The player appears automatically on posts that have audio, regardless of which builder created the post. This page covers per-builder tips and known quirks.

Elementor

Default behavior

The player appears on Elementor-built posts in the placement you picked (after title, after content, etc.). No extra setup needed.

Custom placement with a widget

If you want the player in a specific spot (not the global placement), use the Shortcode widget in Elementor:

  1. Add a Shortcode widget to your Elementor layout.
  2. Paste [tts_player].
  3. Save.

The player appears exactly where you placed the widget.

Known quirks

  • Elementor's preview editor does not render the TTS player (only the live site does)
  • Template parts and headers cannot contain the player via global placement - use the shortcode widget
  • Elementor Pro's theme builder templates work with the shortcode widget method

Divi

The player appears in the global placement automatically. For custom placement:

  1. Add a Text module to your Divi layout.
  2. Paste [tts_player].
  3. Save.

Visual Composer (WPBakery)

Use the Text Block or Raw HTML element:

[tts_player]

Gutenberg (block editor)

Works out of the box. The player appears in the global placement.

For custom placement inside a post, use the Custom HTML block or Shortcode block:

[mementor-tts]Custom text to narrate.[/mementor-tts]

Classic editor

Works out of the box for automatic placement. For custom shortcodes, just paste them into the text area.

Beaver Builder

Use the HTML module and paste [tts_player].

Oxygen Builder

Use a Shortcode component and paste [tts_player].

Common issues across builders

Player is missing on some pages

Check:

  1. The post type is enabled in Text to Speech → Content
  2. The post actually has generated audio (open the posts list, confirm the TTS column shows Play)
  3. Your builder is not overriding the the_content hook (some do)

If your builder bypasses the_content, use the shortcode method above.

Player position looks wrong

Global placement targets WordPress's the_content filter. Builders that render their own content in a different hook may place the player at an unexpected spot. Switch to a shortcode-based approach for precise control.