In this tutorial we're going to add an ambiant background video to the About Page

To start, we need to set up our configuration. Go to Metafield Configuration and click "Add Metafield" under page. Add the metafield listed below.

• background-video : File

As you can see, we're going to associate a single file metafield to the page. This file will contain our background video.

Your metafield configuration should look like the image below

Next, navigate to the about page within the app. To do this click on Add Metafields select page then click Search and select About Page.

Next, upload the video file that you want to show up on your About Page and click Save Changes.

Once the file has been uploaded, you can see that a code snippet was generated if you want to embed the video inta a .liquid file.

Now that you have the data set up. You can create the .liquid snippet that will display the background video. You can download the .liquid code snippet here. Be sure to include the snippet on your product.liquid template by adding this line:

Or view the snippet below: