Creating a Webpage using the Long Faculty Template

This tutorial assumes the following:

that you are using NVU free web editing software to edit these pages. If you wish to edit the templates using a different software package you can contact your Academic Computing Liaisons for training or assistance.
that you have downloaded the templates from the website
that the downloaded folder called 508_Faculty_Templates is located on your computer's desktop

Editing the Long Faculty Template

Open Nvu, if it is not already open.
From the File menu choose Open, or click the Open icon from the icon bar
From the 508_Faculty_Templates folder go to 508_Long > index.htm
Click Open
The template below will appear in the right window
IMPORTANT NOTE: When making the text editing changes described below take care to highlight ONLY the text and try to avoid highlighting and spaces that may exist before or after the text. Selecting these spaces can sometimes delete html tags that exist behind the scenes and will remove important formatting.

Changing the Look of your Webpage

This template was create using a Cascading Style Sheets. This means that all the formatting for the document (font size, color, images, etc.) is housed in a seperate document. This allows you to change the look of your webpage easily. The templates come with three different stylesheets to choose from and changing the style is very easy.

Choose the style you want to apply to your webpage from the images below and write down the name of the style.

Style title - css_1.css Style title - css_2.css Style title - css_3.css
From the menu bar in NVU choose Tools > CSS Editor
Under Sheets and Rules on the left side of the window a stylesheet name will be listed.
Highlight the stylesheet name and click Remove
Now click on the button entitled Link elt. The right side of the window will change
Next to URL click Choose File
From the Select a CSS File window go to Desktop > 508Templates > 508_Short and choose the .css file you selected in step one. (ex. css_3.css) then click Open
From the URL line you MUST remove everything before the filename or the link will not work properly. Using your mouse, highlight and delete everything before css_#.css (ex. file:///c:/DocumentsandSettings/benignim/Desktop/508_Faculty_Templates/508_Short/)
Now click Create Stylesheet
Click Close to close the window
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Edit Name and Title

Using your mouse, highlight the name area (Type your name) DO NOT HIT THE DELETE KEY. Just type your name and it will replace the highlighted text.
Repeat this process over the text that reads Type your title. If it doesn't look right, click Edit > Undo and try again. Make sure not to highlight the area around the text, only the text itself.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Edit Office Hours

