Website Structure Overview - Tau-Beta-Pi-MIT/website GitHub Wiki

Website Structure

At a high level, this website uses SSI, HTML, and CSS. We'll discuss the specifics of how SSI and CSS are used to augment the repository's HTML.

Server Side Includes (SSI)

This website uses the server side includes (SSI) scripting language for formatting and repeating different blocks of html. Code used for each web page (e.g. header, footer, navigation, home navigation) is contained in the includes/ directory. The contents of these files can be added to a separate .shtml web page through the following command:

<!--#include virtual="includes/home-nav.htm"-->

(In this case, the above command would include the code page for home-nav.htm in the new web page.) If you plan on creating a new web page with a header, navigation bar, and footer, you should use the following piece of code as a template:

<!--#include virtual="includes/header.htm"-->
<!--#include virtual="includes/home-nav.htm"-->

<!--BODY OF CODE GOES HERE-->

<!--#include virtual="includes/footer.htm"-->
<!--#include virtual="includes/bottom.htm"-->

These commands are parsed using the Python SSI server files in this repository. It is strongly advised NOT to edit these SSI server files.

CSS

CSS is also used throughout this codebase to format objects, text, and images. The main sources of CSS can be found in stylesheets/app.css and stylesheets/foundation.css.

Web Page Directories

The contents of the website's home page are given by index.shmtl. All other main navigation files (e.g. web pages) can be found in the same directory as index.shmtl. Files used as components of a web page (e.g. careerfair.shtml) can be found in the includes/pages/ directory.