You are here

search-api-autocomplete-suggestion.html.twig in Search API Autocomplete 8

Default theme implementation to display a search suggestion.

Keywords suggestions (which will fill the keywords input field) can be distinguished from direct results/links (which will take the user to a different page) by checking whether the "keys" or the "url" key is set.

Keywords suggestions will usually contain the keywords as a concatenation of "suggestion_prefix", "user_input" and "suggestion_suffix".

Available variables:

  • keys: The fulltext keywords this suggestion will put into the search field.
  • url: The URL (\Drupal\Core\Url object) to which the suggestion will redirect the user.
  • label: A complete label to display for the suggestion.
  • note: Text to display in front of the label.
  • results_count: The (approximate) number of results the suggested keywords will yield.
  • suggestion_prefix: A suggested prefix for the entered user input.
  • suggestion_suffix: A suggested suffix for the entered user input.
  • user_input: The input entered by the user so far.

File

templates/search-api-autocomplete-suggestion.html.twig
View source
  1. {#
  2. /**
  3. * @file
  4. * Default theme implementation to display a search suggestion.
  5. *
  6. * Keywords suggestions (which will fill the keywords input field) can be
  7. * distinguished from direct results/links (which will take the user to a
  8. * different page) by checking whether the "keys" or the "url" key is set.
  9. *
  10. * Keywords suggestions will usually contain the keywords as a concatenation of
  11. * "suggestion_prefix", "user_input" and "suggestion_suffix".
  12. *
  13. * Available variables:
  14. * - keys: The fulltext keywords this suggestion will put into the search field.
  15. * - url: The URL (\Drupal\Core\Url object) to which the suggestion will
  16. * redirect the user.
  17. * - label: A complete label to display for the suggestion.
  18. * - note: Text to display in front of the label.
  19. * - results_count: The (approximate) number of results the suggested keywords
  20. * will yield.
  21. * - suggestion_prefix: A suggested prefix for the entered user input.
  22. * - suggestion_suffix: A suggested suffix for the entered user input.
  23. * - user_input: The input entered by the user so far.
  24. *
  25. * @ingroup themeable
  26. */
  27. #}
  28. <div class="search-api-autocomplete-suggestion">
  29. {% if note %}
  30. <span class="autocomplete-suggestion-note">{{ note }}</span>
  31. {% endif %}
  32. {% if label %}
  33. <span class="autocomplete-suggestion-label">{{ label }}</span>
  34. {% endif %}
  35. {% spaceless %}
  36. {% if suggestion_prefix %}
  37. <span class="autocomplete-suggestion-suggestion-prefix">{{ suggestion_prefix }}</span>
  38. {% endif %}
  39. {% if user_input %}
  40. <span class="autocomplete-suggestion-user-input">{{ user_input }}</span>
  41. {% endif %}
  42. {% if suggestion_suffix %}
  43. <span class="autocomplete-suggestion-suggestion-suffix">{{ suggestion_suffix }}</span>
  44. {% endif %}
  45. {% endspaceless %}
  46. {% if results_count %}
  47. <span class="autocomplete-suggestion-results-count">{{ results_count }}</span>
  48. {% endif %}
  49. </div>