Editing Direct Answers Header

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.