A quick tutorial on how to update the USP Net Schedule when I am away
Sessions
- May, 2004: Shalen
- 29 June, 2004: Avinesh and Seini
- 3 September, 2004: had a few sessions where they did it on their own and i checked. Looking good; while I am away for 3 weeks in the US will be the real test.
Overview
Every week I get an email from Linda containing the latest USP Net Schedules in PDF format, and an html file linking to them. My job is to upload these new files to our website, and update our website's HTML so that it links to the proper schedules. To do this we use a Content Management System called typo3. Typo3 allows us to change the text, links and images in the site without having to worry about the design.
The steps to do this are:
- Get the email from Linda
- Copy the pdfs and html to your computer
- Log in to typo3 at
http:www.usp.ac.fj/typo3/ - Upload the pdfs
- Change the html
- Check your work
- Done!
Now, lets do this in more detail.
Step by Step
Log in to typo3
Go to http:www.usp.ac.fj/typo3/ and enter your username and password
Upload the PDFs
First, click the words Filelist on the left menu
Click the icon to the left of the words Media Schedule, and then press Upload Files on the top of the page.
Choose the number of PDF files you will upload, check the Overwrite existing files option, and hit browse... to locate the PDF files you will upload.
After hitting the Browse... button, locate the files you want to upload and hit open.
Once you have chosen all of your files, hit the Upload files button.
Great! You have finished uploading the files. Now it is time to edit the webpage to link to these files.
Editing the Webpage
We will be editing the USPNet Schedule page so that it links to the files we just uploaded. This will involve locating the html for that opage, editing the html, and saving it.
Press the page link on the left, and then hit USPNet Video Conferencing Schedule
Click the text of the page that appears in the right side.
Now you will be able to see the HTML that makes the web page work. We will edit that HTML to link to our new PDF files.
Open the HTML file attached to the email you were sent and edit the code to match it.
In this example, we want our links to look like this
There are two tasks to do:
- edit the links to the new file names
- edit the text for the proper dates
This is what the HTMl looks like for that part. We will only edit the code circled. The rest of the html we will leave alone.
Change the file name of the PDFs to match the one's we uploaded, and then change the text to match the HTML attached to the email. Sometimes you may have to cut or paste additional entries. For instance, sometimes we only show two weeks, other times we have several. When you cut or paste an entry, be sure the entry starts with <li> and ends with </li>.
When you are finished, press the save icon on the top-left of the right window. It is circled below.
To see what the page looks like, click the View link on the left. Be sure to test all the links you added to be sure they download the proper PDF file, and check for spelling. Also visit the page on the actual website to doublecheck.
You're Done!
When you're done, email Linda (
austin_l@usp.ac.fj to let her know the page is up. And cc: me robbins_c@usp.ac.fj.
Thanks, and good luck.
Additional Resources
Lists
You can learn more about using lists <li> with HTML at http://www.w3schools.com/html/html_lists.asp
Links
You can learn more about using links with HTML at http://www.w3schools.com/html/html_links.asp