<<<-Back to Admin Area

WELCOME!!!

This section is designed to help orient new webmasters to the PTESC website. Feel free to modify or update this section and the procedures described herein as necessary. The PTESC website was built in Macromedia Dreamweaver. While webmasters experienced with HTML may be able to effectively navigate the code to maintain the website, use of Dreamweaver is encouraged. Dreamweaver can be found in many computer labs on the UPenn campus.

Dreamweaver Tutorial !!!!! New to webmastering? This tutorial will give you the basics you'll need for basic maintenance.

Note: If you are new to HTML, the web is rich with resources to help you. An easy and straightforward example is http://www.echoecho.com/html.htm

Connecting to the site
Install yourself as webmaster
Basic site maintenance
Adding new pages
Modifying page content

1. Connecting to the site Back to Top

This will teach you how to access and update pages on the PTESC website. The check boxes are there only to help you keep track of where you are in the process, you dont need to use them.

a) Open Dreamweaver (In the residential computer labs its Start >> Programs >> Applications >> Macromedia >> Dreamweaver)
b) Open the File Window (Window >> Files OR press F8)
c) Click "Edit Sites" or "Manage Sites"
d) Click "New" (Note: On some versions of Dreamweaver, you may need to click the "Advanced" tab)
e) Go to the "Remote Info" category
f) Under "Access Type" choose FTP
g) Under "FTP Host" enter: porter.ssc.upenn.edu
h) Under "Host Directory" enter: /www1/centers/ptesc/
i) Enter your Login and Password (NOTE: BE AWARE THAT IT MAY SAVE THIS INFO TO THE COMPUTER BY DEFAULT)
j) Check any option that says "SFTP/Secure FTP"
k) Click "ok" until you return to the main screen
l) From the drop-down menu that says "local view", select "remote view"
m) Click the "connect to remote host" button if you need to
n) Double click on a file to edit it
o) Once done editing, save the file (make sure you use the original name and extension (ie .htm or .html) )
p) Once saved, click on the file in the "Files" panel and then click the "Put" button (Blue arrow at the top of the "Files" Panel)

Congratulations! You should now see and have access to all the files that make up the PTESC website!

NOTE: This checklist assumes you are editing the files from the remote server. You may want to download the file to your local computer. To do this, when you see the files in the "Remote Info" section of the Files Panel, click on the root directory ( /www1/centers/ptesc/) and then click the "Get" button (the green arrow at the top of the Files Panel.

2. Install yourself as webmaster Back to Top

Change webmaster e-mail address on the "contact" page, contact.html. This is done in the code, look for the "new webmaster note" in the code for more specific instruction.

3. Basic site maintenance Back to Top

a) Watch the schedule, every time an event takes place, update the "announcements" section on the homepage, index.html. This section is located in the LEFT HAND BODY CONTENT. Rewrite the text to show:

  1. DATE (ie Friday December 9)
    SPEAKER (ie Sophie Meunier)
    "TITLE" (ie "Anti-Americanisms in France")
  2. Ensure that the whole text is linked to events.htm

b) Annually, at the end of the fall semester, update the "event schedules" section to prepare for the next semester:

  1. Save events.htm as events_fall##.html (ie. events_fall05.html)
  2. Save events_spring##.html as events.htm
  3. Edit the lefthand nav bar in the new files, events_fall##YEAR.html and events.htm, so that Fall points to events_fall##.html and Spring points to events.html

c) Annually, at the end of the academic year, update the "event schedules" section to prepare for the next year:

  1. Create new Fall and Spring files for the upcoming year and name them in the standard format. The easiest way of doing this is copying the existing files and renaming them
  2. Open files and adjust Content (insert new events) and Lefthand navbar links (both the name and the URL)
  3. Save events.htm as events_spring##.html (where ## reflects the spring that is ending)
  4. Save events_fall##.html as events.htm (where ## reflects the upcoming fall)
  5. Archiving ended year: Move files events_fall and events_spring of the ended academic year to the archive folder. (NOTE: This should be done in dreamweaver as it will automatically offer to update the links)
  6. Update the archives table to link to the new archived pages.

4. Adding new pages Back to Top

All pages, with the exception of this administrators area and the archive, are in the root directory. The easiest way to add a new page to the site is simply to copy an existing page and modify it as necessary.

5. Modifying page content Back to Top

Most sections and subsections of content have "BEGIN" and "END" comments in the code. If working in the code, include these comments in your selection when copying or deleting code. NOTE: Copying and deleting sections through the "Design" interface in Dreamweaver will not include these comments, thus there may end up being sections without the comments, or comments without code between them.