This is a reference list of the standardized classes we recommend using whenever possible. You can always view the source or inspect specific elements to determine all available class names, but the classes listed on this page will not change as CONTENTdm is updated in the future.
You can always view the source or inspect specific elements to determine all available class names, but what follows is a summary of the standardized classes that we recommend you use whenever possible.
Note: Refer to JavaScript and CSS examples for additional customization.
Website-level classes exist on every page.
| Page Class | Description |
|---|---|
.cdm-header |
Website header. |
.cdm-footer |
Website footer. |
.cdm-main-content |
The main content of the page. |
Component-level classes correspond to portions of pages.
| Page Class | Description |
|---|---|
.cdm-content-header |
The upper section of the main content of a page (for the home page: above the collection card UI; for the search page: the sort and results count UI). |
.cdm-collection-card |
The collection cards on the home page. |
.cdm-item-card |
The item cards on the search results page. |
Global page classes exist only on the specified page.
| Page Class | Description |
|---|---|
.cdm-home-page |
General class for the home page. |
.cdm-about-page |
General class for the about page. |
.cdm-login-page |
General class for the login page. |
.cdm-search-page |
General class for the search page. |
.cdm-notfound-page |
General class for the not found page. |
.cdm-advanced-search-page |
General class for advanced search. |
.cdm-custom-page |
Class for the custom pages. |
| Page Class | Description |
|---|---|
.cdm-collection-page |
General class for all collection- level pages (collection landing page, collection search, item pages). |
.cdm-collection-landing-page |
General class for the collection landing page. |
.cdm-collection-search-page |
General class for the collection search page. |
.cdm-item-page |
General class for the item page (item pages always have collection-level context). |
The cdm-collection-pageclass is present on all collection-level pages. This means any page below the URL /digital/collection/ will contain that general class. Additionally, on the collection page, there will always be a collection-specific class that includes the collection alias of the collection in question. By combining the generic collection-level classes with the collection-specific collection-level classes, you can target your CSS styling very precisely.