Skip to Content
Embed PlayerCustomization

Embed Customization

Style your embeds in Design → Embed style in the dashboard.

Embeds and styles

Design → Embed style lists every embed you can use.

  • Core embeds (All episodes, Recent 3, Premiere Countdown, Sticky Player, Episode Spotlight) each have a style:
    • Contents: numbered and typeset like a contents page. It uses your website’s font and text color.
    • Shelf: cover art first, with tiles, a large latest episode and a countdown next to the art.
    • Deck: player first, with a scrubber, skip and speed controls, and rows that remember where listeners stopped.
  • Theme embeds, marked with a brush, come from your site theme and are drawn in it. Higher-tier themes include more of them.

Core embeds use your Brand colors. You can override the accent, background and text colors for all of them at once.

Each embed’s code includes its style (data-look="shelf", or data-look="theme" for theme embeds), so you can mix styles on one website.

Adjust styling in ShowHub

Open Design → Embed style, select an embed, pick its style and settings, then save it. Saved embeds are listed with their code on Publish.

Test on a staging page

Validate spacing and contrast against your website’s design system.

Roll out to production

Publish once approved and monitor real-page behavior on desktop + mobile.

High-impact attributes

AttributePurpose
data-themeForce light/dark mode or follow visitor system settings.
data-styleChange visual density and structure of player UI.
data-sectionRender only specific portions of the embed.
data-max-episodesKeep embeds compact by limiting list size.
data-show-premieresShow upcoming premieres with countdowns (Pro+).
data-sticky-positionControl sticky player anchor location.
Last updated on