Skip to content

Embed the MediaBlaster streaming player with Video.js, shortcode, Gutenberg block, Elementor widget, and skins.

MediaBlaster Player

The MediaBlaster player embeds video on WordPress pages and posts. Video.js is the default playback engine with a safe native HTML5 fallback, multi-source HLS/DASH/MP4 support, caption/chapter/thumbnail tracks, and subscription-aware locked states.

The shortcode, Gutenberg block, and Elementor widget all use the same player. Locked or premium content never exposes playable source URLs in HTML when access is denied.

Using the MediaBlaster Player shortcode

[mediablaster_player]

Legacy shortcode (still supported)

[tv-video-player]

Both shortcodes use the same renderer. New sites should prefer [mediablaster_player].

Example with skin:

[mediablaster_player id="123" skin="streaming"]

Using the MediaBlaster Player Gutenberg block

  1. In the block editor, click + and search for MediaBlaster Player (category: Media).
  2. Insert the block and open the sidebar panels: Video Source, Player Display, Playback Options, Tracks, Advanced.
  3. Choose a Video Post ID (search or numeric ID). The block imports HLS/MP4, poster, and track URLs from that post’s MediaBlaster meta into the sidebar (editable). You can also enter direct URLs manually.
  4. Publish — the player appears on the live page.

Imported HLS/MP4 URLs in the sidebar are for reference only when a Video Post ID is set. The frontend always loads fresh URLs from that video post on each page view (same as the shortcode). This matters for Vimeo and other signed CDN URLs that expire.

Use URL fields instead of post meta (Advanced) applies only when no video post is selected (manual URL mode). The toggle is disabled when a post ID is set.

If URL fields stay empty after selecting a post, reload the editor or re-select the video — playback still works from post meta when only Video Post ID is set.

The editor shows a live preview when a source is configured. Subscription and source resolution behave the same as on the published page.

Using the MediaBlaster Player Elementor widget

Requires Elementor (Elementor Pro not required).

  1. Edit a page with Elementor.
  2. Search the widget panel for MediaBlaster Player (category MediaBlaster).
  3. Configure Source mode:
    • Current Post — uses the post ID of the page being viewed. On Theme Builder templates (e.g. single movies), set the sample post under the template Preview Settings (gear → Preview Settings → choose a movie); the editor canvas uses that preview post, not the elementor_library template post itself.
    • Select Post — pick a video from the dropdown or enter a Post ID.
    • Direct URLs — HLS/DASH/MP4 fields only (optional Post ID for poster/meta fallback).
  4. Adjust display, playback, and track settings in the remaining sections.

Editor preview: The Elementor canvas shows the same live player as the published page, not a text-only placeholder. If no source is configured yet, a dashed hint box explains what to set. Subscription-locked videos show the locked state in the editor too.

Example: drag MediaBlaster Player onto the page, set Current Post on a single movie template, or Select Post with a specific video ID.

Choosing a source

MethodBest for
Post ID (shortcode id, block Video Post ID, Elementor Select Post)Videos with MediaBlaster meta (rovidx_smarttv_URL, format, captions, BIF)
Direct URLsExternal streams, landing pages without a video CPT post
Current post context[mediablaster_player] with no id on a movie/episode singular template

URL priority when overrides are set: hlsdashmp4_1080360urlmp4 → post meta. See Source resolution below.

Enabled video post types depend on MediaBlaster → General Settings (movies, short videos, episodes). The block editor searches these types via AJAX; Elementor lists up to 50 recent published videos per type.

Selecting a player skin

SkinUse case
defaultGeneral site embeds
streamingTV-style layouts
creatorCreator-focused pages

Set via shortcode skin="streaming", block Player Display → Skin, or Elementor Player Display → Skin.

Adding captions

  • From post meta: use default behavior (captions="true" on shortcode, or leave caption URL empty in block/widget).
  • Override with WebVTT: caption="https://…/en.vtt" plus caption_label and caption_lang.
  • Subtitles track: subtitles URL with subtitles_label / subtitles_lang.

Adding chapters

  • Boolean (default): chapters="true" loads chapter behavior from post meta when available.
  • WebVTT URL: chapters="https://…/chapters.vtt" with optional chapters_label and chapters_lang.

