How to add a sticky audio and video player in WordPress

Decide whether you only need a player fixed to the viewport, or whether the same track must continue while visitors move between pages. These are different jobs. A fixed player can be built with normal WordPress blocks and CSS; continuous playback needs the player to survive navigation.

Also decide whether you are serving an MP3 or MP4 yourself, embedding a hosted video, or loading a live stream. Large self-hosted video files can consume storage and bandwidth quickly.

Edit the page, template, footer or site-wide widget area where the player should appear. Add an Audio block for an MP3 or other supported audio file, or a Video block for an uploaded file or video URL. WordPress provides playback controls and settings such as autoplay, loop, mute and preload.

Put the player in a site-wide location rather than inside one post if visitors should see it throughout the site. A player placed only in post content will disappear when the visitor opens another page.

Wrap the player in a Group block or theme container, then use the editor’s sticky-position option if your site exposes one. WordPress.com documents this Group-block method for keeping blocks visible while scrolling. On a self-hosted site, the equivalent is a fixed-position container added through the theme or custom CSS, usually anchored to the bottom of the viewport.

Leave space for the player so it does not cover cookie notices, checkout buttons, captions or mobile navigation. Check both bottom and top placement because some themes already reserve space around the header or footer.

A native Audio or Video block normally stops when the browser loads a new WordPress page. Making it sticky keeps it visible during scrolling; it does not preserve playback across a full page reload. Continuous playback requires site navigation that replaces page content without reloading, custom JavaScript that carries the live player between views, or a plugin built for persistent playback.

This is the point where many implementations break: the player appears on every page, but the audio starts again or stops after every click. Do not promise uninterrupted playback unless you have tested actual navigation between several pages.

Keep playback controls enabled, use muted autoplay only where it serves a clear purpose, and avoid forcing visitors to hear sound as soon as a page opens. Browsers commonly block autoplay with sound, and video autoplay may be blocked even when the setting is enabled.

Use metadata or a low preload setting for large files instead of downloading the entire file on page load. Add captions to videos and provide a text transcript where the content matters for accessibility.

Open the site on desktop and mobile, scroll through long pages, resize the browser, and test the player over menus, consent banners and checkout controls. Then start playback and visit at least five different pages, use Back and Forward, and visit one page where the player is absent.

Confirm that the player does not create two audio streams, overlap the mobile browser controls, or restart unexpectedly. If playback must continue between pages and the native route fails this test, the fast route is a persistent-player plugin.

For the fast route, use MP3 Sticky Player WordPress And WooCommerce Plugin. It is designed to keep an audio or video player fixed at the top or bottom of the site, with playlists, streams, podcasts and a popup player. It supports MP3, MP4, YouTube videos, HLS streams and podcast content, so it is a better fit than the native blocks when you need site-wide playback and more than one track.

After installing it, create the playlist or media source, choose the sticky position and enable the persistent or popup behaviour that matches your site. Test page-to-page playback before publishing, because caching, theme scripts and consent tools can still interfere with a player that loads site-wide.