Add a background image to a component

Current version: 10.1

To further enhance the design of your web pages, you can add a background image to add depth and visual interest to your overall website design.

Note

Before you can add a background image to a component, your developers must switch this functionality on. You can allow background images for components by adding a template to your component datasource. Once the functionality is added, you will see the Assign Background Image icon in the component's toolbar.

To add a background image to a component:

  1. In the component's toolbar, click Assign Background Image.

  2. In the dialog box, in the Data section, in the Background Image field, click Browse to select the image.

  3. In the Stretch Mode field, you can select the following displays for your background image: Stretch mode, Fixed Background, Parallax, Stretch, Stretch Vertically and Tile Horizontally, Tile Vertically and Tile Horizontally.

    By default,  image backgrounds will stretch to fit.

    Background image example

Video: Add a background image to a component in 10 steps

You can watch this video for a demonstration of how you can enable adding a background image to a component.

Do you have some feedback for us?

If you have suggestions for improving this article,