Using your mouse, highlight the time next to Monday: (note: don't be alarmed if Nvu turns the area around the text black. That is its way of indicating the area to be edited)
Type in the new time and it will replace the highlighted text.
Repeat for the remaining days.
If you do not have office hours on that day the highlight the entire row (Monday: time) and press the Delete key on your keyboard until the text and bullet go away. You may need to press the Delete key twice.
If you wish to add a line, place your cursor (mouse) at the end of the previous line and press the Enter or Return key on your keyboard. This should make a new bulletted line.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Edit Vita

First, make a copy of your vita and place it in the 508_Long folder on your desktop (Desktop > 508Templates > 508_Long). Your file must be in this folder before you can make the link.
After you have copied your vita into the 508 folder, go back into NVU and, using your mouse, highlight the text "View a copy of my vita in PDF". Whatever you highlight will become the live linked text.
From the icon bar at the top of the window click Link. You can also click Insert > Link.
From the next window click Choose File
Choose your vita from the 508_Long folder and click Open.
The name of your file will appear in the text box under Link Location. Now click OK
If you need to change a link you created you follow the exact same steps and the new file you choose will replace the old file.
Note: If your vita is NOT a PDF (Adobe Acrobat file format) then replace the text PDF with the appropriate text. For example, if you post a Word document then you can type View a copy of my vita in Word format. If you vita is a webpage then you can leave it as View a copy of my vita.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Edit Biographical

If you wish to change the name of the section title, highlight the section name and type in the new section name. IMPORTANT - make sure to change the corresponding name in the navigation area.
Look at the list of subcategories under Biographical and determine which ones you want to keep.

If you wish to delete a subcategory highlight the entire row and press the Delete key on your keyboard until the text and bullet go away. You may need to press Delete twice.

Each of these subcategories link to another webpage. We will edit these later.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Edit Academic Activities

If you wish to change the name of the section title, highlight the section name and type in the new section name. IMPORTANT - make sure to change the corresponding name in the navigation area.
Look at the list of subcategories under Academic Activities and determine which ones you want to keep.

If you wish to delete a subcategory highlight the entire row and press the Delete key on your keyboard until the text and bullet go away. You may need to press Delete twice.

Each of these subcategories link to another webpage. We will edit these later.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Editing Publications and Memberships

If you wish to change the name of the section title, highlight the section name and type in the new section name. IMPORTANT - make sure to change the corresponding name in the navigation area.
Using your mouse, highlight the paragraph under Publications and Memberships (note: don't be alarmed if Nvu turns the area around the text black. That is its way of indicating the area to be edited). DO NOT HIT THE DELETE KEY
Type in the publication or membership information. You can also paste existing text from a word processor or existing webpage.
If you wish to delete a bulletted area highlight the entire paragraph and press the Delete key on your keyboard until the text and bullet go away. You may need to press Delete twice.
If you wish to add a bullet, place your cursor (mouse) at the end of the previous line and press the Enter or Return key on your keyboard. This should make a new bulletted line.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Editing Links

Deleting an existing link

If you wish to delete a link highlight the entire link and press the Delete key on your keyboard until the text and bullet go away. You may need to press Delete twice.

Adding a new link

If you wish to add a link, place your cursor (mouse) at the end of the previous line and press the Enter or Return key on your keyboard. This should make a new bulletted line.
Type the name of the link such as College of Charleston or Google Search.
To make this text a live link, highlight the text you just typed.
From the icon bar at the top of the window click Link. You can also click Insert > Link.
In the text box under Link Location type in the address of the website you wish to link to. Note: You must type in the http:// before the address in order for it to work. (ex. http://www.cofc.edu)
Click OK

Changing an existing link

If you need to change a link you created you follow the exact same steps and the new address you type will replace the old file.

Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Editing the Contact Information

Using your mouse, highlight the text Type your department here. DO NOT HIT THE DELETE KEY. Just type your department name and it will replace the highlighted text.
Next, create a live link from your department name to the department website.

Using your mouse, highlight your department name.
From the icon bar at the top of the window click Link. You can also click Insert > Link.
In the text box under Link Location type in the address of your departmental website. Note: You must type in the http:// before the address in order for it to work. (ex. http://www.cofc.edu/schoolofeducation)
Click OK

To change your office address, highlight the text type your office address DO NOT HIT THE DELETE KEY. Just type your building and room number and it will replace the highlighted text.
To change your phone, highlight the text #### DO NOT HIT THE DELETE KEY. Just type your phone extension and it will replace the highlighted text.
Repeat these steps for the fax number
To change your email, highlight the text youremail. DO NOT HIT THE DELETE KEY. Just type your email and it will replace the highlighted text.
Next, make your email text a live email address
- Using your mouse, highlight your whole email address.
- From the icon bar at the top of the window click Link. You can also click Insert > Link.
- In the text box under Link Location type in your email address. (ex. janedoe@cofc.edu)
- Make sure The above is an email address is checked.
- Click OK
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Adding a photo

If you want to add a photo to personalize your webpage, the easist place to add one is in place of the CofC seal.

First, make a copy of the image you want to use (.jpg or .gif) and place it in the 508_Long folder on your desktop (Desktop > 508Templates > 508_Long). Your files must be in this folder before you can add the picture.
Double-click on the CofC seal under Contact Information. A new window will open.
Under Image Location click Choose File
Choose the image from the 508_Long folder then click Open
Next to Alternative Text type in a short description of the picture (ex. headshot of me)
The next step is to resize your picture so that it fits in the space provided. The original CofC seal was 160 pixels wide so it's a good idea to make your image that wide as well.
- Click Advanced Edit
- From the Attribute dropdown menu, choose Width
- In the Value text box type 160
- Click OK
- Click OK again to close the window
Your image should now be there and the proper size.
To add another photo go to Insert > Image then follow steps 3 through 8.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Editing the Biographical Information Webpage

Open Nvu, if it is not already open.
From the File menu choose Open, or click the Open icon from the icon bar
From the 508_Faculty_Templates folder go to 508_Long > bio.htm
Click Open
The template below will appear in the right window
IMPORTANT NOTE: When making the text editing changes described below take care to highlight ONLY the text and try to avoid highlighting and spaces that may exist before or after the text. Selecting these spaces can sometimes delete html tags that exist behind the scenes and will remove important formatting.

Changing the Look of your Webpage

Choose the style you want to apply to your webpage from the images below and write down the name of the style.
From the menu bar in NVU choose Tools > CSS Editor
Under Sheets and Rules on the left side of the window a stylesheet name will be listed.
Highlight the stylesheet name and click Remove
Now click on the button entitled Link elt. The right side of the window will change
Next to URL click Choose File
From the Select a CSS File window go to Desktop > 508Templates > 508_Long and choose the .css file you selected in step one. (ex. newcss3.css) then click Open
Now click Create Stylesheet
Click Close to close the window
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Edit Name and Title

Using your mouse, highlight the name area (Type your name) DO NOT HIT THE DELETE KEY. Just type your name and it will replace the highlighted text.
Repeat this process over the text that reads Type your title. If it doesn't look right, click Edit > Undo and try again. Make sure not to highlight the area around the text, only the text itself.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Edit the Information

If you wish to change the name of a section title, highlight the section name and type in the new section name.
Using your mouse, highlight the paragraph under About Me or Biographical Information (note: don't be alarmed if Nvu turns the area around the text black). DO NOT HIT THE DELETE KEY
Type in the biographical information. You can also paste existing text from a word processor or existing webpage.
If you wish to delete an area highlight the entire paragraph and title and press the Delete key on your keyboard until the text and title go away. You may need to press Delete twice.
Repeat steps 1-4 for all the sections on the page.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.
Close the document by choose File > Close.

Editing the Academic Activities Webpage

Open Nvu, if it is not already open.
From the File menu choose Open, or click the Open icon from the icon bar
From the 508_Faculty_Templates folder go to 508_Long > acad.htm
Click Open
The template below will appear in the right window
IMPORTANT NOTE: When making the text editing changes described below take care to highlight ONLY the text and try to avoid highlighting and spaces that may exist before or after the text. Selecting these spaces can sometimes delete html tags that exist behind the scenes and will remove important formatting.

Changing the Look of your Webpage

Choose the style you want to apply to your webpage from the images below and write down the name of the style.
From the menu bar in NVU choose Tools > CSS Editor
Under Sheets and Rules on the left side of the window a stylesheet name will be listed.
Highlight the stylesheet name and click Remove
Now click on the button entitled Link elt. The right side of the window will change
Next to URL click Choose File
From the Select a CSS File window go to Desktop > 508Templates > 508_Long and choose the .css file you selected in step one. (ex. newcss3.css) then click Open
Now click Create Stylesheet
Click Close to close the window
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Edit Name and Title

Using your mouse, highlight the name area (Type your name) DO NOT HIT THE DELETE KEY. Just type your name and it will replace the highlighted text.
Repeat this process over the text that reads Type your title. If it doesn't look right, click Edit > Undo and try again. Make sure not to highlight the area around the text, only the text itself.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.

Edit the Information

If you wish to change the name of a section title, highlight the section name and type in the new section name.
If you wish to delete an area highlight the entire paragraph and title and press the Delete key on your keyboard until the text and title go away. You may need to press Delete twice.

Syllabi

The intent of this area is to highlight the courses you are teaching by semester and to link to the course's corresponding syllabus.

If you wish to change the name of the section title, highlight the section name and type in the new section name. IMPORTANT - make sure to change the corresponding name in the navigation area.
Using your mouse, highlight the text "type in the term and year here (Fall 2005)". DO NOT HIT THE DELETE KEY. Just type the term and year (i.e. Fall 2006) and it will replace the highlighted text.
Next, using your mouse, highlight the text "EDFS ### ### - type class name here". As before do not hit the delete key. Type in your course number and section and the course name. Note: If you don't want to type in both you can only do one. It's up to you.
Repeat this process for all the classes you are teaching this semester.
If you wish to delete a line highlight the entire row and press the Delete key on your keyboard until the text and bullet go away. You may need to press Delete twice.
If you wish to add a line, place your cursor (mouse) at the end of the previous line and press the Enter or Return key on your keyboard. This should make a new bulletted line.

Adding Links to your Syllabi

This section will discuss how to make the class names links that will take the user to your syllabi.

First, make copies of your syllabi and place them in the 508_Long folder on your desktop (Desktop > 508Templates > 508_Long). Your files must be in this folder before you can make the link.
After you have copied your syllabi into the 508 folder, go back into NVU and, using your mouse, highlight the name of the first class in the list. Whatever you highlight will become the live linked text.
From the icon bar at the top of the window click Link. You can also click Insert > Link.
From the next window click Choose File
Choose the course syllabus from the 508_Long folder and click Open.
The name of your file will appear in the text box under Link Location. Now click OK
Repeat for the other classes.
If you need to change a link you created you follow the exact same steps and the new file you choose will replace the old file.
Note: It is good web etiquette to inform your viewers if you are sending them to a file that is not a webpage. Therefore if you post a syllabus that is in Word format or Adobe Acrobat PDF you should indicate that. An example would be:
- BIOL 102 001 - Elements of Biology (.doc)
- BIOL 102 002 - Elements of Biology (.pdf)

Class Schedule

If you wish to change the name of the section title, highlight the section name and type in the new section name. IMPORTANT - make sure to change the corresponding name in the navigation area.
Using your mouse, highlight the text "EDFS ### ###". As before do not hit the delete key. Type in your course number and section and the course name.
Next, highlight the text "Monday, Wednesday, Friday 8:00 - 8:50" and replace it with the date/time of the class.
Repeat this process for all the classes you are teaching this semester.
If you wish to delete a line highlight the entire row and press the Delete key on your keyboard until the text and bullet go away. You may need to press Delete twice.
If you wish to add a line, place your cursor (mouse) at the end of the previous line and press the Enter or Return key on your keyboard. This should make a new bulletted line.
If you wish to delete an area highlight the entire paragraph and title and press the Delete key on your keyboard until the text and title go away. You may need to press Delete twice.

Student Research Projects

If you wish to change the name of a section title, highlight the section name and type in the new section name.
Using your mouse, highlight the paragraph under Student Research Activities (note: don't be alarmed if Nvu turns the area around the text black). DO NOT HIT THE DELETE KEY
Type in the appropriate information. You can also paste existing text from a word processor or existing webpage.
If you wish to delete an area highlight the entire paragraph and title and press the Delete key on your keyboard until the text and title go away. You may need to press Delete twice.
Save your document by clicking on the Save icon in the Icon Bar or by choosing File > Save.
Close the document by choose File > Close.

Publishing your new webpage to Spinner

Macintosh

Due to limitiations inside NVU you must use a seperate program to publish your webpages to Spinner. To publish your webpages from a Macintosh you can use a program called Fugu. The following instructions assume you are using Fugu as your File Transfer Protocol (FTP) client.

Open Fugu
Next to Connect to, in the Fugu window, type www.cofc.edu
Next to Username: type your Spinner username* (ex. benignim)
Leave Port blank
Next to Directory type www
Click Connect
From the next window type your Spinner password*
Your window should now have two sides. The left side is your computer, the right side is your account on Spinner.
On the left side open the 508_short folder (Desktop >508_Faculty_Templates>508_Short)
On the right side, make sure you are in your "www" folder on Spinner.
On the left side (508_Short) highlight all the files in the 508_Short folder (use Apple-A keyboard shortcut to select all)
Using your mouse, Click, hold and drag all of the items from your computer's 508_Short folder to the Spinner side of the window. This will copy, or publish, all the files to Spinner.
Before you close Fugu, open a web browser (Firefox, Safari, Netscape, Internet Explorer) and go to your webpage. Make sure that everything looks correct. If so, quit Fugu.
Congratulations! You have created and published your webpages using the 508 Compliant templates.

* If you do not know your Spinner username or password you must contact the webmaster at webmaster@cofc.edu.

Windows

Due to limitiations inside NVU you must use a seperate program to publish your webpages to Spinner. To publish your webpages from a Windows machine you can use a program called SSH Secure File Transfer Client . The following instructions assume you are using SSH Secure Shell as your File Transfer Protocol (FTP) client.

Open SSH Secure File Transfer Client
Click Quick Connect
Next to Host Name type www.cofc.edu
Next to Username: type your Spinner username* (ex. benignim)
Leave Port with the default number of 22
Next to Authentication method: select Password
Click Connect
You may get a window asking ifyou wand to save a new host key. Click Yes
At the next window type in your Spinner password*
Your window should now have two sides. The left side is your computer, the right side is your account on Spinner.
On the left side open the 508_short folder (Desktop >508_Faculty_Templates>508_Short)
On the right side, make sure you are in your "www" folder on Spinner (double-click on "www").
On the left side (508_Short) highlight all the files in the 508_Short folder (use CNTL-A keyboard shortcut to select all or Edit>Select all)
Using your mouse, Click, hold and drag all of the items from your computer's 508_Short folder to the Spinner side of the window. This will copy, or publish, all the files to Spinner.
Before you close SSH Secure File Transfer, open a web browser (Firefox, Netscape, Internet Explorer) and go to your webpage. Make sure that everything looks correct. If so, exit SSH Secure File Transfer,.
Congratulations! You have created and published your webpages using the 508 Compliant templates.

* If you do not know your Spinner username or password you must contact the webmaster at webmaster@cofc.edu.