Editing Direct Answers Header

Search
1

Hi Hitchhikers,

Could anyone point me in the right direction to edit the header for direct answers? It’s currently showing as just a / in the screenshot below and I can’t find the object in code editor.

Thank you!

image
image1034×298 12.2 KB

2

Hi Ryan,

What theme version are you on? Are you using the theme’s Direct Answer card or did you fork the card?

Thanks!
Liz

3

To piggy back off of Liz’s comment, could you make sure the site:

  1. Has the following configuration in the index.json for direct answers (under ComponentSettings)
    "DirectAnswer": {
      "types": {
        "FEATURED_SNIPPET": {
          "cardType": "documentsearch-standard"
        },
        "FIELD_VALUE": {
          "cardType": "allfields-standard"
        }
      }
    },
  1. Is on version 1.20 of the theme and SDK 1.9 or later
5

Hi Rose and Liz,

Updating to SDK 1.9 was an easy fix, thank you!

6

Hi @Liz_Frailey @roser

I understand this was an SDK issue, but are we able to edit the header of the direct answers’ header? Or hide it? Right now it seems to display the name of the entity/query + CF name, but ideally want to overwrite it.

Thanks!

7

Hi Juan,

If you want to hide the header of the direct answers card, you can use the CSS below. The first selector hides the title bar and the second selector adds a border and border radius to match the rest of the card.

  .HitchhikerAllFieldsStandard-title {
    display: none;
  }

  .HitchhikerAllFieldsStandard-content {
    border: var(--yxt-direct-answer-border);
    border-radius: var(--yxt-border-radius);
  }

If you would like to edit the header, you can override the built-in allfields-standard card that is currently being used to customize it how you want. Note that if you override this card, you will not automatically get new changes with theme releases and will need to update the card yourself for new changes.

Taking a look at the current theme 1.28 card’s template.hbs file, this section is found in the {{> title }} partial. The header format entity / field seen in the card is specified as {{entityName}} (line 45) / (line 50) {{fieldName}} (line 55) with null checks and span tags for class names. You can change the card structure here and map any new fields in the component.js file.

image
image1674×1380 333 KB