9 December 2008

Author

Jan Vantomme

Categories

Web Development
Tutorial

Textpattern Search Strategies

In this article I’m going to show you how you can create a more user-friendly search template for Textpattern. The built-in search engine in Textpattern can offer you a lot of flexibility when you design a system for searching your website.

Visitors can land on your search page in a few ways, and for each situation, other data needs to be presented to your visitor.

  1. The visitor lands on the search results page without entering a query:
    • Inform your visitor with a message that no search query was entered.
    • Display a search form so the visitor can perform a new search.
  2. The visitor lands on the search results page but there are no results for the query:
    • Display a message that no results for the query were found.
    • Display a search form so the visitor can perform a new search.
  3. The visitor lands on the search results page with a good query:
    • Display search results, maximum 10 per page.
    • If less than 10 results, do not show search results navigation
    • If more than 10 results: show search results navigation

Use a different section for search results

Create a new section called search or searchresults to display the results of your search query. Create a new page to use with this section only.

The structure of the search template

<txp:if_search>

<txp:if_search> is a conditional tag and should always be opened and closed. On the search page we are going to use this tag in combination with <txp:else /> to display search results or a message if no query was entered.

<txp:if_search>
    <!-- Show search results-->
<txp:else />
    <!-- Display message about missing query -->
</txp:if_search>

<txp:if_search_results>

<txp:if_search_results> is also a conditional tag. By using this tag in combination with <txp:else />, it will be possible to display search results or a message when no articles were found.

<txp:if_search>
    <txp:if_search_results min="1">
    <!-- display search results, maximum 10 -->
    <txp:else />
    <!-- no search results found, display search form -->
    </txp:if_search_results>
<txp:else />
    <!-- Display message about missing query -->
</txp:if_search>

You’ll also need to use <txp:if_search_results> to display the search results navigation when there are more than 10 results.

<txp:if_search_results min="11">
    <p><txp:older showalways="yes">Next Page</txp:older><br />
    <txp:newer showalways="yes">Previous Page</txp:newer></p>
</txp:if_search_results>

The full template

<txp:output_form form="header" />
<txp:if_search>
    <txp:article pgonly="1" />
    <txp:if_search_results min="1">
        <p><strong><txp:search_result_count text=" " /></strong>
        articles found for <strong><txp:search_term /></strong>.</p>
        <ol>
            <txp:article limit="10" form="search_results" pageby="10" />
        </ol>
    <txp:else />
        <p>No results found for <strong><txp:search_term /></strong>.</p>
        <txp:search_input button="Search" label="Search" section="searchresults" />
    </txp:if_search_results>
<txp:else />
    <p>You forgot to enter a keyword to search for.</p>
    <txp:search_input button="Search" label="Search" section="searchresults" />
</txp:if_search>
<txp:if_search_results min="11">
    <p><txp:older showalways="yes">Next Page</txp:older><br />
    <txp:newer showalways="yes">Previous Page</txp:newer></p>
</txp:if_search_results>
<txp:output_form form="footer" />

Top · Tweet about this

Browse Articles

Previous Article:
Next Article:

0 Opinions posted so far. Now go post your own. To the comment form!

Commenting is closed for this article.

Subscribe to this blog

About this blog

This is the personal weblog of Jan Vantomme.
I write about the everyday things that move me as a designer. I write shorter things on Twitter.

Add to Technorati Favorites

Some of the blogs I like

./ With Imagination
A JavaScript, CSS, XHTML web log focusing on usability and accessibility by Dustin Diaz
Shaun Inman
A blog on web design and development by Shaun Inman
Molly.com
Web development work and peronal thoughts of Molly E. Holzschlag.
John Nack on Adobe
Blog about Adobe Photoshop &amp; Photography by John Nack
Authentic Boredom
A blog on web design by Cameron Moll