Wix Editor: Using VideoBoxes
6 min read
Create a strong impression and pique your visitors' curiosity with visually impactful content. Showcase your own videos, free Wix videos, or professional Shutterstock videos in one of our unique VideoBoxes.
First, choose the VideoBox design that you like, add your video, and then start customizing it. You can design the shape and border of your box, add a cool overlay pattern or dynamic video mask, customize the play button and more.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/9432a2ad-f01d-4a3d-ae53-370c37e15e62/2019/07/30/5b444576-720f-4c98-90ec-2803f4241558/0aa19752-082d-407d-b115-5537201f19ad.gif)
Learn more about:
Adding a VideoBox
Start off by choosing a VideoBox design from the Add panel to add to your site. Hover over a VideoBox to see its effects in motion. Once added to your site, you can either keep the existing video or choose a different one from the Media Manager.
Show me how
Tip:
You can also add a VideoBox to your site by clicking here.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/5c3e602a-8647-41f7-bb22-686374bf97ce/2021/05/05/c45272aa-10d8-46fb-91d4-3490850537a3/929ac0c3-493f-4459-b1d0-2b1e652114d6.png)
Choosing a Video
Once you have added your VideoBox, it's time to choose your video from the Media Manager. We have tons to choose from; you can add a free Wix video, purchase a Shutterstock video, or even upload your own.
Show me how
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/5c3e602a-8647-41f7-bb22-686374bf97ce/2021/05/05/a6c89707-a1f3-4d8e-aac5-47ab82b04c67/2a79cd73-a730-429f-9c40-57a22429096f.png)
Changing the Behavior of Your VideoBox
Set how your VideoBox behaves by customizing the play, pause and loop settings as well as the sound behaviors. Play around with the options to see which you think will improve engagement and visitor interaction on your site.
Show me how
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/5c3e602a-8647-41f7-bb22-686374bf97ce/2021/05/05/8a7b9b69-e1aa-42e3-8b16-d55ccca2a822/745781cb-c4de-4ed4-8d46-ffd632193aa0.png)
Important:
Most internet browsers only allow videos to autoplay when the sound is muted. If your VideoBox is set to play automatically, the video plays without sound.
Customizing Your Play Button
If you set your video to start on click, a Play button is displayed so visitors can play and stop as they please. You can choose the play button you want from the preset designs and change its color and opacity as needed.
Show me how
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/5c3e602a-8647-41f7-bb22-686374bf97ce/2021/05/05/8bb4ee55-be0d-4e87-ba2e-8d22e4d1cd62/c27f5f05-43b8-4d2d-b81d-6a00614dfff0.png)
Designing Your VideoBox
This is where you can really make your VideoBox your own. Choose a cover image, border and shadow, and apply a pattern overlay to create a unique effect. There are many patterns to choose from to match your particular style.
Play around with the design options to see what fits your site's intent best.
Show me how
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2021/06/02/797398ee-8aaa-4e98-b6a9-0403286d14d7/90ce1a45-8f3a-40c1-9268-df11b4bc0eb2.gif)
Shaping Your VideoBox with a Mask
Using VideoBox, your video is no longer confined to the traditional rectangular format. You can apply a video mask to cut out your video into a unique shape and create an impressive visual effect.
There are thousands of shapes and vector art for you to choose from, and you can also upload your own SVG file with a custom shape.
Show me how
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2021/06/13/a26e42f4-f193-4dd5-97fc-e1a9d2f6dcc9/40c710fa-63de-44bf-8096-bbcf78b455f5.gif)
FAQs
Why is my video not playing on my live site?
I have set my video to autoplay, but there's no sound. Why?
VideoBox Inspiration
In the example below, we duplicated the VideoBox on the left and flipped it horizontally so the videos are "facing" each other. Both videos have the same mask and pattern overlay, and are set to play on hover.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2021/07/07/346c705c-6952-427a-854e-ae5271262e5f/684ba48a-330c-4f42-bb23-63b60e9f546f.gif)
Did this help?
|