freefind login search menu
How To Use Templates

Templates allow you to "drop" the search results into a page of your own design. Using this mechanism your search results can look exactly like the rest of your site. This how-to describes how to use a "template" to customize the look of your search results.

Contents What is a Template Who Should Use It Overview Creating a Template Page Types Uploading your Template An Example Template Template Restrictions Common Questions Before you use templates, read the template restrictions!

This tutorial is not a web/html primer and assumes that you already know how the process of "web surfing" is accomplished (i.e. a browser requests a page from a server which then returns the page to be viewed), and what an HTML "form" is and how it works. If you are not familiar with these concepts please read a basic web/html primer.

What is a Template?

A template is a great way to customize the look of your search engine results pages. A template is simply an HTML page with special fields. The special fields tell FreeFind where to insert the page contents. This enables you to create a completely customized look and feel.

Who Should Use It?

Professionals and perfectionists! Using templates is more complex than the basic customization options, but if you are an experienced web developer who wants to control the look of the results precisely then this feature is for you.

Overview

Creating a template is easy. You just create a regular web page and then tell the search engine where to insert the page title and page contents (search results, site map, etc) by using simple text strings.

Once your template is finished you need to upload it to the FreeFind server. This is done using the Control Center. After logging in, go to the customize page and use the "upload custom template" option.

Both these steps are covered in more detail below.

Creating a Template

Usually the easiest way to create a template is to copy an existing page on your site then modify it for use as a template. You will need to make the following modifications:

Replace the page title with "::title::"
Remove the title of your page and replace it with the text "::title::" (without the quotes). This is the location the title text will be inserted before showing it to your visitors (for example, "Search Results", or "Site Map").
Replace the page content with "::content::"
Remove the content of your page (the "stuff" that make that page unique), and then add the text "::content::" (without the quotes) where you want your search results to be located. The search engine will insert the actual search results at that spot before displaying the page to your visitors.
Ensure there are no relative links
Since the page will be served from our domain, all of the links in your template need include your domain name, so they refer to your content and not ours. The easiest way to do this is to add a "base href" tag at the start of the head section. The href value should be the address of your site or address of the page which you based the template on. For example:
				<base href="https://example.com/">
			

To illustrate, here is what a template might look like:

template page image

Note the "::content::" text where the page content will be inserted. Using this template, FreeFind would create a search result page that looks like this:

templated search result page

When that same template is used to create a site map page it looks like this:

templated site map page

As you can see, a single template is used to generate more than one type of page.

Page Types

FreeFind serves up to six types of pages, depending on what features you are using. The same template is used for all six pages, so don't include page-specific items in your template. For example, the text "Search Results" would look a little strange on the Site Map page.

The search engine serves up to six types of pages, depending on what features you are using:

  1. Site search, query page – a single site search panel. (example)
  2. Site search, search results – the results of a site search. (example)
  3. Web search, query page – a single web search panel. (example)
  4. Web search, search results – the results of a web search. (example)
  5. Site map – an overview of your site. (example)
  6. What's new – a list of the recently changed pages on your site. (example)

You can customize the page titles and headings for each page type separately. To do this log in to the Control Center and go the to the customize page. Then use the edit site search text, edit web search text, and edit site map text links.

Uploading your Template

After you have created your template you need to upload it to our servers. To do this log in to the Control Center then go the to the customize page. In the middle of that page, click on the upload custom template link. A dialog will appear with a large text area into which you can paste your template code. After adding your code click on the button to quickly get a rough idea of how your search results will look without committing to making the change. If you are satisfied with your template, use the button to use the new template.

An Example Template

The following HTML code is a simple template. It creates a page with the headline "Example Template". Both the headline and the page contents are centered. The page background is gray and the text color is white;

<html><head>
  <base href="https://example.com">
  <title>::title::</title>
  <style>
    body { background:gray; color:white; }
    body > div { text-align:center; }
    body > div > div {
      text-align:left; max-width:600px; margin:auto;
    }
  </style>
</head><body>
  <div>
    <h2>Example Template</h2>
    <div>
      ::content::
    </div>
  </div>
</body></html>

Template Restrictions
Summary
Sponsored (free) accounts

All accounts

No Advertising (free accounts only)

Templates for sponsored (free) accounts may not contain advertising, affiliate programs or link exchange banners. Subscription accounts are free to show advertising.

Due to our contractual obligations to our advertisers, free accounts must not include advertising in their template. Doing so will result in account termination. Of course, you're free to show advertising anywhere else on your site!

If you would like to include advertising in your template, please subscribe.

No Pop-up Windows (free accounts only)

Templates may not include windows that pop-up automatically.

No Including JS Files (free accounts only)

Templates may not include external javascript files. For example:

			<script src="https://example.com/my.js"></script>
		

If you want to do this you must subscribe first.

Relative Links

Because the pages are served from the FreeFind servers, all templates must contain a "base href" tag or all links and image tags must use "absolute" links (fully qualified URLs starting with "http...") rather than relative links in order to work properly. Relative links will simply not work because they will refer to our server instead of yours. This includes all types of links, including image links.

For example the image tag:

			<img src="mylogo.gif">
		
would not work. The tag must be written as:
			<img src="https://www.example.com/mylogo.gif">
		
to work.

Of course the same is true of HREFs:

			<a href="contact.html">
		
will not work. It should be written as:
			<a href="https://www.example.com/contact.html>
		
to work.

Template Size

Templates are limited to 64K bytes of HTML. Note that this does not include images. You may use as many images as you would like. The limit is only for the HTML part of the page template, not the entire size of the resulting page.

Common Questions

Can I customize my page without templates?
Absolutely. It's fast and easy to customize your page without using templates. Templates simply give you more control. To customize without templates log in to the Control Center then go the to the customize page.

Can I customize elements within the ::content:: block?
Yes. In the customize page all options are available except the ones in the "easy customization" section.

Additionally, you may use CSS styles to customize the look of the content.

How do I use my own search box instead of the default one?

First, be sure your template contains a functioning search box of your own design.

Then, to hide the search box in the search results pages, add this line of code to the search box on your site:

				<input type="hidden" name="nsb" value="1">
			

Note: To have the current query merged into your search box so that it is displayed to the user, use the

				<!--cleanquery-->
			
merge point in your search box code. For example, your search input field might look like this:
				<input type="text" name="query" value="<!--cleanquery-->">
			

FreeFind and FreeFind.com are trademarks of FreeFind.com.
Copyright 1998 - 2018