Configure in the block/widget Tracks panel or shortcode attributes.

Adding thumbnail/storyboard tracks

  • BIF from meta: thumbnails="true" (default) loads rovidx_smarttv_bif when present.
  • WebVTT storyboard: thumbnails="https://…/thumbnails.vtt".

BIF scrubber UI on the progress bar is not implemented yet; metadata is stored for future use.

Autoplay and muted behavior

Most browsers block autoplay with sound. For reliable autoplay, enable Muted as well as Autoplay.

The Gutenberg block shows a warning in the sidebar when autoplay is on and muted is off. Elementor includes the same guidance in control help text.

Native fallback mode

Force native HTML5 (skip Video.js):

[mediablaster_player player_engine="native"]

Or set Player engine → Native HTML5 in the block or Elementor widget. If Video.js is unavailable, the player falls back automatically.

Basic examples

Current post context:

[mediablaster_player]

Specific video post:

[mediablaster_player id="123"]

Direct MP4 URL:

[mediablaster_player mp4="https://example.com/video.mp4"]

HLS stream:

[mediablaster_player hls="https://example.com/master.m3u8"]

DASH stream:

[mediablaster_player dash="https://example.com/manifest.mpd"]

Multiple MP4 qualities:

[mediablaster_player mp4_1080="https://example.com/video-1080.mp4" mp4_720="https://example.com/video-720.mp4" mp4_480="https://example.com/video-480.mp4"]

Poster override:

[mediablaster_player id="123" poster="https://example.com/poster.jpg"]

Autoplay (requires muted for most browsers):

[mediablaster_player id="123" autoplay="true" muted="true"]

Vertical video:

[mediablaster_player id="123" aspect_ratio="9:16"]

Captions (WebVTT):

[mediablaster_player caption="https://example.com/captions.vtt" caption_label="English" caption_lang="en"]

Subtitles:

[mediablaster_player subtitles="https://example.com/es.vtt" subtitles_label="Spanish" subtitles_lang="es"]

Chapters (WebVTT):

[mediablaster_player chapters="https://example.com/chapters.vtt" chapters_label="Chapters" chapters_lang="en"]

Thumbnail/storyboard VTT:

[mediablaster_player thumbnails="https://example.com/thumbnails.vtt"]

Legacy BIF trickplay URL (stored for future scrubber UI):

[tv-video-player bif="https://example.com/storyboard.bif"]

Player skins:

[mediablaster_player skin="streaming"]
[mediablaster_player skin="creator"]

Native HTML5 fallback (skip Video.js):

[mediablaster_player player_engine="native"]

Player engine

Default engine: videojs.

  • Video.js loads only when a player is rendered on the page (not globally).
  • If bundled Video.js files are missing, or another plugin already registered Video.js, the player adapts automatically.
  • If Video.js is unavailable, playback falls back to native HTML5 without breaking the page.

Bundled assets live at public/vendor/videojs/ inside the plugin. See that folder’s README for upgrade instructions.

Supported attributes

AttributeDefaultDescription
idcurrent postVideo post ID
player_enginevideojsvideojs or native
hlsHLS master URL (.m3u8)
dashDASH manifest URL (.mpd)
mp4_10801080p MP4 URL
mp4_720720p MP4 URL
mp4_480480p MP4 URL
mp4_360360p MP4 URL
urlGeneric video URL override
mp4MP4 URL override
typeautoForce format: hls, mp4, dash, etc.
posterfeatured imagePoster image URL
max_width1920pxCSS max-width
aspect_ratio16:916:9, 4:3, 1:1, 9:16, 21:9
skindefaultdefault, streaming, creator
controlstrueShow player controls
preloadmetadatanone, metadata, auto
autoplayfalseAutoplay when allowed
loopfalseLoop playback
mutedfalseMute audio
playsinlinetrueMobile inline playback
start_time0Seek to seconds on load
classExtra CSS classes
bifLegacy BIF URL or VTT storyboard alias
captionstrueLoad caption tracks from post meta
captionSingle captions VTT URL
caption_labelEnglishCaptions track label
caption_langenCaptions track language
subtitlesSingle subtitles VTT URL
subtitles_labelEnglishSubtitles track label
subtitles_langenSubtitles track language
captions_jsonJSON array of multiple caption/subtitle tracks
chapterstrueBoolean flag, or chapters VTT URL
chapters_labelChaptersChapters track label
chapters_langenChapters track language
thumbnailstrueBoolean flag for BIF meta, or thumbnails VTT URL
thumbnail_labelThumbnailsThumbnail metadata track label
resumefalseReserved for future resume watching
autoplay_nextfalseReserved for future playlist autoplay
locked_behavioroverlayoverlay or message when access denied

