Use this feature to change the search results font so that it exactly matches your site. You can also use these classes and your style sheets to do other creative customization.

Contents Overview Base CSS Classes Extended CSS Classes

[top]

This tutorial is not a web/html primer and assumes that you already are familiar with creating web pages and with cascading style sheets (CSS). If you are not familiar with these concepts please read a basic web/html primer.

Overview

(top)

In order to change the font using style sheets you will need to customize your results using a template file (see Using Templates for the Best Look). Use of a template file allows you to set the styles used on the search result page. The base CSS classes below are always available in the search results. The extended CSS classes are optionally available.

This how-to assumes that you have already set up a basic template, and now what to change the font of the search results.

Base CSS Classes

(top)

To set the fonts, add a style sheet to your template page. Here is an example which sets the overall font used for result items to verdana and makes the line at the top of the search results red:

<style type="text/css"><!--
.search-results {
    font-size:10pt; color:Black; font-family:verdana,sans-serif;}
.search-line {background:Red;}
--></style>


The table below lists all of the standard CSS classes available. Additional optional classes are detailed in the section after this one.

Extended CSS Classes

(top)

The search engine can optionally create pages with extended CSS classes. This allows greater control over the formatting of each result item. To enable this feature you will need to add this HTML tag to your search panel:

<input type=hidden name=css value="">

This tag instructs the search engine to include the extended CSS classes listed below in the search result pages: