Add a background to a custom page – Help Center

Before You Begin

The "Backgrounds" feature in the Website module brings a dynamic, modern look to your website.

It lets you add visual elements as backgrounds behind your blocks (text blocks, image blocks, contact forms, etc.), as shown in the example below:

You can add different types of backgrounds:

Color backgrounds
Image backgrounds (with or without a parallax effect)

The parallax effect means that the background image scrolls more slowly than the rest of the page, creating an illusion of depth.

This article explains how these backgrounds work:

How it works
Background settings

How It Works

Backgrounds can only be used on custom-edited pages, not on pages automatically generated by the platform.

To add a background, open the editor for one of your pages and click Backgrounds in the toolbar on the left side of your page.

You can then select a background and apply it to your page.

Background Settings

Height Settings

Backgrounds are designed to sit behind existing blocks. Their height is fully flexible — you can resize them however you like.

That said, we recommend matching the background height to the image you want to use. If the image is taller than the background area, it will be cropped.

Width Settings

Backgrounds always span the full width of the page — you cannot limit a background to half the page, for example.

However, you can choose whether your backgrounds have a fixed or full width. This setting is available on the theme settings page, accessible via Website > General by clicking the Edit Theme button.

If you choose full width, your page will look like this:

The image width adapts to your screen size.

If you choose a fixed width, your page will look like this:
Images have a fixed width of 1,131 pixels.

Color Background Settings

Here's how to add a color background to your page:

For each color background, you can choose any color you like.

For better readability, make sure there is enough contrast between your text or other elements and the background color.

Image Background Settings

Here's how to add an image background to your page:

Image backgrounds come with two additional settings: a color filter and a parallax effect.

The color filter is set to 30% by default and cannot be changed.

The parallax effect is a dynamic effect that creates a sense of movement for visitors browsing your page.

The parallax effect is not visible in the editor — the image stays static. To preview it, switch to the visitor view.

You're now all set to build a stunning page — go ahead and give it a try!