Customizing Search Results

On this page:


Overview

The standard Agency search results templates for public access and intranet provide a level of area-specific customization that is sufficient for most applications. The following features can be customized without coding a custom result template:

  • The name of the area that appears on the results line
  • The URL of the "Contact Us" page
  • The URL of area-specific advanced search
  • The URL of the cascading style sheet (css)

Customization of the content or appearance of your search results page beyond this level is implemented using eXtensible Style Language Transformations (XSLT). The XSL stylesheets may be located in any web-accessible directory for testing, but must be located on the search server for production.

Top of Page

Customizable XSLT Modules

The three customizable modules are designed to encapsulate the HTML that is rendered in the search results. Customizing these modules does not require XSLT skills, but does require that coding in strict XHTML, and observing the some simple rules for XML encoding. Every area of the result page is exposed for modular customization, with the exception of the results list itself, which requires some XSLT coding skills.

Sidebar: The easiest, and most commonly used custom stylesheet is the sidebar. The sidebar controls the links and link text that appear in the left column of the results page. Area-specific sidebars are implemented using an unordered list, with one list item per link. The default sidebar for both intranet and public access is empty. An example of a custom sidebar is the EPA home page sidebar http://nlquery.epa.gov/epasearch/epahome_sidebar.xsl

Pagehead: The pagehead module renders everything that appears above the search results. In addition to XHTML code, this module contains two lines of XSLT code. Neither should be removed or altered.

This code inserts a search form, customized for your area, in the search results.
<xsl:call-template name="searchform"></xsl:call-template>

This code inserts the original query in the "Results for …" line of the results page
<xsl:value-of select= "$OriginalQueryText"/>

A sample pagehead module can be found at http://aggie2.rtpnc.epa.gov:81/epasearch/ourtssms_pagehead.xsl

Pagefoot: The pagefoot module formats everything that appears below the search results. It consists entirely of XHTML. A sample pagefoot module can be found at http://aggie2.rtpnc.epa.gov:81/epasearch/ourtssms_pagefoot.xsl

Top of Page

Coding Custom Stylesheets

Each XSL stylesheet starts with these two lines. Substitute the name of your template forourtssms_sidebar. Use the convention tssms_sidebar|pagehead|pagefoot . This is the name by which your template will be referenced. Note that while you should save your template file with an extension of .xsl, the name field should not contain the extension.

<xsl:stylesheet version= "1.0" xmlns:xsl=http://www.w3.org/1999/XSL/Transform 
xmlns:fo="http://www.w3.org/1999/XSL/Format"> 
<xsl:template name="ourtssms_sidebar">

All XSL stylesheets must close with

</xsl:template> 
</xsl:stylesheet>

Everything in between must be coded as well-formed XML. This means, for the most part, simply coding strict XHTML. In addition, XML requires that you escape the following 5 characters.

Replace this character ...with this entity  
< &lt; less than
> &gt; greater than
& &amp; ampersand
' &apos; apostrophe
" &quot; quotation mark

Top of Page

Testing your Custom Modules

When you are ready to start coding and testing one or more modules, contact the search webmasters to let them know the names and URLs of your modules. You don’t need to send the modules themselves at this time – you should keep them in a web-accessible directory in your tssms. References to these modules will be placed in a registry on the search development machines.

Once you have coded your modules, you should make sure they are well–formed. The easiest way to do this is to view them in a browser. Both Internet Explorer and Firefox will identify errors in xsl files (IE is somewhat superior to Firefox in this respect). Once you have determined that your modules are compliant, you can test your modules using this form.

Public access: http://aggie2.rtpnc.epa.gov:81/epasearch/searchutils/test_templates.html
Intranet: http://aggie2.rtpnc.epa.gov/epasearch/searchutils/test_templates.html

To use this form, enter the name (not the URL) of the module or modules you are testing in the appropriate text box. Or, if you prefer, you can build your own test page using the form elements documented in the next section.

Top of Page

Implementing your Custom Modules

When you are ready to put your custom XSL stylesheets into production, you must send them to the search webmasters, who will load them on the production search server.

To make custom results available from your pages, add the following (as appropriate) to your search form:

<input type="hidden" name="areasidebar" name="mytssms_sidebar">
<input type="hidden" name="areapagehead" name="mytssms_pagehead">
<input type="hidden" name="areapagefoot" name="mytssms_pagefoot">

Note that some pages already have an areasidebar element, which was inoperative under Verity. These are ignored unless they are in the registry.

 

Customizing the Cascading Stylesheet

Public Access search results use the standard Version 4 Agency template: http://www.epa.gov/epafiles/css/epa-core.css

which additional styles defined in this stylesheet: http://search.epa.gov/epasearch/s/search_v4.css

You can add your own stylesheet using the coding below.  This stylesheet will be appended after the two standard stylesheets using the coding below.  If there are any name conflicts, your stylesheet will prevail in all browsers.

Top of Page

Appendix A: Sample Sidebar Module

