Follow

Webpart: Details Card

Article published on the 16th of September, 2021.

1. Introduction

The Details Card webpart can be used to display a parts of, or the entire top panel.

It can e.g. be used to display the stage band from the top panel as an element on a project site page, or a company's meta data on the page itself.

This can help usability, as users will not need to click to open the top panel to view information such as meta data or stage information.

2. Requirements

The Details Card webpart is included in the Basic, Business, and Enterprise WorkPoint licenses.

3. Configuration

The Details Card can be inserted into site pages like other webparts:

  1. When editing a site page, click the "Add a new webpart" button.
  2. Search for "details card" and click the "WorkPoint 365 - Details Card" webpart to add it to the site page.

By default, we webpart shows the entire top panel, including all configured tabs, and the stage overview section, as shown in the following image:

  1. We can click the pen icon to edit settings of the webpart.

This opens the webpart settings side panel:

Construction of office building for Ramto A/S - Home-SmallProjects - Google Chrome
  1. We can add a title to the top of the webpart.
  2. If you want to control how much vertical space the webpart is allows to use, you can input a number for the webpart height in pixels. If this is left blank, the webpart height will fit to the content it displays. If you specify a number too low for the webpart to display all it's contents, a scroll bar will appear in the right side of the webpart.
  3. You can select which parts of the top panel you wish to show in the webpart.
    • Tabs only: Using this option, only tabs such as "Entity Details" or "Journal" will be displayed in the webpart.
    • Stage band only: Using this option, only the stage band will be shown in the webpart.
    • Both: Using this option, both the entity details tabs and the stage band will be shown in the webpart.

The following image illustrates a case where a title is set, a height for the webpart is set, and the "Tabs only" selection being active:

Note that the contents of the "Entity Details" tab (both default and custom ones) are dependent on your entity presentation settings. It is e.g. possible to display entity details using a default layout, a handlebars layout, or an adaptive cards layout. You can read more about how to configure and use entity presentation layouts in this article.

Construction of office building for Ramto A/S - Home-SmallProjects - Google Chrome

In our case, when we publish the page these settings result in the following webpart on our project page:

Here's an example of an Entity Details tab showing an Adaptive Cards layout of the entity's meta data and more:

4. End User Guide

How you use the Details Card webpart depends on your configuration.

If you elect to only display the Stage band, and you click a stage, a window will open showing you more information, as well as functionality buttons:

If both the Entity Details and the Stage band sections are enabled and you click a stage, the Stage Details tab is opened, showing more information (assuming a Stage Details tab is configured. See this article for more information):

If in the Entity Details tab, you display an Adaptive Card with action buttons, these buttons can be clicked to run the associated actions:

5. Notes

If a webpart should be added to the site page of all entities of a given business module, it is recommended to add the webpart to the master site of the module, and then run a Master Site Synchronization, replicating the webpart onto all other entity sites on the module.

This saves a lot of time and effort compared to adding the webpart individually to every single entity site manually.

Note that the contents of the "Entity Details" tab (both default and custom ones) are dependent on your entity presentation settings. It is e.g. possible to display entity details using a default layout, a handlebars layout, or an adaptive cards layout. You can read more about how to configure and use entity presentation layouts in this article.

Have more questions? Submit a request