viget/craft-video-embed

Generate an embed URL from a YouTube or Vimeo URL

Maintainers

Package info

github.com/vigetlabs/craft-videoembed

Documentation

Type:craft-plugin

pkg:composer/viget/craft-video-embed

Statistics

Installs: 67 236

Dependents: 0

Suggesters: 0

Stars: 24

Open Issues: 10


README

Generate an embed URL from a YouTube or Vimeo URL.

Requirements

This plugin requires Craft CMS 5.0.0 or later.

Installation

To install the plugin, follow these instructions.

  1. Open your terminal and go to your Craft project:

     cd /path/to/project
    
  2. Then tell Composer to load the plugin:

     composer require viget/craft-video-embed
    
  3. In the Control Panel, go to Settings → Plugins and click the “Install” button for Video Embed.

Using Video Embed

Pass a YouTube or Vimeo URL to the getVideoData method and a VideoData object is returned.

If the plugin is unable to parse the URL, null is returned.

  • type - If the video is youtube or vimeo
  • id - The ID of the video
  • image - The thumbnail of the video (only works for Youtube)
  • embedUrl - The URL you would use for the embed
  • url - The link to the embedded video
  • isVertical - true for YouTube Shorts (vertical/portrait) videos, otherwise false. Detected from the /shorts/ URL form, not the video's true orientation.

Example:

{% set video = craft.videoEmbed.getVideoData('https://www.youtube.com/watch?v=6xWpo5Dn254') %}

{% if video %}
   <iframe src="{{ video.embedUrl }}"></iframe>
{% endif %}

Output:

<iframe src="https://www.youtube.com/embed/6xWpo5Dn254?rel=0"></iframe>

YouTube embed URLs include rel=0 so related-video suggestions stay on the same channel rather than promoting unrelated videos.

Customizing URL params

Because embedUrl already carries a query string (YouTube's rel=0, or a Vimeo privacy h hash), add your own player params with Craft's built-in url() function rather than concatenating onto embedUrl. url() preserves the existing params and merges in your own:

<iframe src="{{ url(video.embedUrl, { autoplay: 1, mute: 1 }) }}"></iframe>
{# → https://www.youtube.com/embed/6xWpo5Dn254?rel=0&autoplay=1&mute=1 #}
Code At Viget

Visit code.viget.com to see more projects from Viget.