Graphical themes, or templates, are managed through the Template Manager Module, which is accessed by clicking on Template Manager from the Main Menu.
Template Manager Main Menu
Using Pre-Installed Templates
To use a pre-installed or custom template for your website, select it from the Base Site Templates drop-down box and click on the “Change Template(s)” button.
To access the Website Builder's Site Template Builder, click on the Template Builder button located at the upper right of the Template Manager Module.
All templates built using the Site Templates Builder will be available for use in the Template Manager Module, and behave exactly like custom templates -- namely because they are custom templates. At any point during your Template creation process, you may preview your current configuration by clicking on the Preview Design button.
- Template Name
- Once saved, your template(s) will appear in the Base Site Templates drop-down box in the Template Manager Module, listed as the Template Name.
- Template Image
- All templates created through the Site Template Manager incorporate a single image. Any images uploaded through the File Upload Module will be available in the Template Image drop-down box.
- Template Style
- Select which of the five layouts you would like to use for your site. Nearly all websites in existence are based upon variations of these Template Styles.
- Foreground Color
- Unless you are using the “Blank” Template Style, the color you select from the Foreground Color drop-down box will determine the color of your Template Style, or shape. This is represented in the Template Style example pictures by the black area.
- Title Color
- The color you select from the Title Color drop-down box will determine the color of your Built-In Template Header (discussed earlier in this chapter).
- Link Color
- By default, all templates created with the Site Template Builder will include a text-based menu system. The color you select from the Link Color drop-down box will determine the color of these text links.
- Background Color
- The color you select from the Background Color drop-down box will dictate the Background Color of your content area. Essentially, this is the color that will appear behind the text content on your website.
- Text Color
- The color that you select form the Text Color drop-down box will determine the default color of the text content on your website. Regardless of which color you select, you can change the color of your text content manually through the Text Editor (See Chapter 8 for more information).
- Hex Values
- This optional feature, which appears next to each of the color definitions, is available so that advanced users can specify the exact color value they would like to use. If you are not familiar with hex color values, just ignore them.
When you are satisfied with your design, click on the Save Design button to save your new template. To use your new template with your website, select it from the Base Site Template drop-down box in the Template Manager Module, and click on the Change Template button. You may also assign your new template to individual pages by using Multiple Template Definitions (discussed earlier in this chapter).
The settings tab is the place where you can manage elements of your site that visitors will see. You can manage your user-swappable images, update your logo and slogan text and your logo image. You can also update your business information.
For a primer on using template boxes in Soholaunch, please visit the Template_Boxes page.
Advanced Coding Techniques
When using custom navigation elements, you will need to know how to code various links. Since the entire site created within the product platform is database-driven, it is necessary to call pages differently than when coding for traditional HTML pages. Theses links must be added inside the template file.
Normal Page Links
Let’s say that you have created a navigation button that should be linked to the “About Us” Page. The following code is what should be used to link your navigation element: index.php?pr=About_Us
This code is case sensitive and must be accurately depicted for proper operation. Notice that all spaces between words in the page names are separated by an underscore. This must be manually coded in place of spaces for the link to work properly.
The actual page name is directly related to the page name created within the “Create Pages” module of the Soholaunch Website Builder. Notice also that the first letter of each word in the page name is capitalized. No matter what you type within the create pages module (you must create the pages within the system even if utilizing custom navigation), the system will automatically capitalize the first letter of each word in a page name and it can only be 22 characters long. Therefore, you must also keep this in mind when coding the custom link. If you are coding before creating pages within the tool, keep the page names fewer than 22 characters in length.
NOTE: Because your site is database driven, you will always call the “index.php” file when linking to normal site pages.
For more information on custom templates, please visit the Custom_Templates page.