Overview of Rendering Components

To structure the output for a search submission, you must embed specific rendering tags within the <stl:searchOutput> container. The core elements required are <stl:pageContents>, which displays the list of results, and <stl:pageItems>, responsible for the pagination controls, along with multiple <stl:pageItem> definitions.

Configuration Constraints:

• The <stl:searchOutput> tag is required to anclose exactly one <stl:pageContents> element to render the actual result data.
• Pagination navigation relies on at least one <stl:pageItems> block containing distinct <stl:pageItem> entries. Refer to documentation for those specific components for detailed configuration.
• Additional HTML or STL elements can be placed freely outside these mandatory blocks within <stl:searchOutput> to apply custom styling or layout wrappers.

1. Default Implementation

When minimal markup is provided, the system renders results using standard settingss. This example defines a width constraint without altering internal structures:

<stl:searchOutput pageNum="12" width="500px">
</stl:searchOutput>

2. Custom Layout with Keyword Highlighting

This aproach enables case-sensitive highlighting and allows full control over the visual arrangement. A table structure is used here to organize the navigation links.

<stl:searchOutput width="500px" isHighlight="true">
    <stl:pageContents scope="All" pageNum="12">
        <div class="result-card">
            <stl:a target="_blank"></stl:a><br />
            <stl:content type="Content" isClearTags="true" wordNum="120"></stl:content>
        </div>
    </stl:pageContents>
    
    <hr />
    
    <stl:pageItems>
        | <pageitem text="Start" type="FirstPage"></pageitem> \| <pageitem text="Back" type="PreviousPage"></pageitem> \| <pageitem text="Forward" type="NextPage"></pageitem> \| <pageitem text="End" type="LastPage"></pageitem> | <pageitem text="Page:" type="CurrentPageIndex"></pageitem> <pageitem type="PageNavigation"></pageitem> |
|:--|--:|
    </stl:pageItems>
</stl:searchOutput>

3. Handling Success and Empty States

Using conditional templates ensures users receive appropriate feedback when no matches are found versus when results exist successfully.

<stl:searchOutput width="500px">
    <stl:successTemplate>
        <stl:pageContents scope="All" pageNum="12">
            <a href="#"><stl:a target="_blank"></stl:a></a>
        </stl:pageContents>
        <br />
        <stl:pageItems>
            | <pageitem text="First" type="FirstPage"></pageitem> \| <pageitem text="Prev" type="PreviousPage"></pageitem> \| <pageitem text="Next" type="NextPage"></pageitem> \| <pageitem text="Last" type="LastPage"></pageitem> | <pageitem text="Current:" type="CurrentPageIndex"></pageitem> <pageitem type="PageNavigation"></pageitem> |
|:--|--:|
        </stl:pageItems>
    </stl:successTemplate>
    
    <stl:failureTemplate>
        | Error: No records matched your query. |
|:-:|
    </stl:failureTemplate>
</stl:searchOutput>