Embeddable Widget

Use the widget to play a single album, a specific track, all songs, or a custom playlist. Control styling and behavior via URL flags.

Examples

Full (default)

<iframe src="https://fm.loftwah.com/widget?album=all&variant=default" width="100%" height="420" frameborder="0"></iframe>

Compact

<iframe src="https://fm.loftwah.com/widget?album=all&variant=compact" width="100%" height="240" frameborder="0"></iframe>

Compact — preselected track (shuffle + repeat all)

<iframe src="https://fm.loftwah.com/widget?album=run-it&file=Run%20it.mp3&variant=compact&shuffle=1&repeat=all&width=560" width="100%" height="240" frameborder="0"></iframe>

Mini

<iframe src="https://fm.loftwah.com/widget?album=all&variant=mini" width="100%" height="120" frameborder="0"></iframe>

How to embed

Place the iframe in a full-width row. The widget centers its content and constrains width via the width parameter (default 560 for compact). Keep the iframe width at 100% and use the recommended height for the chosen variant. Autoplay is off by default for embeds and is not recommended.

HTML

<section class="embed-row">
  <iframe
    src="https://fm.loftwah.com/widget?album=run-it&file=Run%20it.mp3&variant=compact&shuffle=1&repeat=all&width=560"
    width="100%"
    height="240"
    frameborder="0"
    loading="lazy"
    allow="clipboard-write">
  </iframe>
</section>

React / Next.js (JSX)

<section style={{ width: "100%" }}>
  <iframe
    src="https://fm.loftwah.com/widget?album=run-it&file=Run%20it.mp3&variant=compact&shuffle=1&repeat=all&width=560"
    style={{ width: "100%", height: 240, border: 0, display: "block" }}
    loading="lazy"
    allow="clipboard-write"
    title="LoftwahFM - Run It"
  />
</section>

URL Flags

album: album slug, or all or playlist
file: track filename within the album (URL encoded)
tracks: comma-separated list of slug/File.mp3 for custom playlist
autoplay: Off by default for embeds (not recommended). Set to 1 to request autoplay, but browsers may block it.
shuffle: 1|true to enable shuffle on load
repeat: none | one | all (defaults to previous preference)
variant: compact (recommended). Other variants are experimental and may change.
unstyled: 1|true to avoid site global styles (Tailwind utilities only)
brand: 0|false to hide the brand header (pill logo + LoftwahFM)
width / w: max content width in pixels (content is centered inside the iframe); defaults: 720 (default), 560 (compact), 320 (mini)

Note: Browser autoplay policies may require a user gesture.