Brands Grid
Layout Variant: C019
Content Type: Collection
| Teaser Title | Teaser Text | Pictures and Media | Items | CTAs |
C019 Collection | Yes | No | No | Yes | Yes |
Added Teaser(s) | Yes | Yes | Yes | No | Yes |
Aspect Ratio:
- Image from teased item: 2:1
Expected Use:
The Brands Grid lists Emerson brands in a given platform or category. Each brand includes a short description of its mission within the Emerson family. The list should be presented in alphabetical order. This component is meant for top level business home pages only. Any other use case should be approved by your platform governance.
Building the Component:
The only field that requires text in the collection is the Teaser Title. This appears at the top left of the component. You will need to set the Layout Variant to C019.
Any number of brands can be displayed based on the context of where the component is used. However, the Brands Grid (C019) requires a minimum of 4 brands per design requirements. The grid will not render until the minimum has been added to the Items List. Your Component should contain the following:
- Teaser Title - The main headline on the component.
- Teaser Text - The body copy of your component. This is not used in this component.
- Pictures and Other Media - There is no image associated with this component. Images and Other Media like Pages are located on each Teaser added to the Items List.
- Items - Add four or more Teasers to the Items List of C019. See instructions below.
- CTA Label - Set the CTA Label to "View All Brands" and link the Call-to-Action Button to the "Brands Directory" Page by using the "Use Linked Call-to-Action Label" CTA Button and adding your Page.
Creating Teasers for the Items List:
When hovered over, the teaser will show Teaser Tile, Teaser Text and CTA. The CTA uses the default label "Learn More" and drives to the Teaser Target Page. Each Teaser you add needs the following fields:
- Teaser Target - This is the teasable content you are showing in the CTA. The "Learn More" bundle label is the default CTA. Note: In alternate use cases when used for other purpose such as simply showcasing content with images, you can exclude a target and the text will fill the entire width of the component.
- Teaser Title - headline
- Teaser Text - description. There is no limit to the length of your description. The box will flex to expand to the size of your content.
- Teaser CTA Label - Not Used. CTA defaults to "Learn More" bundle label
- Pictures and Other Media - a Picture of the brand name or logo.
- Call-to-Action-Button - this functionality is not configured for this component and will not work.
Bundle Entries:
This component uses a CTA label that needs translated content. These can be found in one of the Bundle files which are most easily accessed on the Localization tab of the Homepage.
- button_read_more - shows the default CTA label as "Learn More" if no CTA Label is set.