Upload your video to a hosting server
Prepare and upload your video to your hosting server of choice. In this case, we’ll use Shopify CDN (Content Delivery Network) as the host.
Step 1: Go to Shopify Admin > Settings > Files.
Step 2: Click on the “Upload files” button at the top right corner. If you have no uploaded files here, the button will also appear in the middle of the screen.
Step 3: Select the video to upload from your device.
Step 4: After the upload has finished, copy the URL of the video by clicking on the chain icon.
Embed the video on your page
Step 2: Search for the Liquid element to drag & drop it onto your page.
Step 3: Right-click on the Liquid element and select "Edit Code".
Step 4: Select an option to copy and paste the code into the Code Editor window.
Autoplay with navigation controls:
<video poster="" loop="" muted="" playsinline="" controls="" autoplay="" src="XXXXX" width="100%"></video>
Autoplay without navigation controls:
<video poster="" loop="" muted="" playsinline="" autoplay="" src="XXXXX" width="100%"></video>
No autoplay, no loop and with navigation controls:
<video poster="YYYYY" controls="" playsinline="" src="XXXXX" width="100%"></video>
Replace XXXXX with the URL of your video copied from the hosting server.
For the third option, since the video will not autoplay, you can set up a thumbnail image for it. To do that, replace YYYYY with the URL of your image.
Step 5: Hit “Save” and exit out of the code editor
Step 6: Hit “Save” and “Publish” to bring the video to your front page.
You also can check out this article on how to add a video to your page with GemPages:
More guides to help you master GemPages can be found here.