Everybody loves short form, mobile focused video now. And YouTube is obviously a great place to be posting your content for views and engagement.
You might decide that you want to bring your YouTube shorts onto your website. The beauty of short video is it's snappy and to the point, so you put a bunch of different videos together.
Doing that with shorts isn’t that simple though. There are a few problems:
You can fix all of that by using a specialist video embedding software like Clipara. Purposefully built for short form content.
You can create carousels, grids or embed individual videos with your own custom styling, full screen mobile experiences (just like being in an app), smooth changeovers between videos and much more. It’s incredibly simple to use too, and covers all aspect of making videos responsive across devices, autoplaying, muting etc.
With that you can easily carousels that open to a full screen player like this:
or experiences that play in line like this one:
All of this is completely customisable without any code and has lots of other layout and customisation options. The end result is something much more professional than embedding lots of YouTube shorts.
Start using Clipara for free and create video experiences that delight your customers.
Get started freeIf you do just want to grab the embed code for YouTube shorts and put it straight into your Wix site and leave it as a YouTube embed, you can do so with the quick steps below. First of all we'll cover how the shortfalls you might have already fallen into:
If you've just copied the link from YouTube and tried to use the Wix YouTube embed, you'll notice you'll get an error like so telling you to try again.
To fix this, you need to just copy the video ID (the bit after /shorts/) and paste it after https://www.youtube.com/watch?v= in the link input.
You will then end up with an embed like this:
The problem you'll notice here is that the video is landscape and has space to the sides, which isn't what you want.
To get the video vertical, a quick way is to grab the embed code from YouTube. To do that, you can right click on the shorts video and click 'Copy embed code'.
The problem you might face with this is the video is not responsive. It is a fixed size that might be larger than what you want and you can't resize it in Wix.
To make your YouTube embed code responsive so that it fills the space it is put in, you'l need to add some additional styling code. The code below is important to maintain the 9:16 dimension of a YouTube short. Other responsive embed codes will use the standard 16:9 dimensions. Simply take this and replace the video title and Youtube video ID after /embed on the YouTube URL
<style>
.video-wrapper {
position: relative;
width: 100%;
/* The padding-top percentage is calculated as (height / width) * 100% for a 9:16 ratio */
padding-top: 177.77%; /* (16/9) * 100 */
}
.video-wrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>
<div class="video-wrapper">
<iframe src="https://www.youtube.com/embed/CjO9JVlbQSM" title="Olivia Dean - felt like a fluffy dream !!! #shorts" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
You can get the video ID from the adress bar like this:
In Wix, if you then click 'Embed HTML' and paste the code, you will have a responsive embed
You can now drag the HTML embed and see that you can easily resize it to the size you need.
All in all, adding it to your site is pretty quick, but just using the YouTube embed isn't a great experience for your customers. So give Clipara a try with a free account and create a much better experience for your customers. You can create a free account here.
Here’s a step-by-step guide on how to create a custom video carousel using Clipara for free:
Step 1: Create a Campaign. Start by clicking Create Campaign on the Clipara homepage.
Step 2: Select 'On-Site' Campaign Type. Choose the on-site option to embed the carousel on your site.
Step 3: Choose the 'In-Line' Player Style. In-line plays videos directly on the page. Full-screen opens a mobile and desktop immersive player.
Step 4: Add Video. Click Upload Video to start uploading content.
Step 5: Import YouTube Shorts. Switch to YouTube, paste the link of the YouTube Short you want, and upload it. Once uploaded, you can rename the video from the YouTube URL. Once done just click Continue.
Step 6: Reorder Videos. Select all of the videos you would like to include in your carousel. Then drag and drop videos to reorder them as you like. Click Create Campaign when you're ready.
Step 7: Create a New Widget. Widgets are layouts that can be reused across campaigns.
Select Carousel for this design. This is the only layout style for In-line campaigns, but for campaigns that open to full screen, you can use grids, carousels, stories, pop-ups and create your own custom embeds.
Step 8: Customise the Carousel. Adjust your carousel to look exactly how you want using the design panel on the left-hand side.
Step 9: Install Your Carousel. Click Install on the upper left-hand side to get the embed code and paste it into your website builder. For a more in depth guide, check out our step-by-step guide on how to add a video carousel to Wix.
You’ll now have a sleek, responsive video carousel across both desktop and mobile devices.
Sign up for Clipara here and see how video carousels can elevate your website's look and performance.
Start using Clipara for free and bring your site to life without slowing it down.
Get started free
