Spell Check Moved Above Result Count (Winter '21 Release)

Product/Library Releases & New Features Winter '21 Release
1

We’ve moved the spell check component above the result count on all vertical templates. This places the result count right above the results for a better UI.

Upgrade Implications:

:spiral_calendar: This feature is available in Early Access. Here’s how to use the Early Access branches of the Theme and SDK!

If you want this update, you’ll need to re-add the vertical pages using the Jambo Command “Add Vertical” for each page you want this update for.

Alternatively, you can also move the spellcheck partial in the pages.html.hbs file to match the vertical template. Move it from around line 43 in the Answers-results class to about line 33 after the directanswer partial in the Answers-container class. Check out the page templates in the theme to see the updated order: navigate to the page templates (theme/answers-hitchhiker-theme/templates), find the template you want, and open the page.html.hbs file. For example, if you are using the vertical-standard template, it’ll look something like the below.

Before:

    <div class="Answers-container Answers-resultsWrapper">
      <div class="Answers-resultsHeader">
        {{> templates/vertical-standard/markup/verticalresultscount }}
        {{> templates/vertical-standard/markup/appliedfilters }}
        {{!-- {{> templates/vertical-standard/collapsible-filters/markup/filterlink }} --}}
        {{!-- {{> templates/vertical-standard/collapsible-filters/markup/viewresultsbutton }} --}}
      </div>
      <!-- Uncomment the following div if you want to include filters, facets, or sort options  -->
      {{!-- <div class="Answers-filtersWrapper js-answersFiltersWrapper CollapsibleFilters-inactive"> --}}
        {{!-- {{> templates/vertical-standard/markup/sortoptions }} --}}
        {{!-- {{> templates/vertical-standard/markup/filterbox }} --}}
        {{!-- {{> templates/vertical-standard/markup/facets }} --}}
      {{!-- </div> --}}
      <div class="Answers-results js-answersResults">
        {{> templates/vertical-standard/markup/spellcheck }}
        {{> templates/vertical-standard/markup/verticalresults }}
        {{> templates/vertical-standard/markup/pagination }}
        {{!-- {{> templates/vertical-standard/markup/qasubmission }} --}}
      </div>
    </div>

After:

    <div class="Answers-container Answers-resultsWrapper">
      {{> templates/vertical-standard/markup/directanswer }}
      {{> templates/vertical-standard/markup/spellcheck }}
      <div class="Answers-resultsHeader">
        {{> templates/vertical-standard/markup/verticalresultscount }}
        {{> templates/vertical-standard/markup/appliedfilters }}
        {{!-- {{> templates/vertical-standard/collapsible-filters/markup/filterlink }} --}}
        {{!-- {{> templates/vertical-standard/collapsible-filters/markup/viewresultsbutton }} --}}
      </div>
      <!-- Uncomment the following div if you want to include filters, facets, or sort options  -->
      {{!-- <div class="Answers-filtersWrapper js-answersFiltersWrapper CollapsibleFilters-inactive"> --}}
        {{!-- {{> templates/vertical-standard/markup/sortoptions }} --}}
        {{!-- {{> templates/vertical-standard/markup/filterbox }} --}}
        {{!-- {{> templates/vertical-standard/markup/facets }} --}}
      {{!-- </div> --}}
      <div class="Answers-results js-answersResults">
        {{> templates/vertical-standard/markup/verticalresults }}
        {{> templates/vertical-standard/markup/pagination }}
        {{!-- {{> templates/vertical-standard/markup/qasubmission }} --}}
      </div>
    </div>