Custom Hover Card (Column)

Last modified on November 15, 2023

Niket Jain

A custom card is shown on hover of an item. The hover card shows additional details about an item's status.

View on GitHub

LIST SAMPLE TYPE: Column

SHAREPOINT COMPATIBILITY: SharePoint Online

SAMPLE CATEGORIES: Icons, Hover Cards

LIST COLUMN TYPE: General

FORMATTING TOKENS:

FORMATTING OPERATORS:

FORMATTING ACTIONS:

FORMATTING FEATURES: customCardProps, directionalHint

CLASSES: ms-fontColor-black, ms-fontColor-green, ms-borderColor-neutralSecondaryAlt, ms-fontColor-neutralSecondaryAlt

References

Use column formatting to customize SharePoint

You can use column formatting to customize how fields in SharePoint lists and libraries are displayed. To do this, you construct a JSON object that describes the elements that are displayed when a field is included in a list view, and the styles to be applied to those elements. The column formatting does not change the data in the list item or file; it only changes how it’s displayed to users who browse the list.