Self hosted video in a source project

[Bazza]

I’m using Source and maintain a charity website. I’d like to insert a self hosted video (it’s only 3.5 mb) into a content stack. Can anyone suggest the best way to do this?

Thanks in advance.

[Gianluca]

SectionPro

SectionsPro video on touch devices

https://www.bigwhiteduck.com/stacks/sectionspro/

[Gianluca]

Source background video

Background videos in Source

I’ve just put together a new example for those that might want to do this purely in Source. It is a fairly simple thing to do with a couple of Coder stacks and just a little code. Here is a published example and here is the project file. (Have also add this to the Source Knowledge Base)

[Bazza]

Thank you so much!

[Gort]

You can just use HTML5 video. All browsers support it, and will automatically provide a movie player. Just create an HTML stack, and add code such as this:

<video controls controlslist="nodownload" preload="none" poster="https://yourpicture.jpg" src="https://yourmovie.mp4">
</video>

Just pop in the links to your self-hosted poster image and movie. Done. Very easy.

[LiveShots]

I think with the latest iPhone IOS you may need to add playsinline to the VIDEO tag

[Gort]

I had not heard about playsinline, but I will definitely look into it. However, I have the latest iPhone IOS installed, and my videos play fine without it. This page of my site has many HTML5 videos for instance…

Digital Time-Lapse Videos

[Gort]

Okay, I checked out and tested playsinline. Basically it does what it sounds like- plays the movie right on the web page. Otherwise the default is to play the movie as a lightbox. Interesting. I’m not sure which one I like better, but it is nice to have the option.