Dual-mode attributes

  • thumbnails: true/false controls BIF meta loading; a URL value sets a WebVTT metadata track.
  • chapters: true/false sets the chapters feature flag; a URL value adds a WebVTT chapters track.
  • captions: false disables all caption/subtitle output including post meta.

Source resolution

URL priority:

  1. Shortcode hls
  2. Shortcode dash
  3. Shortcode mp4_1080, mp4_720, mp4_480, mp4_360
  4. Shortcode url
  5. Shortcode mp4
  6. Post meta rovidx_smarttv_URL
  7. Fire Creator add-on MP4 meta (when active)

Format detection uses explicit args, post meta rovidx_smarttv_format, or URL extension (.m3u8, .mpd, .mp4).

For HLS (.m3u8), the player follows master-playlist redirects server-side before rendering (common for Vimeo and other CDNs). This ensures variant playlists and segments load from the CDN origin with proper CORS instead of failing with a perpetual spinner.

Captions load from post meta rovidx_smarttv_cc when captions="true".

BIF trickplay loads from post meta rovidx_smarttv_bif when thumbnails="true" (boolean mode).

Subscription access

When subscriptions are enabled, the player checks entitlements before outputting playable sources.

  • Show locked — Branded overlay with poster; no video URL in markup
  • Hide completely — Empty output (no player rendered)
  • Use locked_behavior="message" for legacy plain-text locked message

See Subscription Access Metabox.

Troubleshooting

Block shows poster but no play button or controls (shortcode works)

Typical signs: HLS or segments may load in the Network tab; no JavaScript errors; Video.js poster visible; no big play icon or control bar.

Cause: Video.js can end up in vjs-controls-disabled when ingesting a <video class="video-js"> element without a native controls attribute, even when data-controls="true" is on the wrapper.

Check in browser DevTools:

const w = document.querySelector('[data-mediablaster-player]');
const vjs = w?.querySelector('.video-js');
console.log({
  dataControls: w?.getAttribute('data-controls'),
  controlsDisabled: vjs?.classList.contains('vjs-controls-disabled'),
  bigPlayDisplay: getComputedStyle(w.querySelector('.vjs-big-play-button')).display
});

Expect when healthy (paused): dataControls is "true", controlsDisabled is false, bigPlayDisplay is "block".

Also verify: hard-refresh the page so cached scripts are cleared; block has a valid Video Post ID; compare with [mediablaster_player id="SAME_ID"] on a test page. If the shortcode works but the block does not, update MediaBlaster to the latest version.

Block does not play but Network shows HLS requests

  1. Confirm Video Post ID points to a published video with rovidx_smarttv_URL (or overrides in manual URL mode).
  2. Do not rely on stale HLS URLs saved in block JSON for post-backed videos — playback uses post meta, not expired sidebar URLs.
  3. See Video.js controls above if the stream loads but the UI is missing.

Player assets missing (no init at all)

  • Confirm the page includes the player block or shortcode and is not loading a stripped template that omits scripts.
  • Hard-refresh or clear site cache so Video.js and player scripts load.
  • Check the browser console for blocked or failed script requests.

Editor: Controls toggle looks off for new blocks

The block defaults Controls to on. If the sidebar showed Controls off before saving, older posts may have controls: false in block JSON — re-enable Controls under Playback Options and update the post.

Subscription locked

No playable <source> in HTML when access is denied — expected. See Subscription access.

Not available yet

These features are not part of the player today:

  • BIF scrubber UI on the progress bar
  • Resume watching / watch progress storage
  • Continue Watching shelf
  • Analytics dashboard
  • Autoplay next episode logic
  • Chromecast / AirPlay / VAST ads

Was this helpful?