Results Page | Yext Hitchhikers Platform
Alert Banner
If you want to show a banner any time results are displayed, add the following to the handlebars file of the vertical of your choosing (e.g. faqs.html.hbs) within the Answers-resultsWrapper div:
<div class="Answers-alertBanner">For urgent requests, please call our <a href="tel:999-999-9999">emergency hotline</a></div>It should look something like this:
<div class="Answers-container Answers-resultsWrapper">
{{> templates/vertical-standard/markup/spellcheck }}
<div class="Answers-alertBanner">For urgent requests, please call our <a href="tel:999-999-9999">emergency hotline</a></div>
<div class="Answers-filtersAndResults">
{{!-- <div class="Answers-filtersWrapper"> --}}
{{!-- {{> templates/vertical-standard/markup/sortoptions }} --}}
{{!-- {{> templates/vertical-standard/markup/filterbox }} --}}
{{!-- {{> templates/vertical-standard/markup/facets }} --}}
{{!-- </div> --}}
{{> templates/vertical-standard/markup/verticalresults }}
</div>
{{> templates/vertical-standard/markup/pagination }}
{{!-- {{> templates/vertical-standard/markup/qasubmission }} --}}
</div>We can also add the below CSS for the .Answers-alertBanner class in our answers.scss file.
.Answers-alertBanner {
width: 100%;
text-align: center;
background: var(--yxt-color-brand-primary);
padding: 1rem;
margin-bottom: 1rem;
color: white;
font-weight: bold;
a {
text-decoration: underline;
&:hover {
text-decoration: none;
}
}
}
Feedback
<% elem.innerText %>