Template Customization
Note: This information refers to AWBS version 2.8.0 and newer.
Contents
Template Information
The user web interface template files are located in two locations.
All files common to all themes are in; templates/common_files directory
All files unique to a theme are in; templates/[theme_directory]
Theme directory files override common_files files if they exist.
For example: If you copy support.php from common_files to your theme directory and edit it, your site will use the support.php file in the theme directory and ignore the support.php file in the common_files directory.
The top.php, bottom.php and header.php are used for all pages of the user web interface.
top.php creates the header area of the web pages
bottom.php creates the footer area of the web pages
header.php handles the <head> section with meta tags and other needed code for the system's functionality.
The optional left.php is included on all non member pages (pages without the left member menu)
Stylesheets
Edit the stylesheet to obtain your desired look for the content area of the site.
The stylesheet can be found at: templates/[your_theme_directory]/css/style.css
If using portal mode, this stylesheet is also used:
templates/[your_theme_directory]/css/portal.css
For the site menu and member menu:
templates/[your_theme_directory]/css/menu.css
For various popup pages throughout the system:
templates/[your_theme_directory]/css/popups/pop.css
- To edit the menu edit;
templates/common_files/group1menu.php
or if you are using portal mode
templates/common_files/group1cpmenu.php
INFO The group1 refers to the user group, if you add user groups you can give them their own custom menu by creating new menu files. Example: You add a new user group and it will be group 2 Create a new menu file named group2menu.php When the group 2 users log in, their menu will change to the group2menu.php file instead of the default group1menu.php file.
- To edit the text on the menu links, edit the includes/language/english/global.php file
- The stylesheet used for the menus is:
templates/[your_theme_directory]/css/menu.css Note: this stylesheet is used for both the site menu and the member area menu
Menu details and example information
This is an individual link, it appears as an item, and this is the "Home" link
each <li></li> tag resembles 1 hyperlink (menu item).
example:
<ul id="menu">
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 4</a></li>
<li><a href="#">Item 5</a></li>
<li><a href="#">Item 7</a></li>
</ul>
This will show the main navigation window like this:
Item 1 | Item 2 | Item 3 | Item4 | Item5 | Item6 | Item7
That will just create our basic menu.
Now, lets see how submenus are created
example:
<ul id="menu">
<li><a href="#">Item 1</a>
<ul>
<li><a href="#">Subitem1</a></li>
<li><a href="#">Subitem2</a></li>
<li><a href="#">Subitem3</a></li>
<li><a href="#">Subitem4</a></li>
</ul>
</li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 4</a></li>
<li><a href="#">Item 5</a></li>
<li><a href="#">Item 7</a></li>
</ul>
This will create the following hierarchy
Item 1 | Item 2 | Item 3 | Item4 | Item5 | Item6 | Item7
Subitem1
Subitem2
Subitem3
Subitem4
Then when you hover on Item 1, it will show the Subitem list.
Now, to create a 3rd level subitem to see this menu: example:
<ul id="menu">
<li>
<a href="#">Item 1</a>
<ul>
<li>
<a href="#">Subitem1</a>
<ul>
<li><a href="#">sub-Subitem1</a></li>
<li><a href="#">sub-Subitem2</a></li>
<li><a href="#">sub-Subitem3</a></li>
<li><a href="#">sub-Subitem4</a></li>
</ul>
</li>
<li><a href="#">Subitem2</a></li>
<li><a href="#">Subitem3</a></li>
<li><a href="#">Subitem4</a></li>
</ul>
</li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Item 4</a></li>
<li><a href="#">Item 5</a></li>
<li><a href="#">Item 7</a></li>
</ul>
Then when you hover on Item 1, it will show the Subitem list, then when you click on Subitem1 it will show the sub-subitem list (2nd level)
The menu used in the member area is; templates/common_files/usermenu.php Edit that file to add/edit/remove links
Edit the templates/[your_theme_directory]/css/menu.css file to change colors/style
Edit the includes/language/english/global.php file to change text on the menu.
Note: If in portal mode this menu is not used. The templates/common_files/group1cpmenu.php is used instead and replaces the main site menu included in the top.php file
Adding new pages
Use the basicphptemplate.php in the root AWBS directory and the basictemplate.php file in the templates/common_files directory to make new pages for your site.
It works like this:
You use the basicphptemplate.php file in your root AWBS directory and call the basictemplate.php that you add your content to and place in your templates/theme directory.
Example: you want a new page called webdesign.php
- Take the basicphptemplate.php file, copy/rename it to webdesign.php, edit the file to call webdesign.php template.
This line: print $template->parse("basictemplate.php");
replace basictemplate.php with webdesign.php
- Now take the basictemplate.php file in your templates/common_files directory, copy it to your theme directory and rename it webdesign.php, edit as desired and you have a new page on your site that matches all the rest.
In the template file, enter your page xhtml content where it shows the remark:<!-- Add your page contents here -->
