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.

Image with caption (full width)

Use the image with caption (full width) component to combine visual elements with text to give context and alignment within content.

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. Add a component to your page (or the newly-added content block on your page if the optional step above is taken) by clicking the widgets Add component button.

  3. Locate the image with caption (full width) core component within the component browser and then click the select button.

    image with caption full width component select

  4. This will add the image with caption (full width) component to your page.

Configure the image with caption (full width) component

image with caption full width fields
  1. Choose an image that you have already uploaded to the CMS to display.

  2. (Optional) Enter the alternative text which provides a brief description of the image.

  3. Enter the caption that will be displayed for this image.

  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.