Studio Editor: Adding and Customizing Videos
7 min read
In this article
- Adding a video
- Customizing a single video player
- Customizing a VideoBox
- Troubleshooting videos
Videos are a great way to engage site visitors and tell them the brand story. The Studio Editor makes it easy to showcase your content, embed from social media and add stunning video-based design elements.
Adding a video
Choose the right video element for your needs. You can add a single video player or a VideoBox, which offers more elaborate customization options. You can also add videos with transparent backgrounds, designed by Wix, to decorate the site.
To add a new video:
- Click Add Elements
on the left side of the editor.
- Click Media.
- Select a video type under Video:
- Single Video Players: Upload your own video or embed one from a social network.
- VideoBox: Showcase your own videos, free Wix videos, or professional Shutterstock videos in beautifully designed video containers.
- Transparent Video: Add or upload your own videos with transparent backgrounds.
- Drag a video to the desired location on the page.
![A screenshot of the Add Elements panel, showing the different video elements you can add](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/06/eec04898-6a7a-45b2-a0d8-d2fac38c9875/cfda4afc-ca17-4db8-85bc-3d5e465e6bde.png)
Customizing a single video player
Customize the Single Video Player's layout, design and behavior to your specific needs. You can choose whether your video starts playing automatically and / or in a loop, decide which controls to show and design them as well.
To customize a single video player:
- Select the video player.
- Choose how to customize it:
Change the video
Decide how your video plays
Adjust the video player's layout
Design the video player
![A screenshot of a single video player with its Settings panel, and the Inspector panel, open](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/06/7be3a589-fae8-4007-83f1-b924fd1870f5/98cc6d19-1c46-428f-8b84-9eeecc6ae365.png)
Customizing a VideoBox
When using VideoBoxes to display media, you get a lot of creative liberty to make them part of the design. Set the video to play exactly how it should, choose an interesting shape for it and design every detail - from the cover image to the borders.
To customize a VideoBox:
- Select the VideoBox.
- Choose how to customize it:
Set your VideoBox behaviors
Choose the focal point
Design the VideoBox
Add a video mask
![A screenshot of a VideoBox with the Inspector panel and the Behaviors panel open](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/06/206add22-9474-4c36-9916-43467a5bd72d/2ef35d0c-a24f-4680-96fa-46e72c821928.png)
Troubleshooting videos
Having issues with your video? Click a question below to learn more:
Why is my video not playing on my live site?
I have set my video to autoplay, but there's no sound. Why?