Guidelines for AEM Components
Explore a library of components designed to create impactful marketing pages.
Tiles Module
The versatile Tiles Component enables the expansion of benefits or features, enhancing clarity and comprehension of a product or service.
Settings
Configuration
Headline
- Enter text for the introduction headline.
- It is optional.
Headline Level
- Select the element level for the headline.
- None
- H1
- H2
- H3
- H4
- H5
- H6
Description
- Enter an introduction description.
- It is optional.
Background Gradient
We can select the background gradient from the dropdown list for the items.
- None
- Blue
- Blue to Cyan
- Blue to Green
- Cyan to Pink
- Violet to Orange
- Gray
Tile Styles
Select the style for the tiles.
- Text Only
- Logos
- Dimension of the tile image :- 300 x 160.
- Image format is PNG.
- Icons
- Dimension of the tile image :- 74 x 74.
- Image format is SVG.
Note:-
- If we select the tile style as Logos then the tile item headline and body text will not visible on page only logo will be visible.
Layout
Display Layout
- Select the number of columns for the display layout.
- Three Columns
- Four Columns
- Five Columns (Logos Style Only)
- Six Columns (Logos Style Only)
- Seven Columns (Logos Style Only)
- Eight Columns (Logos Style Only)
Truncation Feature
Show Message
- Text rendered as “show more” link for hidden content if there are many contents on tile module.
- This "show more" text will not visible on desktop view. It will visible on lower resolution devices like mobile,Ipad.
Max Items
- It will help us to show how many items to display when content is truncated.
- It will accept only number.
Footnote
- Note displayed at the bottom of the module across the full width.
Meta
- Add an ID to the component to allow #hash linking.
- It is optional.
Yes or No styles
- No Gap ?
- Removes the bottom margin separating modules.
- Top Gap?
- Adds a gap to the top of the component separating it from the top of the page or a prior component.
- Centered Headline ?
- Renders the intro headline centered instead of left-justified.
- Light Text ?
- Renders all text as white for legibility when displayed over dark backgrounds.
- Full Width Background ?
- Alters padding to properly render colored backgrounds.
Tile Item Component
Tile Text
- Headline
- Headline displayed for each tile block.
- Headline Level
- User can select the headline level from h1-h6 for headline.
- Headline Body
- Body text of the tile block.
Tile Image
- Add an image to the tile.
- We can add image to the tile block.
- For Icon we can use 74 x 74 dimension and image format is SVG.
- For Logos we can use 300 x 160 dimension and image format is PNG.
- Alt Text
- Alternate text for SEO and accessibility describing the image.
Tile Link
Link
- Select or enter a link for the tile.
- We can open the link on new tab of the browser by enabling the "New Tab " option.
Link Title
- If the HREF is provided, a link title is also required.
Examples
Example 1 - Text Only ( Tile Style)
Product Features
Multi-Carrier Support
Compare rates, create labels, and track shipments using a unified API that covers an extensive carrier network.
Access to PitneyShip™ shipping software
Print USPS shipping labels, track shipments, get cost accounting data and save even more with access to PitneyShip®, our online shipping software.
Customization
Add your own negotiated carrier rates or use our pre-negotiated discounts to drive competitive shipping costs.
Address verification
Reduce costly address correction fees and improve your delivery success rate.
Address verification
Reduce costly address correction fees and improve your delivery success rate.
Address verification
Reduce costly address correction fees and improve your delivery success rate.
Example 2 - Logos Style ( Tile Style)
This setting allows to showcase logos of clients, partners, or brands. This is an alternative to the Logos Component: https://www.pitneybowes.com/us/template/logos_components.html