This section describes how to add a fullscreen background video. The steps described below are valid for both the homepage and projects.
Background videos are created using the [epicslider_background_video] shortcode which is entered into the caption field in the media uploader. For example:
[epicslider_background_video id="fs1" mp4_src="http://yourdomain/yourvideo.mp4"
IMPORTANT: You must set a unique id and include three versions of the video you want to display to ensure cross browser compatibility.
The full width slider uses html5 video and to ensure cross browser compatibility you will need to include the following file formats for your video:
There are a bunch of free video converters that will allow you to convert your video to the required formats, one such converter is Easy HTML5 Video Converter (http://easyhtml5video.com/).
File Format Broswer Support
|IE 9 and 10||YES||NO||NO|
Click ‘Add Media’ .
Click ‘Upload Files’ then ‘Select Files’ and select one or more images that will serve as poster images for the fullscreen background video.
Go through each image and add the epicslider background video shortcode to the caption fields and make sure that ‘Display Opt.’ is set to ‘Display in Featured Slider’ as shown below.
NOTE: If only one image is set to ‘Display in Featured Slider’ the slider controls will be hidden and the slider will display a single slide. If more than one image is set to ‘Display in Featured Slider’ the slider and controls will be activated and serve as a regular slider. As with a regular full width slide you can add captions. For caption styles and examples click here. Once done, close the modal.
Scroll down to the bottom of the editor and set page layout to ‘Full Width Featured Media’.
Click Publish. Repeat Step 1. to Step 5. to add additional slides.