The MUSC Bar
The MUSC Bar is a single, thin bar that resides at the top of web pages at MUSC. This bar is meant to provide access to some of the more important locations at MUSC from any web page on campus. This allows the user to not "get lost".
Contents
Understanding the MUSC Bar
Consult the following two pages for general information about the MUSC Bar and 2-dimensional website strategy:
What is the MUSC Bar?
In the top left corner is the MUSC logo which can be clicked to take you to the main MUSC web page. Links to various important cognitive sections within MUSC are lined up along the center of the bar, and the comprehensive search feature is located in the top right hand corner.
The source code for the MUSC Bar is located in a centralized location on the main MUSC webserver at: http://www.musc.edu/include/
All instances of the MUSC Bar are pulled from that source code. Sites on the main webserver simply include the MUSC Bar file from its source location. Sites on other machines use a Perl script that will use the GET function to view the code of the MUSC Bar on the main MUSC webserver. Then files on the other machines will access the MUSC Bar by including this Perl file.
The good part about having a centralized location for the MUSC Bar is that when a change is required, web sites that feature the MUSC Bar do not have to make any changes at all. When the code is changed on the parent file all instances of the MUSC Bar will inherit the changes automatically.
How to create a 2-dimensional web page
Here's an example of a 2-dimensional web page: /TwoDPage
Adding the MUSC Bar to your webpages
If you are not the administrator of the machine where your webpages are stored, consult one of the following pages:
How to add the bar if your website is on people.musc.edu (personal web pages)
Pages on people.musc.edu are already configured to allow inclusion of the MUSC Bar. To add the bar to your currently existing web pages, follow these steps.
Step 1: Add an include statement to your web page
To include the MUSC Bar on your page, imply type the following line of code at the top of your page, right after the <body> tag:
<!--#include virtual="/include/muscbar.inc" -->
You should also adjust your body tag to place the MUSC Bar in the top right hand corner of the page. If you do not include this line the MUSC Bar will "float" on the page and not fit snugly against the borders of your web page. Simply modify your body tag to include the following tags, which will work with most browsers:
<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
Step 2: Modify the permissions of your page
Go to a unix prompt and type: chmod 744 (your page name). This will modify the page so that the include statement will be executable.
In order to get a unix prompt to do this, if you are using an on-campus machine go to your browser window. In the spot where you would normally type the URL of a web page you would like to go to, instead type:
ssh atrium.musc.edu
Then, log on using your MNA name and password (the name and password you use to check your email). This will take you to a unix prompt. From there, cd to the public_html directory which is where your personal pages are kept.
Step 3: Rename your file with the extension .shtml
Files with the extension .html (the normal extension for web pages) will not allow the inclusion of the MUSC Bar. In order to include the MUSC Bar on your web pages they must be renamed with the .shtml extension. So, if your file is called 'index.html', rename it to 'index.shtml'.
Now reload your web page and the MUSC Bar should now appear at the top of the page.
How to add the bar If your website is on atrium.musc.edu (departmental web pages)
Pages on atrium.musc.edu are already configured to allow inclusion of the MUSC Bar. To add the bar to your currently existing web pages, follow these steps.
Step 1: Add an include statement to your web page
To include the MUSC Bar on your page, imply type the following line of code at the top of your page, right after the <body> tag:
<!--#include virtual="/include/muscbar.inc" -->
You should also adjust your body tag to place the MUSC Bar in the top right hand corner of the page. If you do not include this line the MUSC Bar will "float" on the page and not fit snugly against the borders of your web page. Simply modify your body tag to include the following tags, which will work with most browsers:
<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
Step 2: Modify the permissions of your page
Go to a unix prompt and type: chmod 744 (your page name). This will modify the page so that the include statement will be executable.
In order to get a unix prompt to do this, if you are using an on-campus machine go to your browser window. In the spot where you would normally type the URL of a web page you would like to go to, instead type:
telnet://atrium.musc.edu
Then, log on using your MNA name and password (the name and password you use to check your email). This will take you to a unix prompt.
Step 3: Rename your file with the extension .shtml (see below for an alternative)
Ordinarily (see below for an exception), files with the extension .html (the normal extension for web pages) will not allow the inclusion of the MUSC Bar. In order to include the MUSC Bar on your web pages you may rename your pages with the .shtml extension. So, if your file is called 'index.html', you might rename it to 'index.shtml'. After doing so, load your new .shtml pages and the MUSC Bar should appear.
Alternative Step 3: Enable the X-Bit Hack on your directory
If you do not want to rename your pages to .shtml, you may enable the X-Bit Hack on your directory. This will mean that .html pages will be able to process your include directive. In the directory that includes your file, type:
pico .htaccess
Then, add the following line of code:
XBitHack On
Type Ctrl-X to exit, and type 'y' to save the changes.
Now reload your web page and the MUSC Bar should now appear at the top of the page.
Configuring the MUSC Bar on a webserver
If you are the administrator of the machine where your webpages are stored, consult one of the following pages:
How to configure the MUSC Bar on a Linux webserver
The following code is to be used to set up the MUSC Bar on your personal or departmental webserver.
Step 1: Place a Perl script on your machine
Since the MUSC Bar code is found in one location, the first thing you need to do to use the MUSC Bar on your web pages is to place a Perl script on your machine that accesses the MUSC Bar from its parent location.
In order for this to work your machine must support the GET command. The GET command is part of the LWP Library for World Wide Web access using Perl. In order for GET to work on your machine you will need to install the LWP library.
In your /cgi-bin directory, create a file called "muscbar.cgi" that consists of the following code:
#!/usr/bin/perl print "Content-type: text/html\n\n"; print `GET http://www.musc.edu/include/muscbar.inc`;
A better script (avoids the extra shell caused by the backticks):
#!/usr/bin/perl
use LWP::Simple;
print "Content-type: text/html\n\n";
getprint('http://www.musc.edu/include/muscbar.inc');
Step 2: Make sure server side includes work on your webserver
First, make sure that includes are loadable on your server. Look for a line that looks something like this and make sure that it has not been commented out:
LoadModule includes_module /usr/lib/apache/1.3/mod_include.so
You will eventually add a one-line server side include on the web pages where you would like the MUSC Bar to appear. But first, you will need to enable server side includes on your webserver. Make sure that you add these directives for your html files to be processed by your machine. This is how to accomplish this.
Uncomment out the following "AddType" directive in the ~/www/conf/httpd.conf file on your Virtual Server to indicate that all .shtml, .html, .htm and .inc files will be parsed by the web server for server side includes:
AddType text/html .shtml AddHandler server-parsed .shtml .html .htm .inc
After this is done, find a command line and type: restart_apache
If all is done correctly your machine should now accept server side includes. One thing to note: If your machine was configured before December 8th, 1998, go here for information on how to set up server side includes on your machine, or better yet, update!
Step 3: Add a one-line include statement to your web pages
Now that server side includes work on your webserver, you may add a one-line include statement to your web pages. First you will need to modify your body tag to set the margins of your webpage to zero. The reason for this is that if you don't, the MUSC Bar will "float" on your page. You want to set the margins of the page to zero so that the MUSC Bar is snug against the top, left and right borders of your web pages. Add the following to your body tag. These commands will set the margins to zero for most browsers:
<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
Next, add the following line right underneath your web page's body tag. Wherever in your /cgi-bin directory you placed your "muscbar.cgi" file, that is what you will access.
<!--#include virtual="/cgi-bin/muscbar.cgi" -->
Step 4: Modify the permissions of your page
Go to a unix prompt and type: chmod 744 (your page name). This will modify the page so that the include statement will be executable.
Now reload your page and the MUSC Bar should appear.
How to configure the MUSC Bar on a Macintosh webserver
The following code is to be used to set up the MUSC Bar on your personal or departmental webserver.
Step 1: Place a Perl script on your machine
Since the MUSC Bar code is found in one location, the first thing you need to do to use the MUSC Bar on your web pages is to place a Perl script on your Mac webserver that accesses the MUSC Bar from its parent location.
In order for this to work your machine must support the GET command. The GET command is part of the LWP Library for World Wide Web access using Perl. In order for GET to work on your machine you will need to install the LWP library. It should already be available on your Mac.
In your /Library/WEB/CGI-Executables directory, create a file called "muscbar.cgi" that consists of the following code:
#!/usr/bin/perl print "Content-type: text/html\n\n"; print `GET http://www.musc.edu/include/muscbar.inc`;
A better script (avoids the extra shell caused by the backticks):
#!/usr/bin/perl
use LWP::Simple;
print "Content-type: text/html\n\n";
getprint('http://www.musc.edu/include/muscbar.inc');
Step 2: Make sure server side includes work on your webserver
You will eventually add a one-line server side include on the web pages where you would like the MUSC Bar to appear. But first, you will need to enable server side includes on your webserver. Make sure that you add these directives for your html files to be processed by your machine. This is how to accomplish this.
Uncomment out the following "AddType" directive in the ~/www/conf/httpd.conf file on your Virtual Server to indicate that all .shtml, .html, .htm and .inc files will be parsed by the web server for server side includes:
AddType text/html .shtml AddHandler server-parsed .shtml .html .htm .inc
After this is done, restart your webserver.
If all is done correctly your Mac should now accept server side includes.
Step 3: Add a one-line include statement to your web pages
Now that server side includes work on your webserver, you may add a one-line include statement to your web pages. First you will need to modify your body tag to set the margins of your webpage to zero. The reason for this is that if you don't, the MUSC Bar will "float" on your page. You want to set the margins of the page to zero so that the MUSC Bar is snug against the top, left and right borders of your web pages. Add the following to your body tag. These commands will set the margins to zero for most browsers:
<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
Next, add the following line right underneath your web page's body tag. Wherever in your /cgi-bin directory you placed your "muscbar.cgi" file, that is what you will access.
<!--#include virtual="/cgi-bin/muscbar.cgi" -->
Step 4: Modify the permissions of your page
Go to a unix prompt and type: chmod 744 (your page name). This will modify the page so that the include statement will be executable.
Now reload your page and the MUSC Bar should appear.
Standards compliance
For an unofficial XHTML-compliant version, replace /include/muscbar.inc with /include/xhtml/muscbar.inc. You will also have to include or @import the stylesheet from /include/xhtml/muscbar.css.
Example
<style media="all" type="text/css">@import "http://www.musc.edu/include/xhtml/muscbar.css";</style>
The Next Generation
See http://www.musc.edu/include/stock2005/
To create a simple web page using all the default elements:
<!--#include virtual="http://www.musc.edu/include/stock2005/header.shtml" --> Your content here! <!--#include virtual="http://www.musc.edu/include/stock2005/footer.shtml" -->
And you're done!
For more control, you will have to include the individual elements:
<html>
<head>
<title><!--#echo var="title" --></title>
<script language="javascript" src="/include/stock2005/muscbar.js"></script>
<link rel="stylesheet" type="text/css" href="/include/stock2005/css/musc.css" />
<link rel="stylesheet" type="text/css" href="/include/stock2005/css/muscbar.css" />
<link rel="stylesheet" type="text/css" href="/include/stock2005/css/musclogo.css" />
<link rel="stylesheet" type="text/css" href="/include/stock2005/css/leftmenu.css" />
<link rel="stylesheet" type="text/css" href="/include/stock2005/css/addr.css" />
</head>
<body>
<!--#include virtual="/include/stock2005/muscbar.html" -->
<!--#include virtual="/include/stock2005/musclogo.html" -->
<table id="maintable" cellspacing="0">
<tr>
<td id="leftmenu">
<!--#include virtual="/include/stock2005/leftmenu.html" -->
</td>
<td id="content">
Your content here!
</td>
</tr>
</table>
<!--#include virtual="/include/stock2005/addr.html" -->
</body>
</html>
This way you can add CSS links in the header, replace the left menu, move the elements around, etc.
Be sure to use the appropriate paths. The examples above assume your HTML pages live on http://www.musc.edu/ . If not, you will ahve to give the full URL in the includes.