How to Create Self-Hosted Videos

11/02/2016

Aside from images and text, videos are a great way to showcase content on your website. With Avada’s premium sliders such as the Fusion Slider, Revolution Slider, and Layer Slider, you have the option to upload videos from Youtube, Vimeo and even Self-Hosted videos. Self hosted videos require a few steps to create and a few file formats per video.This step by step article below will cover the various file formats of self hosted videos, how to make the two required file formats, areas of Avada that can use the videos, and how to use the videos in those areas.

IMPORTANT NOTE – The ability the set a video as a background of a full-width container is only available in Avada version 3.7 or higher.

A Self Hosted Video Consists of 4 File Formats

  • .MP4 – A required file format for uploading Self-Hosted videos. This file works for all browsers except for Firefox.
  • .WEBM – A required file format for uploading Self-Hosted videos. This file is specifically for Firefox browser
  • .OGV – An optional file format for uploading Self-Hosted videos.
  • Video Preview Image – The image that will be seen in place of your video on older browsers or mobile devices.

The Only Required Formats Are MP4 and WEBM

Self hosted videos require two file formats to display correctly in all browsers. MP4 is used for all major browsers except for Firefox, which uses the WEBM format. With these two formats, your video will display correctly in all major browsers. These steps below assume that you already have a video to use. Videos come in many different formats, so the idea is that you need to convert your current video format to MP4 and WEBM files, which can then be uploaded and used on your website.

How To Create A MP4 File

Step 1 – After creating your video, make sure to save it in .MP4 format. The video must also be in 16:9 Aspect Ratio.

Step 2 – If you are unable to save your video in .MP4 format, you must convert it to .MP4 format via a 3rd party software, like Handbrake. Please see the links below for information on how to do this.

View Handbrake documentation.

How To Create A WEBM File

Step 1 – Once you have a video in .MP4 format, you can now convert it to .WEBM format. You can do this with Firefogg. Firefogg only works in Firefox.

Step 2 – If you choose to use Firefogg, you can simply upload your .MP4 video and it will automatically convert it to .WEBM format.

IMPORTANT NOTE – Self hosted videos can be very large in size, which is not good for a website. Conversion tools like Handbrake and Firefogg will drastically reduce file size. Handbrake and Firefogg are 3rd party applications and are not affiliated with ThemeFusion.

Areas You Can Use Self-Hosted Videos

  • Fusion Slider – Using the Fusion Slider, you can insert Self-Hosted videos into your slides.
  • Full Width Container – Using the Full Width Container, you can set a Self-Hosted video as the background.
  • Layer Slider – Using the Layer Slider, you can insert Self-Hosted videos into your slides.
  • Revolution Slider – Using the Revolution Slider, you can insert Self-Hosted videos into your slides.
IMPORTANT NOTE – Each areas have slightly different ways to add them. However, all of them require the same files.

How To Use The MP4 And WEBM Files

Once you have your video in .MP4 and .WEBM formats, you’re now ready to upload them.

Step 1 – Choose the area of the site you want to use Self-Hosted videos. Each area described above has slightly different upload methods, but all require the same files.

Step 2 –  In your chosen area, simply upload the correct file format to the correct field. For example, upload the .MP4 file format to the .MP4 Upload field. There will be a field for each required file format.

Step 3 – If there is just a simple text field with no video uploader button, like in Full Width Containers, you will need to upload the files to the Media Section then copy the URL.

Step 4 – If your media files are too big to upload through the Media Manager, you will need to upload them to your server via FTP.


16 Likes
Proudly Serving Over 260000 Satisfied Users!