Resources - Zoom Search Engine Tutorials - Applying CSS to Search Results
This section is just to give you a brief introduction in to applying CSS to Zoom, it is in no way a CSS lesson.
A full list of the classes used to identify the various sections of the Zoom layout can be viewed on page 93 of the Zoom user guide which can be downloaded from:
http://www.wrensoft.com/zoom/usersguide.html
Or you can just look at the source code of your search results page in order to identify which area you would like to modify. Using a source viewer such as HTML Beauty makes this really easy to do as the code is highlighted, making it a lot easier to view than the normal notepad window that opens when you view source in IE.
Tip:
To view the source code of your search results page open the page in IE then go to 'View' on the menu bar and chose 'Source' the code that the template is based on is then displayed in a notepad window, or a Html Beauty window if you have installed it. (In order to view source the search engine files must be uploaded to your server, you can then view the page live)
Here are the CSS styles that I applied to my search results page:
In order to apply a different text size from the main content of my website and also a different link rollover, I wrapped the <!--ZOOMSEARCH--> on the template page in a div with an id of zoomResults. This then allowed me to specify exact requirements for how the font and links will appear for all content within that div.
The image below shows the areas that I have applied the above CSS to:
Resources - Zoom Search Engine Tutorials - Applying CSS to Search Results