Modules

[506] Featured Item – Title with Background Image

This module was designed for (but not limited to) gateway pages. It is used to present various sections within the business unit as tiles with links to the corresponding family pages.

This module features items such as a notebook or a capability of the product or service. An image is displayed as background for a title and description. Optionally, the module may have a see all link.

Schema fields used:

Title (supports 'Text or HTML Block'; optional)
Description (supports 'Text or HTML Block'; optional)
Image (supports 'Image'; height and width as mentioned in the image metadata; recommended sizes are 100% wide = 1000px, 50% = 500px, 33% = 334px)
List of links (supports 'External Link'; all treatments supported)
See all Link (supports 'External Link'; all treatments supported)
Additional fields: Gradient Image (loaded separately from the module image as a 1px wide graphic with the desired height of the module)
(Module) Attributes:
- Title Header Size: h2 (font size 24px)
- Title Header Size: h3 (default behavior; font size 20px)
- Image Effect: Remove Border around Module
- Image Effect: Show Image as Full Background. This attribute is recommended for life style imagery used as module background. The background image adjusts from the right (left margin fixed) in order to fit the cell set width when > 1000px, and fits the entire page width when < 800px (single column view). To avoid distortion, the recommendation is to use 800px wide images when applying this attribute
- Placement: Right of Text. When applied on this particular module in addition to "Show image as full background", it adjusts the image from the left (right margin fixed).

Note: A helpful attribute when working with 506 is available at the ROW level: Row Effects - Remove Spacing Between Cells in Row, which will remove the spacing between the cells used on the same row.

Main variations of module [506]:

Example of responsive optimized setup

Title/Header component [506]

Variation contains a single [506] as follows: Title, Description (this descriptive text), Links in a list, CTA, Image (shown as background), Attributes: Title Header Size H2

This is a CTA