Exercise 3: Change logo/colors

Change the logo and colors

Introduction:

XTF provides implementers full control over the look and feel of their applications by driving that presentation from a “brand” stylesheet that brings together branding elements from graphics and logos to CSS references. This task will provide a taste of this by walking through the steps of changing the logo and some colors.

Demonstration:

Steps:

  1. Download a logo image from the web (try http://www.wpclipart.com/browse.htm or http://socsci.colorado.edu/GIF/), or use any small image file, and put it in this directory:

    %XTF_HOME%\icons\default

  2. Using your XML editor:

    a) Open: %XTF_HOME%\brand\default.xml

    b) Find the line that calls out “xtf_logo.gif”, and replace it with the name of your new image.

    c) Save the file.

  3. Refresh the search page in your browser to see the new icon.
  4. Using your XML editor:

    a) Open: %XTF_HOME%\css\default\results.css

    b) Find the section “div.resultsHeader”. Change “background-color” to something distinctive, like pure green (#00FF00).

    c) Save the file.

  5. Refresh the search page in your browser to see the new color.

Next tutorial step:

Exercise 4: Increase significance of titles in ranking hits