New Formatter for Categories (September '21 Release)

We’ve added a new formatter built-in to make it easier to show Categories on the frontend of your Answers experience.

Overview

The builtin.medicalSpecialty field is a special field that exposes the categories for a Healthcare Professional to the Answers Algorithm in the backend. You can use this in your backend configuration, but what if you want to be able to show the specialties on your card? If you remember, we can only expose data that’s returned to us in the API response. Looking at the response that returns Healthcare Professionals, you’ll see that the category IDs are returned.

"categoryIds": [

"1502017",

"1257"

],

Building Your Category Mappings

You can find the Category ID to Name mappings in your Knowledge Graph > Configuration tab, under Additional Information > Category Lists, or at https://www.yext.com/s/{yourBusinessId}/account/categoryLists.

Once you navigate here, you can download an Excel workbook with the ID to Name Mappings. image

From this excel, you’ll need to format it into a JSON object so we can reference it in our JS file easily. I recommend a site like CSV to JSON - CSVJSON.

  1. Removed the leading categories and > by find/replacing in Excel for "*> ". This removes everything before the last > character as well as the space after it.
  2. Renamed the column headers to lowercase “id” and “category” for ease of use in my function.
  3. Pasted the content into CSV to JSON - CSVJSON to get a JSON array of objects, each containing an id and a category attribute.

A quick gif of the steps is below:

convert-excel-to-json (1)

Once you have the category mappings:

Jambo commands > override theme. Select static > js > custom-modules.js

Paste the array in this file, and export it as a variable (we’ll call it “Mappings”). This is what it will look like (but much longer):

export const Mappings = [

{

"id": "1322910",

"category": "Category 1!"

},

{

"id": "1111",

"category": "Category 2"

}

]

You can now reference this variable using HitchhikerJS.CustomModules.Mappings in any of your cards or elsewhere in the experience!

In the card where you’d like to display the category mappings, use this new variable and the getCategoryNames formatter, like so:

subtitle: profile.categoryIds ? Formatter.joinList(Formatter.getCategoryNames(profile.categoryIds, HitchhikerJS.CustomModules.Mappings), ",") : ""