I’m breaking down three ways you can add video to your Showit website. First, we’ll talk about adding a video to your canvas background to play on its own or underneath text. Next, we’ll chat about adding video to your mobile site on Showit. We’ll discuss a workaround to the bummer that Showit doesn’t support video as a canvas background on mobile. Then lastly, we’ll cover how to embed a video with sound from Vimeo or Youtube. Not only that, but we’ll discuss how we can make the video hidden at first, then open up in a full screen window when clicked.
For when you want a video without sound playing in the background of a canvas.
1. Make sure your video is saved as an .mp4.
2. Compress your video to 8mb or smaller. I use this site to compress videos. Make sure you adjust the settings to target a file size of 8mb or less.
3. Once you’ve downloaded your compressed video, it’s time to upload it to Showit. With your canvas selected, click “Canvas Background” and select “Video” from the dropdown menu. Click “Choose Video” and upload the video you compressed. Once it has uploaded into your media library, you may select it to place it into the canvas background.
For when you want video without sound to play on the mobile version of your website.
1. Trim your video to a 20-30 second snippet.
2. Upload your video to a gif creator. I use this site to create gifs.
3. Once you’ve downloaded your gif, it’s time to add it in Showit. Upload the gif to your media library then add it to the page.
For when you want to showcase a full video with sound on your Showit website.
1. Upload your video to Youtube or Vimeo. Copy the link of the video.
2. Return to Showit and from the bottom of the builder, hover over the center option and select “Video”.
3. Under the top right “Video” tab, select either Youtube or Vimeo from the dropdown and paste your video’s link.
If you’d like to have the video hidden, then open in a full screen when clicked, watch the video below to see how to do that!
Your first step to a website you deserve. Download now and let us walk you through the baby steps (yes even the scary techy stuff!).
Pre-Website Homework Roadmap for Stylists
Other Free Resources