The easiest way to get started is to login to your account and add a video there. We’ll provide the appropriate code snippet for you to embed into your site.

If you rather want to set it up manually or want to do more complex things, you can add the code snippet shown below to your page. In case you’re adding videos to multiple pages, we recommend adding the <script> it to the <head> of your site.

<script type="module">
  import { Player } from "https://cdn.jsdelivr.net/npm/@maveio/components/+esm";
</script>

<mave-player embed="{embed id}"></mave-player>

You can can learn more about our player here.

Using React, Vue or Svelte?

Vue and Svelte can use our regular library as it can work with webcomponents. React can use this too, however React makes certain assumptions with HTML elements that can cause problems with custom elements. They’re working on addressing these issues. In the meantime we provide a React specific library that you can use instead, like so:

import { Player } from "https://cdn.jsdelivr.net/npm/@maveio/components/dist/react.js";

export default function App() {
  return (
    <div className="app">
      <Player embed="ubg507Sd0mszn4F"></Player>
    </div>
  );
}

Note: reach out to us if you’d rather want to include this code into your own development pipeline, by using the Node Package Manager for instance. You can contact us by clicking support within manage.