Module [509] Featured Item - Tile with background color, image visible on hover - Enterprise

Module 509 is a Mid-Term Enterprise module that allows a tiled experience, with one primary tile on the left, adjacent to two stacked secondary tiles on the right.

It is typically used for the Innovation or What's New section of the page.

The typical setup is an [803] parent module, that contains links to three [509] modules. These [509] modules represent each of the tiles. The first is the larger tile on the left, which can also be a video link. The second two are the smaller tiles on the right.

Each tile can contain its own text, which is specified in the [509] module.

When hovering over each tile, a background color highlights the tile to show responsiveness.

The examples are from the innovation sections from the Rack and Tower and Networking gateway pages.
     

Parent module [803] Schema fields used:

  • Title:  Component link to Text or HTML block. The header over the three-image block.
  • Description:  Component link to Text or HTML block.  The caption under the header, over the three-image block. (optional)
  • List of Links: The three [509] modules, the large tile on the left goes first, the top on right goes second, the bottom on right goes third.
  • Attributes: "Innovation layout: Enable on 803 for 509 Child Module" (required)
  • Additional Fields: (when wanting to tie the innovation block on the page to the [835] "What's New" link)
    • Field Type: Anchor Id
    • Field Contents (text field):  The matching anchor to the [835] link, typically like 'innovation or 'whatsnew"

Tile module [509] Schema fields used:

  • Title:  This field should actually contain a component link to a LINK component.  The title of that link component is the upper portion of text displayed at the bottom of the tile. The URL of that link component is the destination when the tile is clicked.
  • Description:  Do not use. Enter the description for the tile in the Tagline field below.
  • Tagline:  Component link to Text or HTML block. The lower portion of text displayed at the bottom of the tile
  • Image: Component link to the image for the tile
  • See All link: Optional
  • Attributes:  For the modules displaying the smaller tiles on the right side: "Half Height"