Render a Search Query Result

Overview

This page demonstrates how to display the results of a search query in the Bloomreach Content (formerly Hippo) delivery tier.

When to Use

Use these template examples when you need to render search results from a query executed in a delivery tier component. The examples apply to queries created using either the Fluent Search API or the Legacy Search API.

Prerequisites

A delivery tier component that executes a search query and exposes the result as an HstQueryResult object.
Familiarity with JSP or Freemarker templates in Bloomreach Content.

Implementation

Both the Fluent and Legacy Search APIs return an HstQueryResult object. The following JSP and Freemarker templates render the result set from either API.

JSP Example

<%@ include file="/WEB-INF/jspf/htmlTags.jspf" %>
<h2>
  <c:out value="${requestScope.info.title}"/> for '<c:out value="${requestScope.query}"/>' :
                                             ${requestScope.result.totalSize} results
</h2>
<ul>
  <%-- Iterate through the hippoBeans on the result --%>
  <c:forEach var="item" items="${requestScope.result.hippoBeans}">
    <hst:link var="link" hippobean="${item}"/>
    <li>
      <hst:cmseditlink hippobean="${item}"/>
      <a href="${link}">${item.title}</a>
      <div>
        <c:if test="${hst:isReadable(item, 'date.time')}">
          <p><fmt:formatDate value="${item.date.time}"
                             type="Date" pattern="MMMM d, yyyy h:mm a"/></p>
        </c:if>
        <p>${item.summary}</p>
      </div>
    </li>
  </c:forEach>
</ul>

This JSP template:

Displays the search title, query string, and total number of results.
Iterates over the hippoBeans in the result set.
For each item, renders a link, an edit link (for CMS users), the title, formatted date (if available), and a summary.

Freemarker Example

<#include "/WEB-INF/freemarker/include/imports.ftl">
<h2>
  ${info.title?html} for '${query?html}': ${result.totalSize} results
</h2>
<ul>
  <#-- Iterate through the hippoBeans on the result -->
  <#if result?? && result.hippoBeans?has_content>
    <#list result.hippoBeans as item>
      <@hst.link var="link" hippobean=item />
      <li>
        <@hst.cmseditlink hippobean=item/>
        <a href="${link}">${item.title?html}</a>
        <div>
          <#if item.date?? && item.date.time??>
            <p><@fmt.formatDate value=item.date.time type="Date" pattern="MMMM d, yyyy h:mm a"/></p>
          </#if>
          <p>${item.summary?html}</p>
        </div>
      </li>
    </#list>
  </#if>
</ul>

This Freemarker template:

Outputs the search title, query string, and total result count.
Checks for the presence of results.
Iterates over hippoBeans and, for each item, renders a link, CMS edit link, title, formatted date (if present), and summary.

Verification

After implementing the template:

Execute a search query in your delivery tier component.
Load the corresponding page in your browser.
Confirm that the search results display as expected, including the title, query, total count, and result details.