Using Templates so the Search Engine Matches Your Site's Look

Knowledge Base Article kb05

Search Maker Pro by default creates a search engine with minimal formatting around the search form. This is suitable for many websites. However you may wish to change the formatting to fit with your own site's look and file.

This is a detailed step by step guide to using templates to achieve this.

For this article we will be using step 6 of the application, "Templates and Styles":

We will be using the top half of the options, for setting the templates. We won't need to specify stylesheets, as they are specified already within the template.

Template Types

There are 2 template options available; results page and search page.

The first time you are using templates try just setting the search page. The search page template specifies how the actual search.html search page and form will look. So when you link to the search.html search page, the search will look like the rest of your site, instead of a blank page with a search form.

Once you have the search page template working, you can add the results page template. This is used for changing the format of the results page. This is the page that appears when you press the search button and the list of search results appears.

In most cases the same template will be used for both the search page and the results page.

Setting the search page template

1. Press the open file button and select the file that you wish to use as a template:

The best workflow for this is to have a separate file called "template.html" that you use for this purpose. This file would have all the standard formatting and navigation elements of your other pages. However it should not have any specific content.

The template page should be in the same folder as your index home page. This is so that any relative links to images and stylesheets and other pages will be found.

2. We now need to decide where in the template.html page the search engine text box and search button will appear. We need to edit the template.html file to place a special piece of marker HTML code that will be used to identify where the search engine will go. The HTML is <!--SMP-->

If you have not already done so, edit the template and enter this HTML into your file.

If you wish you can edit the file from within your web authoring software or in a text editor such as notepad. Pressing the edit template button will open the file for editing in your standard HTML editor.

The HTML marker must be placed in the HTML of the code, you will need to go to HTML View if you are using a graphical HTML editor such as FrontPage or Dreamweaver. The marker code has been copied to the clipboard so you can paste it into the HTML code.

Save and close the file when done.

3. We can now verify that the template is has the HTML marker and is ready to be used by clicking the verify button:

You should be shown a message confirming that the marker was found.

If not then please check that the marker has been pasted into the HTML of the file and not in design mode. You can check this yourself by opening the page in your browser and viewing the source.

4. Press the Finish button to create the search engine.

You can Preview the search engine but the formatting and stylesheet will probably not look correct as you are viewing the file in a temporary folder, so the template links to images and stylesheets will not be found. However you can use this to check that the search engine is in the correct place and functional.

Save the search engine to the same folder as your other HTML files, usually the same folder as the index home page. Open the file in your browser to check that the search page is functional and looks correct.

Setting the results page template

You will now have created a search.html file that looks like the rest of your site. However, when you search for pages, the results are displayed in an unformatted page. Therefore you need to set the results page template as well.

Simply repeat the steps above for the second results page template. In most cases you will be using the same template. If you have a specific need for a custom results page then you can select a different template.

Notes

The HTML from your templates is embedded in the search.html file. This means that once the search.html file is created you no longer need the template files until you are recreating the search engine.

Therefore:

• template files do not need to be placed on your website.
• changing the templates will not change the search.html file unless you rerun the application and recreate the search.html file.

Support Page