Page Comparison

Treating URLs as objects in LUNA can empower users to add more content to LUNA from very diverse sources. If a browser can render it, then LUNA can totoo. 

Since LUNA can support most any file type to upload as a micelanious file. We have miscellaneous file and we've enhanced LUNA 7 to treat .html files in a special way that allows them to load the content in the detail viewDetail View. This means you can add a Custom Thumbnail and catelog catalog these items just like any other item in LUNA.

Step-by-step guide

Lets start with simple video from youtubeYouTube.

...

1. In a text editor like Text Wrangler for the Mac or Notepad++ for Windows make a new file with the extension .html

2. Insert your HTML Embed code and make sure the width="100%" height="100%" this will make the content fill the detail view frame.

   Code Block
   <iframe width="100%" height="100%" src="https://www.youtube.com/embed/lJIrF4YjHfQ" frameborder="0" allowfullscreen></iframe>

3. Save your file and test it by opening it in any browser. This is how it will play back in LUNA.
4. Next, you need to make sure you have the permission to add .html content. 
   1. Open the Administrator and edit the Credential that you are using to upload content. Add html to the list of allowed file extensions. 
      
   2. Save your credential settings.

5.  Now using the Uploader add the html file.

   Info
   title Tip to adding Custom Thumbnail during Upload
   You can add a Custom Thumbnail image at the same time you upload your file if you include a jpg file with the same name. For example myVideo.html myVideo.jpg

6. d

1. That's it. You now have html files in your collection and can work with them like any other content in LUNA.

Example Files

Image Added

Image Added

Image Added

Getting Youtube and Vimeo Images for your Thumbnails 

YouTube

Youtube videos have several static images that represent it.

https://www.youtube.com/watch?v=KaOC9danxNo

By calling the video ID (KaOC9danxNo), you can grab various resolutions that are the representative of the video.

http://img.youtube.com/vi/KaOC9danxNo/maxresdefault.jpg

http://img.youtube.com/vi/KaOC9danxNo/0.jpg

Vimeo

For Vimeo it's a little bit trickier.

For this video https://vimeo.com/175266909

You can pull this xml document:

https://vimeo.com/api/v2/video/175266909.xml

Or, you can get the data returned as JSON:

https://vimeo.com/api/v2/video/175266909.json

Pulling the largest thumbnail from the XML:

<thumbnail_large>https://i.vimeocdn.com/video/582362777_640.webp</thumbnail_large>

https://i.vimeocdn.com/video/582362777_640.webp

Just changing the extension will load other formats:

https://i.vimeocdn.com/video/582362777_640.jpg

https://i.vimeocdn.com/video/582362777_640.png

Related articles

...