This template was created using the Twitter Bootstrap framework (version 2.3.2). This version of Bootstrap has been further customized to better suit the needs of Troy University faculty. However, further customization is available and all necessary files have been included. Additional documentation regarding how to customize and use more features can be found in the Twitter Bootstrap Website.
This framework offers built-in support for most mobile devices. In addition, it will scale according to the desktop screen resolution (windows size) of a visitor's Web browser.
All pages in this template adhere to HTML5 specifications. Please note that there are differences between older versions of HTML/XHTML and HTML5 tags and syntax. For example:
HTML/XHTML
<img src="#" alt="Image Title" />
<br />
HTML5
<img src="#" alt="Image Title" >
<br >
There are several other differences between HTML5 and older versions. Though more similar, there are also differences between HTML4 and HTML5.
The following folders have been included in this template:
The assets folder includes some template items and is also the area that we recommend you use for placing photos, documents, and other resource files for use in a Web page. Though it is recommended that you do not delete any files that were originally present in this folder and subfolders, you are not required to organize your new files within this area. Keeping your files organized and outside of the main site folder will make it easier to maintain the site in the future.
The custom.css file is where we recommend that you add any custom styles. This file is automatically linked within ever page via the Dreamweaver template. Because this file is also called after the main Bootstrap CSS file it can also be used to override default Bootstrap styles.
We recommend against making style changes within this file but instead use the custom.css file in the main assets folder to override default Bootstrap styles. However, in order to override existing styles you will need to browse the contents of this file in order to determine what tags, classes, or IDs to override using custom.css.
Note: If using a non-Dreamweaver version of the template then you will not have the following two folders/files.
Dreamweaver requires that template files be included within a folder named "templates". Renaming this folder will prevent Dreamweaver templates from working properly. Any new templates (DWT files) should be stored in this folder.
This file controls the shared elements that are used in all pages linked to the template. For example, if you want to modify a navigation menu, you would need to modify this file. Additional elements that appear on all pages should be included in the template file.
Using Dreamweaver:
To create a new page in Dreamweaver go to File -> New and select the Page from Template tab. In the column on the right select template and then the Create button. This will create a blank page that has not been saved. Immediately save the page into the root (top-most level) of the local files and give it a short, simple name (ex. filename.html).
Each new page will require some customization such as the page title, header, and a variable used for setting the current menu option.
Without Dreamweaver:
Simply open an existing page, save it under a new filename, and then make the appropriate modifications.
All new styles and style modifications must be added to the following file:
It is not recommedned to modify the bootstrap.css or bootstrap.min.css files. This will make it easier to upgrade to newer versions of Twitter Bootstrap in the future. The custom.css file must be loaded after the boostrap.min.css file. The bootstrap.css file is only provided for reference. The "minified" version is what should remain linked from pages.
When a user clicks a link on a navigation menu the navigation menu will not automatically change the currently highlighted link unless the following piece of code is added to the editable region in the header of a Web page. Note that in this example "Contact Information" must be changed to match the link for the page you want to highlight:
<script>$(document).ready(function(){$('.nav a:contains("Home")').parent().removeClass('active');$('.nav a:contains("Contact Information")').parent().addClass('active');});</script>
This template includes a disclaimer statement in the footer, which must be included in each page. Please visit Section 801.8.3 of the ePolicy for more information.