Wix Editor: Customizing Your Page Background
Updated: 7 days ago
Customize your page background to reflect your individual style and create an immersive experience for your visitors. A thoughtfully selected background can set the tone for your site, making it more memorable and engaging. By using unique colors, images, or videos, you can enhance your site's background to complement your content and create a dynamic experience.
Choosing a page background color
The colors you choose for your background play an important role in how visitors perceive your site. Choose from predetermined color themes or add your own custom colors. You can change the background color per site page, or apply your chosen color to all pages in one click.
To choose a page background color:
Go to the relevant page.
Click Site Design
on the left side of the editor.
Click Page Background.
Click Color.
Select an option from your site's theme colors, or add a custom color under My colors.
Tip:
Click Apply to Other Pages at the bottom of the panel to add the background to other pages on your site.
Adding an image to your page background
Select an image background for your page to give it a sense of depth. Upload your own, add a free Wix / Unsplash image, or purchase a Shutterstock image. You can customize settings like the image's opacity, scale or positioning, and even add scroll effects (e.g. Parallax).
To add a background image:
Click Site Design
on the left side of the editor.
Click Page Background.
Click Image.
Choose what you want to do:
Upload your own image
(In the Media Manager) Click + Upload Media at the top left.
Upload an image from your computer, other Wix sites, social networks or from a URL.
Click Change Background.
(Optional) Click Apply to Other Pages to add the background to other pages of your site.
Add an image from your site files
(In the Media Manager) Click Site Files on the left.
Select the image you need for your page's background.
Click Change Background at the bottom right.
(Optional) Click Apply to Other Pages to add the background to other pages of your site.
Add an image from Wix, Unsplash or Shutterstock:
(In the Media Manager) Choose one of the following from the Explore section:
Media from Wix: Free images, illustrations, and patterns offered by WIx.
Unsplash: Free images, illustrations, and patterns available from Unsplash.
Shutterstock: Licensed images available from Shutterstock (fee varies).
Find an image you like in the following ways:
Scroll through the available selection of images.
Enter a term in the search bar (e.g. 'Coffee').
Use the filter drop-down menus to find relevant images.
Select an image and click Change Background at the bottom right.
(Optional) Click Apply to Other Pages to add the background to other pages of your site.
Tip:
Adjust the settings of your background image (e.g. scaling, position) so it fits your design and complements your content.
Adding a video to your page background
Wow your visitors and add artistic detail to your site with a video background. You can upload your own video, add a free Wix video, or purchase a professional Shutterstock video.
To add a video to your page background:
Go to the relevant page.
Click Site Design
on the left side of the editor.
Click Page Background.
Select Video.
(In the Media Manager) Choose what you want to do:
Upload your own video:
Click Upload Media.
Browse your computer and select your video.
Click Change Background.
Add a free Wix video:
Click Media from Wix.
Select a video.
Click Change Background.
Purchase a Shutterstock video:
Click Shutterstock.
Select a video.
Click Buy Video.
(Optional) Click Apply to Other Pages to add the background to other pages of your site.
Customizing the overlay of your video background
Customizing the overlay of your video background allows you to add unique patterns or colors to the video. This helps you create a visually appealing look for your site, enhancing your visitors' experience.
For example, a yoga studio website can use a calming video background with a soft color overlay to create a serene atmosphere for visitors.
To customize the overlay of your video background:
Click Site Design
on the left side of the editor.
Click Page background.
Click Settings.
In the Video Settings panel, choose whether you want to overlay a pattern or a color:
To overlay a pattern: Select one of the available patterns from the options provided.
To overlay a color: Enable the Overlay a color toggle and choose your desired color using the color picker, then set the opacity.
Tip:
To remove the overlay pattern on your video background, click the None pattern option (the icon with the red line), or disable the Overlay a color toggle.
Looking for additional design inspiration?
The Wix design hub is a great resource for ideas and website design trends.
FAQs
Click a question below to learn more.
Can I remove a page background completely?
You can change the page's background color back to white if needed.
Can I change the loop settings on my video background?
Video backgrounds are set to play in a loop by default, but you can disable this setting at any time.
Go to the relevant page.
Click Site Design
on the left side of the editor.
Click Page Background.
Click Settings
on the video background preview.
Click the Play in a loop toggle to enable or disable looping:
Enabled: The video background plays on repeat.
Disabled: The video background plays once, when it first loads.
Do video backgrounds have sound?
Video backgrounds play without sound. If you want to display a video with sound, we recommend that you use a different element, such as Wix Video, Pro Gallery or the video player.
My video take a few seconds to start playing, is this normal?
Yes. Large or high quality video files may take a few seconds to begin playing, and may lead to an increase in your site's loading time.
I just uploaded a video but I'm not seeing it on my site. Why?
Videos take a few moments to upload regardless of your internet connection speed. As your video is processed, the file is being transcoded, meaning converted and resized, to play in the highest quality on any screen. Processing time may increase for especially long or high quality video uploads.
Your video won't appear on your site until the uploading process is complete. For best results, check out the video file guidelines.
How do video backgrounds work on my mobile site?
Your video background will automatically be set to not play on the mobile version of your site. To enable it, or select another video background, reselect the video in the mobile editor.
What aspect ratios can I use on video backgrounds?
We do our best to accommodate any aspect ratio that you upload for background videos. However, there is no guarantee that your video will look correct or play properly if you upload a particularly unusual aspect ratio, such as 19:321.
Can I use my own pattern for the overlay?
Currently, you can only select from the predefined patterns provided in the Wix Editor.
Does the overlay affect the video playback on mobile devices?
The overlay is not displayed on your mobile site.
It's important to note that your video background is automatically set not play on the mobile version of your site. To enable it or select another video background, go to the mobile editor and reselect the video for the page background. Learn how.
This article is credited to the Wix team - https://support.wix.com/ and we thank them for that!
Comments