When converting a template design into HTML code, pay special attention to the structure of the directories. The sample of a correct structure is given below:
Template
Themes
Color1
Menus
Menu1
Menu2
Menu3
Headers
Header1
Header2
Header3
Images
Color2
Menus
Menu1
Menu2
Menu3
Headers
Header1
Header2
Header3
Images
Color3
Menus
Menu1
Menu2
Menu3
Headers
Header1
Header2
Header3
Images
The Template directory is the root template directory.
The Themes directory contains all color themes (Color1, Color2, Color3). By default, there are three color themes, but you can vary this number. Also, you can rename the color themes (for example, red, blue, green).
The Menus directory is divided into the subdirectories Menu1, Menu2, Menu3. Similar to color themes, there could be one or more menu themes. These directories contain the graphic files with the menu items images (usually, these are active and inactive bullets).
The Headers directory is divided into the subdirectories Header1, Header2, Header3. By default, there are three variants of design, but this number is not fixed. These directories contain the graphic files with the headers images.
The Images directory contains the graphic files with the images specific to a corresponding color theme. The default logo template is stored in this directory under the name of logo.gif. (it should be in GIF format).
The color theme directory contains the styles.css file. Styles.css is a file containing CSS styles of a template. It should contain only two selectors: pageContent and pageContent a.
Example:
pageContent { font-size: 8pt; font-family: Tahoma, sans-serif; color: #818181; }
pageContent a { font-size: 8pt; font-family: Tahoma, sans-serif; color: #818181; }
This class must be applied to the content area.