This component outputs data relating to a site search request passed in a URL parameter SearchKeyword to any page (typically from a search form submission).

{% component type: "site_search", source: "Page", layout: "Site Search List" %}

Search queries are currently made against all of the following modules:

  • Pages
  • Blogs (Blogs and Posts)
  • Events (Groups and Items)
  • Banners (Groups and Items)
  • Galleries/Sliders (Groups and Items)
  • FAQs (Groups and Items)
  • Custom Modules
  • Authors
  • Products/Catalogs

Parameters and Options

Parameter Values Required Description
type site_search

This is the name of the entity that needs to be used for the component retrieving function.

source Page (default)
<Entity name/ID>
The entity name or ID that the layout is to be referenced from.
layout Site Search List (default)
<Your Layout name>

The layout name you want to use for rendering the component. The layout name is referenced from the available Layouts of the source specified.

While this parameter is required to render your Layout markup, if the parameter is blank, has an incorrectly referenced Layout, or is removed altogether then the component will still output the modules item data to a Liquid collection which can be accessed via the collectionVariable parameter.

sortBy id
...and any other top level properties available for the module

The name of the property to sort by. If empty or not present, alpha/numeric sorting will be used.

Remove spaces from custom property names here.

sortOrder ASC (default)

ASC sorts the items in ascending order while DESC sorts in descending order (based on alpha/numeric or date sorting).
If empty or not present, alpha/numeric sorting will be used.
random false (default)

Retrieves matched search results at random. For example, if you limit the results to 5 but 10 items are matched to the search term, 5 of the 10 results will be output at random. If pagination applied, th esecond page will be the 5 remaining random items.

If used in conjunction with sortOrder the sorting criteria will be applied to the randomly retrieved results.

limit 10 (default)

The maximum number of items returned. If displayPagination is enabled this determines the maximum number of items per page.
enablePagination true (default)

Enables/disables pagination for the component.

This is useful for avoiding pagniation affects for a specific component when multiple components of the same module are output on the same page and do use pagination.

displayPagination false (default)

Displays pagination if there are more items available than the limit set.
emptyMessage <Your custom message>
Custom content that is rendered if no value is passed to the SearchKeyword parameter (not if no search results are found). The default is no content.
Liquid variables are supported here, although Liquid logic tags and HTML are not.

If using Liquid variables with filters added, be sure to change any double quotes to single quotes. For eg:
emptyMessage: “{{ myVariable | prepend: 'Error: ' }}”

To use HTML in your empty message, first capture it using a Liquid capture, then insert the capture variable into the emptyMessage parameter.

object item (default)

Determines the method for Liquid rendering.
item returns each item iteratively, one after another, for output (generally, output to a container element with no need for looping through the data).
collection returns all items as one collection for output (your container element and looping logic would be handled in the Components Layout).
collectionVariable <yourLiquidVariableName>
Assigns the data to a Liquid collection enabling further access to the data on the Page or Template using Liquid.

Your collectionVariable value must only contain English letters, numbers or underscores. Spaces or special characters are not supported.

<customParameter> <your custom value>
You can add your own additional parameters (name/value pairs) to the Component tag. These will be passed to the Components Layout (and the collectionVariable if used) for use via Liquid.

Your <customParameter> name must only contain English letters, numbers or underscores. Spaces or special characters are not supported.

You can use HTML as the value here, just be sure to change any double quotes in your HTML to single quotes.

Liquid Output

For an example of the Liquid data that will be output from this components, please see the ‘Basic Site Search Demo’ link in the External Resources section below.

Accessing the Data

This data is accessible in two main ways:

1. Using Liquid in the specified Layout via the this object.


2. Directly on the Page or Template via a Liquid Collection if collectionVariable was added to the Component tag.

An example using collectionVariable with value "searchResults" is as follows:

{% component type: "site_search", source: "Page", layout: "", collectionVariable: "searchResults" %}

Looping through the collection to render all the item names in a list:

{% for sr in searchResults.items %}
{% endfor %}

Accessing a specific item within the collection. In this case the first item name (zero based index):


Related Articles

External Resources

Please let us know if you have any other contributions or know of any helpful resources you'd like to see added here.


We are always happy to help with any questions you may have.
Visit the Treepl Forum for community support and to search previously asked questions or send us a message at and we will consult you as soon as possible.