This sample can be downloaded from http://nlquery.epa.gov/epasearch/epahome_sidebar.xsl

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<!-- SIDEBAR ITEMS START HERE - DO NOT TOUCH ANYTHING ABOVE THIS LINE -->
<!-- The template name below is the unique identifier of your template. Please use the format tssms_(sidebar|pagehead|pagefoot). -->
<xsl:template name="epahome_sidebar">
<ul>
<li><a href="http://www.epa.gov/newsroom">EPA Newsroom</a></li>
<li><a href="http://www.epa.gov/epahome/topics.html">Browse EPA Topics</a></li>
<li><a href="http://www.epa.gov/epahome/lawregs.htm">Laws, Regulations & Dockets</a></li>
<li><a href="http://www.epa.gov/epahome/whereyoulive.htm">Where You Live</a></li>
<li><a href="http://www.epa.gov/epahome/resource.htm">Information Sources</a></li>
<li><a href="http://www.epa.gov/epahome/educational.htm">Educational Resources</a></li>
<li><a href="http://www.epa.gov/epahome/aboutepa.htm">About EPA</a></li>
<li><a href="http://www.epa.gov/epahome/programs.htm">Programs</a></li>
<li><a href="http://www.epa.gov/epahome/partnerships.htm">Partnerships</a></li>
<li><a href="http://www.epa.gov/epahome/doingbusiness.htm">Business Opportunities</a></li>
<li><a href="http://www.epa.gov/careers">Careers</a></li>
<li><a href="http://www.epa.gov/espanol">EPA En Español</a></li>
<li><a href="http://www.epa.gov/kids/"><img src="http://www.epa.gov/epahome/pics/kids.gif" border="0" alt="EPA Environmental Kids Club" width="114" height="25"/></a></li>
<hr noshade="noshade" width="80%"/>
<li><a href="http://www.firstgov.gov">FirstGov</a></li>
<li><a href="http://www.whitehouse.gov">The White House</a></li>
<li><a href="http://www.regulations.gov">Regulations.gov</a></li>
</ul>
<!-- SIDEBAR ITEMS END HERE - DO NOT TOUCH ANYTHING BELOW THIS LINE -->
</xsl:template>
</xsl:stylesheet>

Top of Page

Appendix B: Sample Pagehead Module

This sample can be downloaded from http://aggie2.rtpnc.epa.gov:81/epasearch/ourtssms_pagehead.xsl

Note that the highlighted areas contain XSL code, which should not be altered.

<xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl=http://www.w3.org/1999/XSL/Transform xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:template name="ourtssms_pagehead">
<div id="header">
<!-- START EPA HEADER -->
<div id="logo">
<a href="http://www.epa.gov/" title="United States Environmental Protection Agency home page.">
<img src="http://nlquery.epa.gov/redesign_new/i/logo_epaseal_new.gif" alt="[logo] US EPA" title="United States Environmental Protection Agency" width="100" height="111"/>
</a>
</div>
<div id="areaname">
<!-- START AREA NAME -->
<p>
Our Area Name search results</p>
</div>
<!-- END AREA NAME -->
<form id="EPASearch" action="/epasearch">
<p>
<a href="http://intranet.epa.gov/ourtssms/contact.html">Contact us</a> | 
<a href="http://intranet.epa.gov/ourtssms/advanced_search.html">Advanced search</a> |
<a href="http://intranet.epa.gov/ourtssms/search_help.html">Search help</a>
<xsl:call-template name="searchform"></xsl:call-template>
</p>
</form>
<ul>
<!-- BEGIN BREADCRUMBS -->
<li class="first">You are here: <a href="http://intranet.epa.gov/agcyintr/index.html">EPA@Work</a></li>
<!-- START AREA BREADCRUMBS -->
<li><a href="http://intranet.epa.gov/ourtssms/search.html">New search</a></li>
<li>
Results for <xsl:value-of select="$OriginalQueryText"/></li>
<!-- END AREA BREADCRUMBS -->
</ul>
<!-- END BREADCRUMBS -->
</div>
<!-- END EPA HEADER -->
</xsl:template>
</xsl:stylesheet>

Top of Page

Appendix C: Sample Pagefoot Module

This sample can be downloaded from http://aggie2.rtpnc.epa.gov:81/epasearch/ ourttssms_pagefoot.xsl

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:template name="ourtssms_pagefoot">
<!-- BEGIN FOOTER -->
<!-- BEGIN AREA FOOTER -->
<!-- ADD LINKS AND TEXT FOR AREA FOOTER WITHIN THIS PARAGRAPH TAG -->
<p id="areafooter"/>
<!-- END AREA FOOTER -->
<!-- BEGIN GLOBAL FOOTER -->
<ul id="globalfooter">
<li><a href="http://intranet.epa.gov/agcyintr/index.html">
EPA@Work Home</a></li>
<!-- BEGIN AREA COMMENTS LINK -->
<li><a href="http://intranet.epa.gov/ourtssms/contact.html">
Contact us</a>
</li>
<!-- END AREA COMMENTS LINK -->
</ul>
<!-- END GLOBAL FOOTER -->
<!-- BEGIN DATEURL -->
<!-- URL is automagically generated and inserted above DATE -->
<p id="contentdate"/>
<!-- END DATEURL SCRIPT -->
<address>Environmental Protection Agency, Ariel Rios Building, 1200 Pennsylvania Avenue, N.W., Washington, DC 20460</address>
</xsl:template>
</xsl:stylesheet>

Top of Page