Mux EE Module Docs

for ExpressionEngine

Vidstack

Vidstack is a new video player based on native web components where playback can be as simple as html and a little css.

It can also be easily customized by using simple html components like <media-fullscreen-button> and <media-volume-slider> to make a unique video player.

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vidstack/styles/defaults.min.css" />
    <script type="module" src="https://cdn.jsdelivr.net/npm/vidstack/dist/cdn/prod.js"></script>
</head>
<body>
{exp:channel:entries channel="blog"}
  {my_mux_field}
    <media-player
        src="{playback_url}"
        poster="{thumbnail_url}"
        title="{name}"
        controls
      >
      <media-outlet></media-outlet>
    </media-player>
  {/my_mux_field}
{/exp:channel:entries}
</body>
</html>