 |
|
|
|
|
|
||
      |
|
||
 |
 |
|
|
|
|||
 |
| Web Style Guide |
| IRT Information |
SSIs are snippets of HTML (or any code, really) saved as files on the server. A special comment tag is used to pull the snippet into a given page.
Example: <!--#include virtual="includes/navigation-left.htm" -->
As each page is called by the browser, the server pulls the included snippet, parses it into the flow of page code, and serves the entire page as if all the code elements were present in the page's file. The effect is totally transparent to the user. And the maintainer (that's you) only needs to modify the single file to have the change appear on every page that uses the SSI.
Where SSIs are Used:
-
Each page's header, an SSI located within the central Templates directory for the entire School of Medicine site; almost always referenced by root-relative URL, and locked from edit within the page
Example from this page: /Templates/irt-web/header.htm -
BreadCrumbs links, just under the header; typically the file is located in a directory parallel to the page file, called "includes;" usually referenced using document-relative URL
Example from this page: includes/breadcrumbs-main.htm -
Left navigation links are also in an SSI; typically the file is located in a directory parallel to the page file, called "includes;" usually referenced using document-relative URL
Example from this page: includes/navigation-left.htm
Using SSIs
Because SSIs are used at multiple levels of a site, links within SSIs should always use absolute URLs, i.e. "http://med.stanford.edu/pathto/yoursite/"
By convention, include files have the extension ".htm" and page files use ".html." Avoid other extensions for include files, which may prevent you from previewing them properly in Dreamweaver or Contribute.
If creating new SSIs, remember that HTML pages can only have one instance of some tags, like <HTML> and <BODY>, so you should not have these tags on both your SSI and your main page. If Dreamweaver starts correcting your page code unexpectedly, it may be a sign that your SSI also contains a <BODY> tag, perhaps added by Dreamweaver.
Although not technically SSIs, each page also references other external files, including the master stylesheets -- Example: /Templates/som_stylesheet.css -- and JavaScript code used to populate the drop-down menus. Example: /Templates/school/menus.js
