oEmbed for Kirby (Youtube, Vimeo, Soundcloud etc.)

Plugins
, , , ,
1

Since I released a new version today, I thought it would be good to also finally create a forum post about this:

oEmbed for Kirby CMS

Using this plugin enables Kirby 2 CMS to display embeds of several media sites (e.g. YouTube, Vimeo, Soundcloud) by only providing the URL to the medium. The plugin also includes some options to reduce the site loading time by using lazy videos (thumbnail preview and embed is only loaded after click) as well as extensive caching.

Use it as a Kirbytag in your textarea field:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
(oembed: https://www.youtube.com/watch?v=wZZ7oFKsKzY)

or on any field as a field method:

<?php echo $page->featured_video()->oembed(); ?>

Docs & Download: https://github.com/distantnative/oembed
See it in use: http://distantnative.com/blog/fiftytwo-tuesdays (Youtube) / http://distantnative.com/blog/sunday-afternoon-recording (Soundcloud)

Support me: with buying a moral license

In the panel

On the front

On the front playing

8 Likes
2

Hi @distantnative. Could you provide an example for the blueprint you used to achieve the Panel form above? Especially the Cover Image thingy is not clear to me. Thanks a lot, Moritz

3

For the cover image thingy, use the Selector plugin by @DieserJonas

1 Like
4

Exactly what @texnixe said. And in my template I use it with the oembed custom thumbnail option:

<?php echo $video->oembed(array('thumbnail' => $page->image($page->cover())) ?>
// cover is the name of the selector field
1 Like
5

Thanks a lot, guys. M.

6

cool plugin. thanks all

7

Hi everyone - help!
Even with the code above I seem to be a having a problem getting the thumbnail to function.
The code -

<?php echo $video->oembed(array('thumbnail' => $page->image($page->cover())) ?>

is giving me a syntax error.

I have the config file set for lazyvideo, the blueprint with selector - name of “cover” etc…

many thanks

8

There is a closing parenthesis missing at the end.
But in general it would be great if you posted which error you get. That makes it way easier to find the issue.

9

My apologies for not quoting the error - new at this.

I am no longer getting the error, however I have substituted working code (a test without the thumbnail which was working correctly just playing the video) with the code below and I now get just a white screen with the play button. No video plays. No thumbnail. Bear with me, please, I am getting there!

<?php echo $page->featured_video()->oembed(array('thumbnail' => $page->image($page->cover()))) ?>

10

It’s been a while that I wrote this and sadly I have too little time to really maintain and support my plugins (apologies to all affected!)… But if I remember correctly, the thumbnail parameter should be the full URL. So does this work?

<?php echo $page->featured_video()->oembed(array('thumbnail' => $page->image($page->cover())->url())) ?>
1 Like
11

You have a fantastic memory! This now works and replaces the cover image perfectly.
Sadly the video will not load behind the image - if I go back and remove the lazyvideo set in the config file - i can get it to work without the cover image. Perhaps because my jquery on my site is an older version? I understand your time restraints, so I will use the plugin as is without the cover image feature. It certainly works that way so thank you.

12

Best way to figure out why lazyvideo is not working, is to check via your browsers (web) inspector

  1. If there are any javascript errors on loading as well after clicking the thumbnail/cover to start playing
  2. Check the HTML output if the video is actually embedded (usually as an iframe)
13

There is now a new version of this plugin.

1 Like