Embed audio on your website

  1. 1.Open your project in Wubble Studio
  2. 2.Click the "Share" button in the top-right corner
  3. 3.Select the "Embed" tab
  4. 4.Customize your player: Choose size, theme, colors, and features
  5. 5.Toggle options like "Show download button", "Enable autoplay", etc.
  6. 6.Preview your embed player to see how it will look
  7. 7.Click "Copy Embed Code" to copy the iframe or HTML snippet
  8. 8.Paste the code into your website HTML where you want the player to appear
  9. 9.Publish your website - the player should appear and be fully functional

Embed a beautiful, responsive audio player on your website, blog, or portfolio to showcase your work. Wubble's embeddable player works seamlessly across all devices and platforms.

What is audio embedding?

Audio embedding allows you to add a playable audio player directly to your website using a simple code snippet. Visitors can listen without leaving your site.

  • Responsive player that works on desktop, tablet, and mobile
  • Modern, customizable design that matches your brand
  • Streaming playback - no downloads required
  • Waveform visualization and playback controls
  • Optional track information and artwork display
  • Analytics tracking for embedded plays

Embed player features

Wubble's embeddable player includes professional features for showcasing your audio.

  • Play/pause, seek, and volume controls
  • Animated waveform visualization
  • Track title, artist, and artwork display
  • Share and download buttons (optional)
  • Playlist support for multiple tracks
  • Autoplay and loop options
  • Customizable colors and themes
  • Optional Wubble branding (removable on paid plans)

Where to embed audio

Wubble embed codes work on virtually any website platform or content management system.

  • Personal websites and portfolios (HTML, WordPress, Wix, Squarespace)
  • Blog posts and articles
  • Online stores and product pages
  • Press kits and media pages
  • Email newsletters (limited support - check your email provider)
  • Social media bio links (Linktree, Beacons, etc.)

Tips

  • Use responsive size for embed code to automatically adapt to screen sizes
  • Match player colors to your website theme for a cohesive look
  • Disable autoplay on most sites (many browsers block it anyway)
  • Enable download button if you want visitors to save your audio
  • Use playlist embed for showcasing multiple tracks in one player
  • Test embed on mobile devices to ensure responsive behavior
  • Consider player height - compact players (60-80px) work well in sidebars
  • Remove Wubble branding with Pro plans for a white-label appearance

Notes

  • Free plans include Wubble branding on embedded players. Pro plans and higher can remove branding.
  • Embedded audio streams from Wubble's servers and counts toward your bandwidth quota.
  • Embed codes are automatically updated if you change your project - no need to update website code.
  • Some email clients don't support iframe embeds. For email, use public links instead.
  • Autoplay may be blocked by browsers - it's generally recommended to leave it disabled.

Frequently Asked Questions

What's the difference between iframe and HTML embed?

Iframe embed is simpler and works on most platforms. HTML embed provides more customization options but may require developer knowledge. For most users, iframe embed is recommended.

Can I embed audio on WordPress?

Yes! WordPress supports iframe embeds. Paste the embed code into an HTML block or Custom HTML widget. The player will appear on your published page.

How do I customize the player colors?

In the Embed settings, use the color picker to choose your primary, secondary, and background colors. You can also select from preset themes that match popular website styles.

Will embedded audio work on mobile devices?

Yes! Wubble's embed player is fully responsive and works on iOS, Android, and all mobile browsers. The player automatically adapts to smaller screen sizes.

Can visitors download my audio from the embed player?

Only if you enable the download button in embed settings. By default, the download button is disabled to protect your work.

Does embedding affect my SEO?

Embedded audio can enhance SEO by increasing time-on-page and engagement metrics. Make sure to add descriptive text and proper schema markup around your player for best SEO results.

Can I track plays on embedded audio?

Yes! Pro plans and higher include analytics for embedded plays. See total plays, unique listeners, average listen time, and traffic sources from your Analytics dashboard.

What if I update my project after embedding?

The embedded player automatically reflects changes to your project. If you update the audio or metadata, the embed will show the new version without requiring code updates.

How would you rate the help you received from this article?

Still need help?

Can't find what you're looking for? Our team is here to help you get the most out of Wubble.

?