Skip to main content

Adding a video background to a Title Page

Updated

You can now add a short video clip (maximum 15MB file size) to the background of one new Title Page template, and set to loop!

The video file does not need to be hosted by YouTube or Vimeo, you can directly upload from your device or from Dropbox.

The audio component of any background video will not be included as many browsers will not play video automatically with audio included.

The limit of 15MB has been set to ensure that the video loads quickly across all devices and network times (WIFI, Cellular data etc.)

Only .mp4 or .mov files can be uploaded.

See our guide here for ideas on trimming video that is too large or not optimized.

Select a Video background Title Page template

There are two Title Page templates that you can add your video background to

  1. Create a Custom Page > Title Page (see our guide here if you haven't made a Custom Page before)

  2. Select the second template from top-left with the video thumbnail playing or

  3. Another video template with Title, Description and an Entry Button!

Video Title Page editor overview

  1. Notification of video background

  2. Click the background to bring up options 3 & 4.

  3. Add Background Video

  4. Customize Design settings

  5. Text link that needs to be set to link into a page

  6. Unconnected Links warning displayed

  7. Save Changes

Upload video file

  1. Drag & Drop a video file 15MB or under or click 'Upload Video'

  2. Import from Dropbox

  3. Reminder that video file must be 15MB or under and .mp4 or .mov file type

Video upload progress

  1. Video filename

  2. Uploading size and status

  3. Progress and time remaining indicator

Save Changes Warning

  1. Save Changes without linking shows Warning

  2. 'Go Back and Connect Links', recommended

  3. 'Save without Links' not recommended!

Select and edit text

  1. Replace text with your own and select all text

  2. Click 'Link'

Create Link to Page

  1. Select 'Page'

  2. Use 'Choose a page' dropdown

  3. Select Page

Save Changes

The orange warning panel at the bottom will no longer appear

  1. Link has been set

  2. Save Changes

Customize Design

  1. Click 'Customize Design'

Customize Title Page panel

Changes made to are specific to this Title Page (you can have multiple Title Pages within a Format site used for different purposes.

  1. Changes that you make in the left panel are reflected in the in-app preview

Preview in Live Site

View your live site across a range of devices and screen sizes to ensure you are happy with the way video is displaying.

Make any changes you feel necessary.

Auto-Play not Auto-Playing?

If a web browser's preferences have been set to disable the auto-playing of videos (Never Auto-Play) then the video will not auto-play and will appear as a fixed image.

The default 'Stop Media with Sound' would still allow the video to play.

Each browsers settings may be different but the screenshot below is for macOS Safari.

  1. macOS Safari > Preferences > Websites tab

  2. Click 'Auto-Play

  3. When visiting other websites, select 'Allow All Auto-Play'

Also, try testing in another browser or device if you are not seeing the video auto-play.

Reach us at our live chat or via our email info@format.com if you have any more questions. We’re happy to help!

Related to

Related articles