Kirby Plyrtag

kirbytag for plyr player
Alternatives To Kirby Plyrtag
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
Plyr23,40327714512 days ago153April 20, 2022804mitJavaScript
A simple HTML5, YouTube and Vimeo player
React Player7,5231,0805176 days ago147September 16, 2022199mitJavaScript
A React component for playing a variety of URLs, including file paths, YouTube, Facebook, Twitch, SoundCloud, Streamable, Vimeo, Wistia and DailyMotion
Lightgallery5,7301222620 days ago107September 19, 202250otherTypeScript
A customizable, modular, responsive, lightbox gallery plugin.
Lightgallery.js5,22354257 months ago15October 29, 20202otherJavaScript
Full featured JavaScript image & video gallery. No dependencies
Lite Youtube Embed4,5482a month ago8March 17, 202135otherJavaScript
A faster youtube embed.
3a day ago54March 08, 202243gpl-3.0PHP
Web GUI for youtube-dl
Vime2,4441116 days ago81September 13, 2022153mitTypeScript
Customizable, extensible, accessible and framework agnostic media player. Modern alternative to Video.js and Plyr. Supports HTML5, HLS, Dash, YouTube, Vimeo, Dailymotion...
Jarallax1,248102255 days ago30March 30, 202218mitJavaScript
Parallax scrolling for modern browsers
1710 months ago24December 04, 202036JavaScript
use a custom yutube player for a video as background on jQuery framework
1a month ago53January 25, 202237apache-2.0Swift
iOS Text View (UIView) that Properly Displays LaTeX, HTML, Markdown, and YouTube/Vimeo Links
Alternatives To Kirby Plyrtag
Select To Compare

Alternative Project Comparisons

kirby plyrtag | Kirbytag for plyr player

Implements html syntax for plyr video, audio, vimeo & youtube player

by Dominik Pschenitschni | Github


This is an extension of kirbytext for the kirby cms, which adds an easy way to embed your self-hosted html5-video and audio sources, vimeo & youtube player with the beautiful plyr as UI.

This extension can handle mp4 (h.264), webm and HTTP-live-streaming sources as well as a poster. You can select, which sources you have (for audio mp3 / ogg).

It is as well possible to embed a YouTube or Vimeo video via the video ID. Kirby plyrtag automatically detects if the ID is from YouTube or Vimeo and includes. For this it is better to enable caching in kirby (because the detection takes some time).

Quick setup


Store the plyrtag.php in


2) (Optional for self hosted media)

Store your video / audio files in the content folder of your page.


Add plyr css and js and as told in the plyr readme.

Include the plyr.css stylsheet into your <head>.

<link rel="stylesheet" href="path/to/plyr.css">

Include the plyr.js script before the closing </body> tag and then call plyr.setup(); to initialize it.

<script src="path/to/plyr.js"></script>

Use tag

Add a kirbytag to your content-file (txt) at the point you want the video to be.

For self hosted videos

By default paths are relative to the current page folder (can be changed with kirby options).

(plyr: video mp4: video.mp4 webm: video.webm hls: hlsFolder/hlsfile.m3u8 poster: poster.jpg)

Just use the tag attributes that you need (eg. just mp4, web and poster).

(I didn't test HLS yet, so I don't know if that works. Help in converting videos is welcome).

For self hosted audios

Just use the attributes that you need.

(plyr: audio mp3: audio.mp3 ogg: audio.ogg)

For YouTube videos


For Vimeo videos

(plyr: VIMEOID)

Kirby options

Optional for self hosted files: Store your media files in a separate folders, so you can prevent those huge files from being added to git or dropbox (by excluding them from the sync). Add options to your kirby config file.

Exclude this folder from dropbox-sync before you add any content to that folder! Or move the content temporary to another folder! Otherwise all the content in the excluded folder will be removed from the local directory (but not the server)

Video Files

Option Type Default Description
plyrtag.globalVideoFolder Boolean false Toggles if your video files should be stored in a global video folder (default: video) in your kirby root folder.
plyrtag.globalVideoFolderName String video Set a different name for the global video folder.

Audio Files

Option Type Default Description
plyrtag.globalAudioFolder Boolean false Toggles if your audio files should be stored in a global audio folder (default: audio) in your kirby root folder.
plyrtag.globalAudioFolderName String audio Set a different name for the global audio folder.

Example configuration

c::set('plyrtag.globalVideoFolder', true);
c::set('plyrtag.globalVideoFolderName', 'myVideoFolder');

c::set('plyrtag.globalAudioFolder', true);
c::set('plyrtag.globalAudioFolderName', 'myAudioFolder');


  • [x] Add audio support (added in 0.2.0)
  • [ ] Auto detect if the source files exist.
  • [ ] Find out how to easy convert files to hls (I don't use it myself yet). Any ideas?
  • [ ] Find a better (faster ) method to find out if video id is from youtube or vimeo.

License: GPLv3 License

Based on kirbytag html5video by Jannik Beyerstedt from Hamburg, Germany | Github. Thanks!

Popular Youtube Projects
Popular Vimeo Projects
Popular Social Media Categories

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.