Skip to content

Details Card

The details card is used to display information in a list layout for content such as news, pages, documents, images and videos.

Details Card

Managed Properties

    AuthorOWSUSER
    CommentCount
    Description
    DocumentLink
    FileType
    FileExtension
    GeoLocation
    LikeCount
    MDCListTitle
    MediaDuration
    ModifiedOWSDATE
    NormSiteID
    Path
    PictureHeight
    PictureWidth
    PromotedState
    owstaxIdMercuryCategory
    Title
    UniqueID
    ViewsLifeTime
    WebId

Slots

Slots are defined for each type of item returned: Page = News/Pages, Doc = Documents, Image = Images, Video = Videos.

Page & News Documents Video Image Managed Property
PageTitle DocTitle VideoTitle ImageTitle Title
PageDate DocDate VideoDate ImageDate ModifiedOWSDATE
PageUser DocUser VideoUser ImageUser AuthorOWSUSER
PageTags DocTags VideoTags ImageTags owstaxIdMercuryCategory
PageLocation DocLocation VideoLocation ImageLocation MDCListTitle
PageDescription DocDescription VideoDesciption ImageDescription Description
PageLikes DocLikes VideoLikes Image Likes LikeCount
PageComments DocComments VideoComments ImageComments CommentCount
PageViews DocViews VideoViews ImageViews ViewsLifeTime
PageGeo DocGeo VideoGeo ImageGeo GeoLocation
PageIcon DocIcon VideoIcon ImageIcon FileType

Note

Each type of Slot can be defined for each item, Title and Description are displayed by default for each item using the slot value will override the value.

Note

The Location Slot property will require a managed property to be mapped to the ows_ListTile crawled property, MDCListTitle may already be mapped.

Swapping Geo Value

When Geo is displayed on a template, the value of this may not be best represented to what the Geo location is. The value can be updated in the custom branding file using the css below:

Hides Current Value

.mercury-geo-{Geo Value}[data-geo*="{Geo Value}"] span {
  display: none;
}

Sets New Value

.mercury-geo-{Geo Value}[data-geo*="{Geo Value}"]::before {
  content: '{New Geo Value}';
}