Documentation - Customizing Graphic Elements

Customizing Graphic Elements

We produce our graphics using Adobe Fireworks (natively produced as 32-bit .PNG format), but also publish each original as a layered PSD.


LogoEach of our templates has a main logo file (logo.png) which can be found in the images/ directory. To customize this file, you will only need to open the source graphic file we provide (usually named 'logo_SOURCE.png'), customize the graphics, and export a 32-bit transparent PNG called 'logo.png'. You then overwrite the existing logo.png with your new one. In some cases, it may be necessary to make a bigger or smaller image, and so the corresponding css will also need to be manipulated. The pertinent css can be found in template_css.css (Search 'logo')

The sample below shows (in bold) which parts of the css might need to be changed to match your new file's dimensions and any positional changes:


#logo_frame {position:relative;height:0px;width:100%;}

#logo { height:90px; width:240px; background: url(../images/logo.png) no-repeat;position:absolute; top:0px; right:-17px;}