How to display additional fields in an Atlas In Focus Card design

Overview

There may be scenarios where you would like to display additional information on an In Focus card. Atlas In Focus cards have a number of styles which can display different OOTB Atlas columns, usually:

• Title,
• Date (Atlas Column, 'CPDate')
• Description,
• Label (Content Type, e.g. Document, Knowledge Page, Landing Page, Spotlight, etc)
• Status

However there are of course many more fields you may wish to display which are important to display on the cards itself so they're clearly visible to your users. Some examples might include:

• Created Date (SharePoint OOTB)
• Last Modified Date (SharePoint OOTB)
• Created By (SharePoint OOTB)
• Last Modified By (SharePoint OOTB)
• Grading (CPGrading)
• Information Type (Atlas Taxonomy)
• Department (Atlas Taxonomy)
• Activity (Atlas Taxonomy)
• Entity (Atlas Taxonomy)
• Location (Atlas Taxonomy)
• Subject (Atlas Taxonomy)
• Any custom columns you might create against custom content types.

If you are looking to make additional fields available to users, Atlas In Focus 'Flip Card' item style may meet your requirements. In the Flip Card design, hovering over the card will flip to show the 'back' of the card where up to 8 additional fields can be displayed. You can see an example of the front and the back of a card below. You can read more about flip cards in our article here.

However, you may decide that you only need one field to show on the front of the card for easy viewing by the users without the need to hover and flip the cards, or would prefer to use a more 'standard' card layout which doesn't flip.

In the below example, we are mapping the Departments tag to the card using the Status field (the teal-coloured squares in the top-left of the cards):

And below we are displaying the News tag (shown in white).

Guidance

There are a number of combinations to the approach you could use depending on what you want to show. For example, if you want to show a different Date Field, we would advise you replace the existing CPDate which is shown at the bottom of the card. Please note that you cannot map a non-date field into this slot as the card will show the error "Invalid date".

There are limited places on the cards which you can show an additional field, so this constraint needs to be taken into account.

Aside from the Flip Card option previously discussed, we recommend that if a non-date field is to be shown on an in focus card that you use the 'Status' field, where information from the Status column usually sits (such as Active, Expired). This is an optional field and is not configured by default, so it's easy to replace and has good positioning to be easily seen in the top-left of the card.

In the following example we will outline our recommended approach for bringing through one of Atlas's Taxonomy tags onto the card - which is the most common scenario we encounter.

Instructions 

You will need to start with an In Focus web part of some kind. The content type you are looking to use may dictate which specific In Focus web part to use e.g. Documents or News. However the instructions will be the same for all types of In Focus web part.

Edit the in-focus results web part and expand the Advanced Configuration section. You will see a dropdown option called 'Selected Properties'.

If you open this dropdown, you will see a view of a lot of available properties in your SharePoint Tenant, used for an extremely wide-range of purposes. You will see that some are selected and some are not.

If adding any of the Atlas Term sets, select the appropriate option from the below by ticking the box:

• Information Type = RefinableString122
• Activity = CPActivity
• Department = CPDepartments
• Entity = CPEntity
• Location = CPLocationGeography
• Subject = CPSubject
• News = RefinableString121 
• Events = RefinableString120 
  • Note: if you are using Events, you should map to label, not status, as the label area covers the additional event date box on the card image. See more details further down the article here
• External Insights = RefinableString126

If the above CPField or RefinableString isn't in the list of Selected Properties or you have just created a custom property, do not fear, all you need to do is paste it into the box itself, and press enter:

The input property will be selected for you. It is OK to have multiple options selected:

Now the selected property is part of the web part search behind the scenes, you can move onto the next step. Expand the Layout Section of the in focus configuration panel (edit the web part and go to Layout):

Click on the Edit Layout Slots button (note this can take a few seconds to load).

In the Slot Name column, add the additional field name you would like to use, for example, Department. Department corresponds to the Property CPDepartments which we have already entered into Selected Properties, so in the right-hand column called Slot Field select your relevant property from the list, and again, if it does not exist, then type/paste in manually and press enter for it to be pushed into the list. 

Click on Add and Save.

Now from the same web part edit panel, expand the Item Styles section and select a card style (not a list option). Please note these options will change depending on which 'Layout' you choose; Carousel, Grid or Vertical Stack:

Scroll down and click on Managed field properties:

The following screen will display:

Go to the row with the Name "Status" and edit the value:

The following screen will open:

For this example we wish to display the Department on the card so we need to swap the Status out with the Slot Name we created for Department. To do this we edit the handlebar expression and replace the word Status with Department:

Click on Save, then Save Again in the previous panel.

What we have done here is using the Status area, we have changed the field mapping so the Department is picked up instead. Almost there!

Within the Item Styles section, ensure show status is enabled as this is an optional field which is switched off by default:

The content's assigned Department tag will now display on the results card:

Considerations

This is a per web part configuration, so if you want this to display everywhere, you will need to carefully manage your workspace and page templates so the additional configuration is not needed each time and it will display by default in each new area you create.

You can also 'export' the web part configuration and re-import it to another in focus area so you only need to perform these configuration steps once which will save you time.

Of course now the Status field will not be available to use within this web part. So if you need to show Status as well, you can replace the 'Label' field in the same fashion, just altering the 'Label' option within 'Manage Field Properties' instead of 'Status'.

Here we are using the 'Label' area on the card, which usually shows the content type, instead of the Status area.

If you need to show the label, status AND this additional field, we would love to further discuss this scenario with you, so feel free to get in touch with your Atlas representative now.

Events

The card layouts for Events is slightly different as it shows the Event date on the card in the top-left. Unfortauntely this is where status also sits, so we would advise that the 'Label' area is used instead, shown in the example below. However this carries its own set of considerations, as now there is no Label field to differentiate Event Cards (except from the square date box). This is OK for dedicated Event feeds, but please consider the impact of this on users if you are showing several different content types,

Please get in touch with your Atlas representative today if you need assistance or have further questions!