Component overview
Inline Links shows a list of links in an easy-to-read two-column layout. This component should be used to format large amounts of links for display.
- There are two versions of the Inline Link component. Advanced Inline Links, which offer the ability to dynamically link to the catalog, and Inline Links.
- Advanced Inline Links house Inline Link Items: Inline Link Items create the link list at the bottom of an Advanced Inline Link component. Inline Link Items have two types:
- Catalog Item: This section dynamically generate up-to-date catalog links. You must enter the exact name of the catalog page you are linking to in the Catalog Object Name section but you can override this with custom anchor text in the Link Text section below. Finally, select the type of catalog page you are linking to (program, for a degree program, or page, for other sections of the catalog).
- Standard Link: Use this section for a standard internal, external or document link.
- Inline Links and Advanced Inline Links can be used on all page schemas: Inline Links can be used on Section Fronts, Section Detail, Profile Detail and Degree Detail pages.
- Links remain left-aligned: Although you may adjust the positioning of the component's title and body copy, you cannot adjust the layout of the links in the component.
- Links can be displayed horizontally or vertically. Links will default to a horizontal layout but you can override and select a vertical display.
- Consider how many links you use: Links are arranged in columns. Review how your links appear prior to publishing. Too many links can be overwhelming for users - make sure your links provide clear value.
- Organize your links: Your links will appear in the list in the order you place them. If not alphabetical, make sure there is a clear organization to your links.
- No background color. The Inline Links component does not allow for a background color.
- Select a proper H- or P-tag for your Inline Links: Be sure to select a proper H-tag for the position of your Inline Links on the page to ensure you do not skip H-tag levels and adhere to our accessibility and on-page optimization guidelines .
- Inline Links anchor text (links) must be unique: Each anchor text must be unique to that link to ensure you do not create a multiple destination link accessibility error.
- Inline Links require a group heading: This field is for screenreaders only and is not shown on the page. Each Inline Link component requires a unique group heading describing the nature of the links grouped in that component.
- Inline Links require manual review in SiteImprove: You will need to review and approve your group heading in SiteImprove to confirm it accurately describes the links in the group.
INLINE: UNIT NAME - Purpose
- Example: INLINE: CLA - Student Resources
ADVINLINE: UNIT NAME - Purpose
- Example: ADVINLINE: CLA - Student Resources
INLINEITEM: UNIT NAME - Purpose
- Example: INLINE: CLA - Academic Advising link
Example Inline Links components
Example #1
Inline Links, with body copy and 12 links
Tuition and financial aid resources
The Office of Financial Aid and the Cashier's Office are the central resources for resources regarding student fees and tuition, loans and financial aid packages, scholarships, making payments and more.
Example #2
Inline Links, with no body copy, 6 links, and vertical layout
Tuition and financial aid resources
Related links about tuition and financial aid
Advanced Inline links with catalog links
The first two links below use the Inline Link Item component to generate dynamic links to the course catalog.
Related links for academic resources