Skip to main content
CMS & Frameworks iframe embed Player API

Embed VideoNest video in Vue & Nuxt.

Use a simple Single File Component wrapper around the VideoNest iframe, or wire up the Player API for programmatic playback control. No npm package needed — just your embed URL.

Get VideoNest video into your Vue app.

No package to install. Copy your embed URL from VideoNest and wrap it in a component.

Step 01

Copy your embed URL from VideoNest.

Open any video in your VideoNest library, click Share / Embed, and copy the iframe URL. It includes your video ID and all configured player settings.

Step 02

Create a VideoPlayer SFC.

Wrap the iframe in a Single File Component. Accept videoId as a prop so you can reuse it across your Vue or Nuxt app without duplication.

Step 03

Pass URL params for per-instance control.

Bind params like autoplay, aspect, or show_title as props and interpolate them into the URL for per-placement customization.

VideoNest + Vue / Nuxt

Zero npm dependency

The VideoNest player is delivered via iframe — no package installs, no peer dependency conflicts, no bundle size impact.

SFC-friendly pattern

A minimal Single File Component wraps the iframe. Accept videoId, channelId, or any URL params as Vue props.

Nuxt SSR compatible

The iframe renders server-side in Nuxt without hydration issues. No <ClientOnly> wrapper needed for basic delivery.

Player API via postMessage

Use the VideoNest Player API with Vue's ref and postMessage to trigger play, pause, seek, or listen for playback events.

Channel & playlist embeds

Embed a browseable grid or playlist — great for video hubs and content libraries inside your Nuxt app or Vue SPA.

Analytics included

Views from your Vue/Nuxt app tracked in VideoNest alongside all your other distribution channels.

CDN delivery

Video served from VideoNest's global CDN — no egress fees, no storage configuration required.

Reactive & responsive

Bind any video ID reactively. The player fills its container — set width:100% and it handles the rest.

Plan
Embed code available on all plans including Free. Player API on Creator and Business. See pricing →
Setup
No npm package required. Copy the embed URL from your VideoNest library and wrap it in a Vue SFC component.
Embed & API
Use an iframe for quick delivery or the Player API for programmatic control. Embed docs →
Analytics
All views tracked in VideoNest alongside your other channels. Analytics →

Start embedding VideoNest in Vue today.

Get your embed URL, wrap it in a component, and your video is live — with your branding and settings already applied.

No credit card required  ·  No npm package needed