Best practice for adding long description to results card

Hi All,

For context, my client is utilizing the Healthcare Facilities entity type to surface COVID-19 Community Testing Centers in their Answers experience. They want to include the address information and a lengthy description (~850 characters) in the results card for these testing centers in the Answers experience.

I populated the address information in the subtitle of the result card to save some room for the description. However, the description is lumped into one paragraph and does not maintain the structure of how it’s written in the Knowledge Graph.

While I know I could utilize the truncate formatter, the client wants to surface all of the information in the description field. Does anyone have a good workaround that I could experiment with?

Thank you,
Austin

Hi Austin,

I’d recommend using the showMoreLimit attribute in this scenario. If you set this attribute to 500 (i.e. showMoreLimit: 500), the card will display “Show More” after 500 characters and allow a user to click to reveal the full content (and can then click “Show Less” to truncate the content). You are also able to configure the showMoreText and showLessText attributes if you’d like to use different copy than the standard values. See below for an example code snippet that would be added to the component.js file of your forked card:

showMoreDetails: {
        showMoreLimit: 500, // Character count limit
        showMoreText: 'Show More', // Label when toggle will show truncated text
        showLessText: 'Show Less' // Label when toggle will hide truncated text
      },

Best,
Josh