C08 Link list
The Link List component displays up to eight featured links in a compact wrapper. Designed for highlighting key services or offerings, it allows users to quickly navigate to important areas of the site.
Component requirements
Component consists of a wrapper element (C09), along with individual link list items (C08).
Link list wrapper
Required:
- Title: Text field.
- Title type: Dropdown. H2/H3/H4/P. Default: P.
- Title alignment: Dropdown. Left/Center. Default: Center.
- Background theme: Dropdown. White/White smoke. Default: White.
- Number of columns: Dropdown. 1/2/3/4/C24. Default: 2.
- CTA style: Dropdown. Button/link. Default: Button.
- Column alignment: Dropdown. Left/Center. Default: Center.
- Support copy alignment: Dropdown. Left/Center. Default: Center.
- CTA alignment: Dropdown. Left/Center. Default: Center.
Optional:
-
Support copy: Rich text field. Allows users to add additional content.
-
Bottom CTA: Text field along with associated link type (internal/external/anchor/email/phone).
Link list items
Required:
- Link: Text field along with associated link type (internal/external/anchor/email/phone).
Additional component notes:
- Component allows for both, internal and external links.
- Columns respond to our grid and are responsive.
- On mobile all columns are stacked.
Content guidance
Link lists are used to highlight key services or offerings. They are used on home pages for care delivery brands to list featured services.
- Work with CMS partner to choose desired background color based on care delivery brand.
- Use at most three columns on pages with left nav or right rail. Four columns may be used on full-width pages.
- List in alphabetical order so the list appears that way on mobile.
Headlines
- Up to 40 characters.
- Specify H2 or H3 to avoid default P formatting.
Support copy (optional)
Use to add needed background or explanatory info.
CTA button copy (optional)
- Use sentence case.
- CTAs should be descriptive and clearly state what action users should take. Don’t use general phrases such as “click here” or “read more.”
- CTAs should be kept to 30 characters or fewer.
ADA requirements
- CTA's need to have a descriptive link text.
Component example
Link list example showing the component with 3 columns along with a button CTA.