How To Embed YouTube video in Drupal 8 (CKEDITOR)

| Drupal Development | 47 seen

Now, there is one more reason I'm starting to enjoy Drupal 8, embedding YouTube videos in articles now are super easy, thanks to the simple and neat Drupal module - Video Embed Field

In this article, I will guide you through how to configure Drupal 8 built-in CKEDITOR to work with this module.

For another interesting YouTube module for use in Drupal views see Display YouTube videos on Drupal site with YouTube field module

Video Embed field creates a simple field type that allows you to embed videos from YouTube and Vimeo and show their thumbnail previews simply by entering the video's url.

Features

  • Responsive out the box, optionally make your videos scale proportionally to their container.
  • Large contrib ecosystem of video providers supported.
  • Easily pluggable, write simple plugins to support any video platform or provider.
  • Robust URL matching to support an array of possible inputs.
  • Display videos in a modal window, with Colorbox support.
  • Display thumbnails with image style support.
  • Role based autoplay override, allows configured roles to suppress video autoplay.
  • Easily overridable embed markup.
  • A direct WYSIWYG integration, provided by the video_embed_wysiwyg sub-module.
  • Integration with the media_entity module for websites using the media suite of modules.
  • Migrations to D8 from D7 as well as the D6 emfield module.

How to configure Video Embed field to work with CKEDITOR in Drupal 8

Download, install and enable Video Embed field, as we are going to use YouTube videos in the articles (and not in the views), enable Video Embed WYSIWYG (integrates video_embed_field directly into ckeditor. Useful for websites not using the media suite of modules that need WYSIWYG support.)

Visit "Configuration" > "Text formats and editors" > "Configure" your chosen editor. Then drag the video icon onto the ckeditor toolbar and make sure the "Video Embed WYSIWYG" input filter is enabled.

An example here: Hashflare releases Data-center video

Video Embed example

Video Embed example