Each component includes a numerical ID and a prefix abbreviation associated with it. An explanation for each component type is included below. Please note, some of the components in OSG are shared only for the purposes of illustrating the design pattern and guidelines though they may not be available as “layout variants” in CoreMedia.
A broad range of components that typically contain richer content experiences but also, like visual navigation, pass users to another page.
C001, C002, C004–C007, C009–C019, C025–C031, C033–C040, C043–C048, C052–C055, C057, C059, C061–C086
Typically used underneath the hero to explain a topic, with promo boxes to the right or left of the copy.
P001–P007
Components used to build fields within forms.
F001–F003
A component used to share to or promote social channels.
S001, S002
Components focused around global header & footer navigation, site search functionality and account authentication.
G001–G025
A component that includes search-related behaviors.
SE003–SE009
The main section at the top of the web page below the nav. This component should also contain the <h1> tag for the page indicating the page’s title.
H001–H004, H008–H010
Tiles with teaser content that introduce another page.
VN001–VN004, VN009, VN013–VN020
Not available as components to CoreMedia authors.
Not available as components to CoreMedia authors.
An “Active” status label indicates that the associated component has been designed, developed, approved for use by the business, and is available to content authors in CoreMedia.
A “Pending” status label indicates that the associated component has been designed and handed-off, but is pending development or completion before it becomes available to content editors in CoreMedia.
A “Deprecated” status label indicates that the associated component is no longer approved for use on the website, and may have been removed from the CoreMedia platform.
A “Superseded” status label indicates that either a) the associated component either has a newer iteration available for use (e.g., “C0##-B” version), or b) a separate, new component has been introduced to handle the content type or use case previously addressed by this component. Please note that these these components are still available for use. At the bottom of a component’s details page, refer to the Usage Guidelines for more information and available alternative options.