Embedding YouTube videos in PerchCMS blog module

April 3, 2019, 7:51 pm
Author: James Griffiths

If you use PerchCMS/Runway for your website you might have encountered difficulties with embedding YouTube videos into your blog articles when using the CKEditor tool (thanks to iframe tags being stripped out by the editor).

The easiest way to resolve this situation is to install the CKEditor YouTube plugin as follows:

  1. Download the following version of the YouTube plugin from the author's Github account: https://github.com/fonini/ckeditor-youtube-plugin/releases/tag/v2.1.4
  2. Extract the YouTube directory from this download and place within the following perch directory: /perch/addons/plugins/editors/ckeditor/ckeditor-4/plugins/
  3. Open the CKEditor config.js file from the following location: /perch/addons/plugins/editors/ckeditor/ckeditor-4/ and add the following lines BEFORE the final curly brace:
config.extraPlugins = 'youtube';
config.youtube_responsive = true;
config.youtube_controls = true;

These simply inform the CKEditor that the YouTube plugin is to be added to and enabled within the editor toolbar, that embedded videos are responsive and video player controls are displayed for embedded videos. 

Once added to the config.js file you might need to log out of your PerchCMS admin panel, clear your browser cache and log back in to see your blog CKEditor instances now display the YouTube video plugin within their toolbars.

Interacting with this new addition to the toolbar throws up the following modal where you can now choose how to embed your video within the blog:

YouTube video embed dialog window

Nice and easy huh?

Categories

« Return to Posts

Post a comment

All comments are welcome and the rules are simple - be nice and do NOT engage in trolling, spamming, abusiveness or illegal behaviour. If you fail to observe these rules you will be permanently banned from being able to comment.