The information on this page relates to beta testing within the DXP

This documentation includes information for selected beta testers within the DXP. DO NOT use this unless you have been instructed to do so.

Features with images

Use the features with images component to highlight the most important features of your product or service.

Add the component to your page

When you are editing your page using page-builder:

  1. Add a component to your page by clicking the widgets Add component button or by adding a content block (by clicking the add_circle button) then clicking the add component button.

  2. Locate the features with images Squiz core component within the component browser and then click the Select button.

    features with images component select

  3. This will add the features with images component to your page.

Configure the features component

features with images fields
  1. The add_circle Add button allows you to add additional items to your list of features. When the component loads you will have an unpopulated item that you can fill in (see Feature configuration).

  2. This setting defines the maximum number of features that will be displayed in a row when viewing your page in a desktop browser.

  3. This allows you to choose the heading level for the feature items.

  4. (Optional) This allows you to add a unique ID into the HTML markup to the instance of the component so that you can add custom styling and functionality using CSS and javascript respectively.

  5. (Optional) This allows you to add a class into the HTML markup to the instance of the component so that you can add custom styling and functionality using CSS and javascript respectively.

Feature configuration

The following options can be used to configure each feature:

features with images feature fields
  1. Enter the feature’s title.

  2. (Optional) Enter the description that will be displayed for this feature item.

  3. (Optional) Choose an image that you have already uploaded to the CMS to display.

  4. This specifies if you are linking to another page in the CMS or an external, user-specified link. Depending on what link type you select you will see a combination of the following fields.

    Link type

    Depending on the link type selected, you will see two or three fields to specify your link.

    Matrix asset

    Displayed for Matrix asset picker links. It allows you to choose the CMS page that your feature links to.

    Text

    This is displayed for user-specified links. It defines the link text.

    URL

    This is displayed for user-specified links. It defines the link URL.

    Open link

    Controls how the link is opened when you click on the link.