JM.com Component Library

All of the below components can be added to the Blank template, Product template and Product Family template. These are the only approved components for use on these templates. 

JM In-Page Navigation Component

Allows you to insert a navigation bar at the top of the page that links to sections within the same page. You need to set up anchor IDs on the page and reference them in the navigation bar configuration.

Full Width Container Component

Put this on the page prior to adding components. It builds the structure of the page including page width. You can configure it with background colors and images or leave it transparent. You can also use a parallax background as shown below.

Container

Container can be used to group together other components and apply a common layout or style. Custom background image and color can also be applied.

Containers can be sized to form columns of varying widths.

Accordion Component

Accordion allows users to toggle panels of related content. You can create panels with various components.

Blog Feed Component

The blog feed component shows a list of the most recent blog posts based on tags. You can configure it to include and exclude certain details in the list and you can manually select individual articles.

Button Component

Button allows the display of a button or anchor button. Various styles are available and padding can be applied to all sides.

Carousel Component

Carousel allows a user cycle through content panels. You can create slides of varying component types.

Horizontal Carousel Component

Horizontal Carousel is a customer component that allows multiple content types. Standard, History, Step, Event and Blog feed layouts are options.

Embed Component

Embed allows a third-party widget (YouTube) to be added to a page. Media can be added from a supported URL, a pre-configured embeddable or with safe freeform HTML.

Experience Fragment

The experience fragment component allows you to embed an experience fragment into the page.

Homepage Hero Component

The hero component can be placed at the top of a page to spotlight content using a large image and subtext.

Image Component

Image allows a single image asset to be displayed on the page. Images are adaptive; the relevant image width is selected for the screen size and lazy loading is available. There are several styling formats available.

Regional Carousel Component

The regional carousel is a banner that can be added to the top of a page to spotlight content or act as a visual content type.

Separator Component

Separator displays a horizontal line on the page for dividing sections of content. Size, color and aligment are all options.

Tabs Component

Tabs allow a user to switch between panels of related content. You can create panels with various component types on individual tabs.

Teaser Component

The teaser allows the grouping of an image, title and description for promoting and linking to site content sections. One or more actions can also be defined. There are a variety of layouts and styles that can be applied.

Text Component

Text allows the display of a rich text paragraph on the page. Various formatting options are available including black, blue and white (inverse) text.

Text allows the display of a rich text paragraph on the page. Various formatting options are available.

Title Component

Title can be used to create headings for a page or page sections. When initially applied on a page, it automatically brings in title from the page properties. It can be changed to any text and you can apply any heading level to it. Only use H1 on main page headings.