Tennessee State University

OU Campus
How-to Guide
(for TSU-approved web editors)

 

Description: https://www.tnstate.edu/ouguide/images/PastePlainText.png


SYSTEM/SITE ACCESS

 

Login to OU Campus

Bring up your department web page in a browser.
Scroll to the footer and click "Last Modified".
Login using your usual TSU network login.

 


 

The TSU Website is one of the top three ways that TSU attracts and retains prospective students.

 

 

Let's all do our part in recruiting and in representing TSU
in a positive light.



 

TABLE OF CONTENTS

Design Intentions

Content Guidelines

Getting Familiar with OU Campus

 

________________________________

HOW TO

Accessibility Check

Browser Version

Breadcrumb Path Alteration

Calendar

"Add to Calendar" link
Google Calendar
University Main (Homepage) Calendar

Check in web page

Clear Cache

Content Hanging Off of Rightside

Convert Webpage to PDF / Image - See "Print Webpage to PDF or Image"

Delete File or Web page

Delete Images, PDFs, Documents

Edit Existing Webpages

Embed Google form/document on webpage

ERROR MESSAGES

File-naming

File-renaming

Forms

Google Docs

Qualtrics

Qualtrics Test

Images

Banner Images

Flickr Images   Set 1    Set2

Resizing Images

Resizing Images Software

Stock images

Using an image in Word on a web page

Uploading Images

Keywords

View/change existing keywords

Enter new keywords when creating a new page

Leftnav

Links

Anchor Tags/Bookmarks

Links to Another Department's web page

Email Links

Logging In

Make Webpage Findable on Search Engines

Move a file
New Webpage
New Website

Online Commerce (See Pay Online)

Pasting

Pay Online

Photo Album

Photo - I need a photo for my website

Print Webpage to PDF or Image

Re-publish existing web page

Search Results

Single-space Text

Survey Creation

Table Content

Uploading New PDFs/docs

Uploading While Making New Link

Unlock Page/File
Videos

 

________________________________

HELPS

Troubleshooting OU Campus

Shared Web Content

Tips on Writing for the Web

Policy
Training Class Documents

        Example

        Presentation

 

 

  



DESIGN INTENTIONS


New Paradigm

















 

 

 

 

 

 


KEY CONCEPTS

 

Think:
"Who is in my web audience & how are they
approaching my site?
How are they looking for my information?

And how can I help them find my information?"

Not:

"Let me put lots of unnecessary information to make my
department look important."

____________________________

Think:

“information"

Not:

"department"


ie. Instead of titling your page:
Office of Financial Aid”,
title it: “Paying for College”.

 

____________________________

HOW CAN I LEAD STRANGERS TO MY INFORMATION
IN A CLEAR AND CONCISE MANNER?

 

Make your site appealing & navigable to its intended users,
not to people who know how TSU is organized.
How TSU is organized is irrelevant to most of your web-users.

____________________________

Architect Your Data!
Analyze your content. Then group it into categories. Place categories on your leftnav, not "everything under the sun"!

AIMS OF NEW SYSTEM & DESIGN

- Consistency in both look and feel on ALL web pages. Same fonts on all web pages for titles, subtitles, and text. Same colors for highlighting or setting apart. The entire goal is to look like a uniform and well-maintained university.

Explain responsive site.

Show examples: https://www.tnstate.edu/housing/

 

HOMEPAGE

The TSU homepage projects a particular image of TSU. Departments may not interrupt this image-projection by insisting that certain content be present on the homepage.


  




CONTENT GUIDELINES
















 

AIM: Consistency in both look and feel on ALL web pages.

Consistency means:

1) same font for page content (Tahoma; size 12)

2) same background color for accenting areas (#d1d7db)

3) one image above fold - 250 wide

 

FILENAMES

The filename can help you to have good URLs for marketing.

(eg. www.tnstate.edu/agriculture VS. www.tnstate.edu/agriculturalprogram )

 

PUNCTUATION

Do not use hyper-punctuation. For example: one exclamation point is enough. We are an institution of higher learning. If we cannot express ourselves with our vocabulary and normally-punctuated content, we are most to be pitied.

(ex: Use: “Good News!”

instead of: “Good News!!!”)

***Remember: the web is a publication of TSU!

 

BOLD TEXT

Do not make lots of text bold. Only headings and items that are truly being emphasized should be bolded. Ten items in a single paragraph CANNOT possibly all need to be emphasized!

 

CAPITALIZATION

Do not use ALL CAPS too frequently. It should be reserved for headings and true emphasis of words.

 

COLOR USAGE

Black is the chosen color of text.

No flashy colors. This will be strictly enforced. We aim for consistency and calmness.

To set apart a column of a table, use the background color: #d1d7db.

 

CONTACT INFO

Always offer contact info for the student to receive additional information from you.  “Contact Us” must be the last item in the leftnav….so that it is consistent across the TSU website.

 

FONT & SIZING


Tahoma 12pt

The system automatically makes your text Tahoma font – size 12.  And it handles your sub-titles and Titles automatically as well.


Web Services will be reviewing sites and will alter any
not following this consistent pattern/design.

 

 

IMAGES

1. Non-bordered images

2. No stretched/non-proportionate images

3. One main image in page content. Do not clutter page with multiple images. Keep a clean look.

4. In the “Appearance” tab, be sure to NOT enlarge an image size there....as it will make it blurry.

 

NOTE: You are able to copy all content from Word, Excel, etc. into OU, but not images.

 

 

MARKET TSU'S PROGRAMS –- GUIDE THE STUDENT TO APPLY TO TSU!

Offer the student opportunity to:

· contact someone in your department for more information

· “Apply Now”

….both clearly & specifically stated

Example on right-hand side: https://www.tnstate.edu/history/

 

PLACEMENT OF INFORMATION -Be Consistent!

Program information should appear in basically the same general place for every department…so that web-user knows where to look. Follow example: https://www.tnstate.edu/example

Must-haves in leftnav:

College Name OR "Adminstrative Offices"

Name of Department

"Degree Programs" (must appear in leftnav directly under Name of Department)

"Contact Us" (must be last item in leftnav)

 

REPEATING INFORMATION

Do not repeat information. Have it available clearly and easily navigable and consistent….rather than posting the same information in several different places.

 

SIMPLIFY TEXT

Make the words or phrases into links instead of text saying “Click here for details.”

For example:

Graduate Application (instead of “Click here for graduate application.”)

You’re dealing with a highly Internet-savvy audience. Treat them as such!

 

UNDERLINING

Only links should be underlined. In the web world, underlining means "this is a link".

 

BLUE LINK COLOR

Do not make text the same blue color of web-links. Web-users will think it’s a link when it’s not.

 

FICTITIOUS SITE (Can you locate the errors?)
https://www.tnstate.edu/_testadmin/accounting/

 

 




WEB SUPPORT















 

 

POST-TRAINING SUPPORT SITE: www.tnstate.edu/web


 

 

 

 

 

 

____________________________________________________________

 

FORMS

To create a form where you allow web-users to input data that is sent to you, use Google Docs or Qualtrics. Both are explained below.

 

USING GOOGLE DOCS

Go to www.docs.google.com

Set up an account for your department first. Be sure to not make the account in your own name. You may leave the university; but your department will not. ;-)

After creating an account, you can then begin to set up your form. It's fairly straight-forward.

CREATING A FORM
Choose to create a “Form”. Google Docs will lead you through it very simply.
And when finished, you’ll have an online form that saves all your submitted data into a spreadsheet on Google Docs. You’ll be able to download the spreadsheet at any time.

Here is an test example that I previously did of a Google Docs form. Of course, you’ll set yours up to acquire only the data that you want (email address, name, etc., etc.). Remember, we are not allowed by policy to obtain secure information (especially not Social Security #s).

Example Form: https://spreadsheets.google.com/viewform?formkey=dFBxUktnblZWTTRGOUN6dVNWUXRsdXc6MQ

To see the submitted entries, you will login to your Google Docs account and download the spreadsheet of all of the entries.

 

EMBEDDING A FORM (OR OTHER ITEM) ON A WEB PAGE

If you want to embed your form on an OU Campus webpage of yours, please get the Embed code from Google Docs. Then submit a work order on TrackIt (www.tnstate.edu/trackit) listing the embed code and noting which webpage you need it inserted on. CIT-Web Services will have to embed it on the webpage for you.

< back to top >

 

QUALTRICS: TEST NEW FORM

Okay.  So now, you can have a brand new form in Qualtrics.  You’ll find it much, much easier to use and update.  It will replace your old/existing one.  But you need to test it out first….and make sure you can access its data/form-responses, etc..  Will you do the following:

  1. Login to your Qualtrics account.  You should still have the email from Institutional Planning that mentioned your password.
             www.tnstate.edu/qualtrics
  2. Once you’re logged in, a yellow notification box that may appear. If so, just "X" out of it.
  3. You should see your form listed under “My Surveys”.
  4. In Qualtrics on the line for your form, click “Send”. You will see a link for your form. This is the URL that needs to go on your web page (so web users can click it to use your form).
  5. Click the URL & fill out the form (to test it). After submitting the form, look to see if you can view your results as mentioned below.

NOTIFICATION OF SUBMISSIONS
Of course, you’ll get an email each time someone submits your form.
To alter who gets an email:
Edit your form
Click “Advanced Options” on the right-hand side.
Click “Triggers” and “Email Triggers”
Click the text with “Send” in it.  (Or you can add another email via “Add Another Trigger.”)

VIEW RESULTS
In Qualtrics, click “View Results” and click “Download Data”……to download a spreadsheet of the data that has been submitted for that form.
OR
Just look at all the emails in Outlook that you have gotten from form submissions.

QUALTRICS TIPS:
The following instructions show how to create a new form in Qualtrics; but they may help you to update your existing form a bit too.
https://www.tnstate.edu/ouguide/#qualtrics

EDITING FORM
By clickinging "Edit" you can alter wording, add a new question/field, etc. anytime you like.

TIPS: The following instructions show how to create a new form in Qualtrics; but they may help you to update your existing form a bit too.
https://www.tnstate.edu/ouguide/#qualtrics

 

QUALTRICS: HOW TO CREATE QUIZ/FORM/SURVEY


SETUP QUALTRICS ACCOUNT

First, setup an account on Qualtrics by going to this website: www.tnstate.edu/qualtrics and clicking "Please click here to create an account."
(NOTE: the TSU Department of Institutional Planning maintains the Qualtrics system.)


LOGIN TO QUALTRICS

Login to Qualtrics after setting up your account (as instructed above).


CREATE FORM or SURVEY

Click “Create Survey”
Click “Quick Survey Builder”
Name your Survey
If you want to store it in a particular folder name, enter the folder name.
Click “Create Survey”

Do the following for as many questions as you have:

  1. Click “Create new item”
  2. Over on the right, you’ll see a green rectangle, choose from it what type of question you are asking: Text Entry or Multiple Choice.
  3. Enter your Question.
  4. If your question is multiple choice, enter your Answers too.


REPEAT the above 4 steps for each question you have
.

Click “Preview Survey” if you’d like to preview it. (Just close this window when you’re finished previewing)
If you’d like to edit any questions, go ahead and do so.
Click “Launch Survey”
Click “Activate your survey to collect responses”
You will be provided with a link to the form that you can put on your website or in emails, etc. to ask individuals to submit your form.

Qualtrics Tips: http://lmgtfy.com/?q=create+form+in+qualtrics

Qualtrics Tips on creating forms/surveys:
http://www.qualtrics.com/university/researchsuite/basic-building/

 

TO EDIT FORM (add additional fields, change fields)
Click “My Surveys” at the top…. and then, click your form’s name in the listing that displays. 

TO SEE FORM ONLINE
When you go into Qualtrics…
click the “My Surveys” tab
Click your form in the listing
Click “Launch Survey” near the top
It provides you with the link to your survey.  This is the link that you can put on your website after you have the form working as you like it. 

 

< back to top >

 

____________________________________________________________

CONTENT HANGING OFF OF RIGHTSIDE OF WEBPAGE (UNVIEWABLE)


Does content on your webpage hang off of the right-side of your webpage....prohibiting folks from being able to see the content?

 

 

 

< back to top >

 

____________________________________________________________

GOOGLE CALENDAR

Just go to Google Calendar: https://support.google.com/calendar/bin/answer.py?hl=en&answer=37005

…and create an account for your dept (unless your dept already has an acct).

Then, create your calendar.

After you create it, do this to get the its embed code:

 

In the top right, click the Gear icon and choose Settings.
Click the Calendars tab.
Click the name of the calendar you want to embed.
In the "Embed This Calendar" section, copy the iframe code displayed.
Open your website editor, then paste this code where you want the calendar to display.
Your embedded calendar will only be visible to people you've shared it with. To allow all visitors to see your calendar, you'll need to make it public.

 

https://www.tnstate.edu/ouguide/default_files/image001.pngDescription: https://www.tnstate.edu/ouguide/default_files/image004.jpg

 

 

< back to top >

 

____________________________________________________________

UNIVERSITY (HOMEPAGE) CALENDAR

The University uses the calendar-system, CBMS, to handle the university’s main calendar. Should you want your department's events to show up on the main university calendar and therefore on the homepage, contact Events Management.

 

  

< back to top >

 

____________________________________________________________

"Create "Add to Calendar" link

 

First, create the appointment on your calendar & save it as a file --

  1. First, create an appointment for a meeting on your TSU Outlook calendar… being sure to put the proper:

    Location
    Date
    Time range
    Advance reminder

  2. Then, “save & close” as usual.

  3. Re-open the calendar-appointment that you just created.

  4. In the upper menu, click “File” and “Save As”.

  5. In the filename field, enter the appointment’s name (don’t put any spaces or special characters, but dashes are okay.) 
    FILE-NAMING CONVENTIONS
    For a board meeting that occurs on June 15, 2017, put “BOT_2017_0615”.
    For a finance committee meeting that occurs on Aug 6, 2017, put “FIN_2017_0806 

    (Be sure to keep the leading zeroes on the single-digit months and days like shown above: “0806” for Aug 6.)

  6. For “Save as type”, choose “iCalendar Format”.

  7. On the left-hand area where the file-listing is, go to the place on your PC where you want to save your BOT calendar invites on your own computer (should be in your “BOT Website” folder in the “calendar” folder.) 

  8. Click “Save” at the bottom right….

Second, make the link on your webpage to your calendar appointment file --

  1. In OU Campus, while editing your web page, type the text “add to calendar” because you want to make it into a link.
  2. Highlight the text that you just typed.
  3. Click the chain-link icon in the top menu.
  4. Beside the “Link URL” box, click the reddish browse button.
    Click into our “calendar” folder.
    NOTE: If you just created your calendar-appointment-file and saved it on your PC, then it is not yet in OU Campus.  So you must upload it into the “calendar” folder.
    So to upload it, click “Upload”
    Click “Add” and search for and choose the calendar-appointment file that’s on your PC.
    Click “Start Upload”
    Click “Close”
    Your appointment-file will be already highlighted/selected in the list on the left.
    Click “Insert”
    Click “Insert” again.

< back to top >

 

____________________________________________________________

PAY ONLINE (ONLINE COMMERCE)

To setup the ability to accept payments online, you must first setup an account with the TSU Bursar. The Bursar then contacts Web Services to let Web Services know the feature is ready to be embedded onto your website. Web Services will then embed it onto your webpage. View details on how to get this started>>

 

 

 

____________________________________________________________
PHOTO GALLERIES

Place your photos in an snazzy album and to really highlight your events or program!

Photo Album creation

 

< back to top >

 

CHECKING IN WEB PAGES

“My co-worker says that OU Campus says that I have a page checked out.  How do I check it back in?”

Login to OU Campus ( How to login )
In OU Campus, click the"Content" tab at the top and choose "Pages". 

In your file-listing, notice that any file that you have edited, but not published is still checked-out to you, and therefore, has a yellow lightbulb.  So, just click the yellow lightbulb to turn it to white….which will check in the file so others can edit it. Then, just inform your co-worker that you've checked it back in!

 

t

 

< back to top >

 

 

 

 

 

PREPARING TO CREATE WEB PAGES

 

 

 

 

 

 

PLAN OF ATTACK: Review existing material and deciding what to copy onto your website.  Plan the layout of it.

 

REVIEW YOUR EXISTING CONTENT

 

First: Create a folder on your PC named “Website”.  Within it create two folders: “images” and “documents”. 

Then gather all of your PDFs, Word docs, images…everything that is not text on a webpage. Save them to your PC into the appropriate folder.

Powerpoint Slideshows  --  If you want to have all of your Powerpoint presentations in a particular folder, make a folder named “presentations” and upload your Powerpoint presentations to that folder.

HOW TO COPY IMAGES FROM WORD, ANOTHER WEBSITE, ETC. INTO OU CAMPUS:

IMAGES

Initially, right-click each image and save to your PC. Then, within OU Campus, upload your images from your PC into your “images” directory in OU. By doing this first, you’ll have your images in OU and will be able to easily add them to your pages in OU.

 

DOCUMENTS

Upload all of your PDFs and Word docs into the “documents” folder in OU Campus.

 

 


 

 

 

 

BEST PRACTICES

 

 

 

 

 

 

 

CREATE PAGES FIRST, THEN DO LEFTNAV

 

Create all your webpages first.  Then edit your leftnav. This way, when creating your leftnav, you’ll be able to browse for your new pages in order to link to them.

 

 

COPYING AND PASTING CONTENT (ESPECIALLY FROM A WORD DOCUMENT)

Be sure to always turn on the icon “Paste as Text” (as shown below in red) when you're copying content from Word or other packages and pasting into OU Campus. This is VERY IMPORTANT. It will eliminate bad characters from the source code you are pulling over from Word, etc.

 

Description: https://www.tnstate.edu/ouguide/images/PastePlainText.png

 


 

 

 

 

GETTING FAMILIAR WITH OU CAMPUS

 

 

 

 

 

 

 

IMPORTANT FACTS ABOUT OU

OU has two tabs: Staging & Production.

Keep in mind:

· Web pages are handled in the “Staging” area/tab.

· Images are handled in the “Production” area/tab.

 

SYSTEM NAVIGATION

“New” and “Upload” are relative to where you are in the system.

Notice the navigation bar (breadcrumb indicating where you are in the folder levels).

 

FILE-NAMING
This is very important. All filenames MUST BE:

·         All lowercase

·         Use short filenames

·         No spaces

·         No underscores

·         Separate words with a hyphen. (though it's highly recommended that you use short names and not use hyphens)

·         Always have the extension “.pcf”. (ex. campuslife.pcf or contact.pcf)

 

RENAMING

Note: When you rename, you’re renaming on Staging, not Production. So not until you re-publish will it take effect on Production.

 

HOW TO RENAME A FILE:

In the file-listing, as shown on the image below, find your file name and on the line beside it, hover the "File" menu to bring up choices.

 

Then, as noted on the image below in red, click "rename" and type in the new name. Be sure to keep the extension ".pcf" in place!

And be sure to publish your file to the Live website after you've renamed it.

 

Description: https://www.tnstate.edu/ouguide/images/PastePlainText.png

 

 


MOVE A FILE

To move a file to another area/folder (as the image shows below):

  • display a listing of your folders,
  • hover "File",
  • click "Move",
  • and choose where you want to move it to.

 

 

 

Description: https://www.tnstate.edu/ouguide/images/PastePlainText.png

 

 

 

RECYCLING / DELETING

Folders cannot be re-instated if they've been deleted.

When you delete/recycle a file on Staging, it also deletes/recycle it on Production.

And also, just like your PC, when you delete an entire folder, everything in it gets deleted.

 

To delete a file (Illustration 1 below):
Login to your webpage via the "Last Modified" link in its footer.
Click "Content" and "Pages" in the top menu.

Confirm that you are in your department's folder.
In the file-listing that appears, hover your filename (xxxx.pcf)...and menus will appear on the right-side.
Choose "File"....and then choose "Move to Recycle Bin".
Moving it to the recycle bin will delete it.

 

To delete multiple files at one time (Illustration 2 below):
Click inside the square box beside each filename and then click "Move to Recycle Bin" near the top.

< back to top >

 

ILLUSTRATION 1 - - Delete file

 

Description: https://www.tnstate.edu/ouguide/images/PastePlainText.png

 

 

 

 

ILLUSTRATION 2 - - Delete multiple files

 

Description: https://www.tnstate.edu/ouguide/images/PastePlainText.png

 

 

< back to top >

 

 

 

 

 

 

 

Leftnav

The leftnav is a separate file just like your pages are. So it has to be edited, saved, and published.

NOTE: When you create new web pages, OU Campus automatically puts links to them in your leftnav. But you have to publish your leftnav file in order for the leftnav to become live on your website.

Also note that you may or may not want all of the links to be in the leftnav. So, just delete those you don't want and add others you do want. When you have your leftnav as you desire it, save it and publish it (just like you do web pages).

 

Video

How to Edit Leftnav

 

Must-haves in leftnav:

College Name OR "Adminstrative Offices"

Name of Department

"Degree Programs" (must appear in leftnav directly under Name of Department)

"Contact Us" (must be last item in leftnav)

 

Note: Be sure to publish all new pages that you create before attempting to make links to them...or else you won't see them in the system and you won't be able to make links to them.

To change items on your leftnav, it's just like changing links in a Word document. You just make text into links. It's that simple.

 

To change your leftnav:

It's SIMPLE.

First, login to your page like normal to edit it (how to login to edit)...and when you see the 3 small green edit buttons, click the one for the leftnav.

 

To add a new line to the leftnav, first create a new blank line...and then add a link to that line. How to do so is below:

 

How to create a new blank line

If using Internet Explorer:

Click the text above where you want to put your new line. A box will appear.

Click your cursor at the very end of the text that is in that box....and press "Enter" on your keyboard.

A new line appears.

If NOT using Internet Explorer:

You make a new line the same way you make a new line in any software. Just go to the end of a line and press "Enter".

A new line appears.

 

How to make a link
Type the text that you want in the leftnav.

Highlight the text. Right-click it and choose "Insert/edit link".

Click the red button to the right of the "Link URL" box and browse for the web page that you are making a link for.

Click it...and click "Select File".

Click "Insert".

Voila! It's that simple!

*SAVE & PUBLISH: Your leftnav will not display your new web pages on it until you have re-published your leftnav file (_leftnav.html).

 

< back to top >


 

 

 

 

 

MIGRATING YOUR CONTENT

 

 

 

 

 

 

 

 

FIRST THINGS FIRST -Download & install Firefox. And use Firefox or Chrome (instead of Internet Explorer) when working on OU Campus.

If you would like to have a leftnav file that is easy to edit, you should use Firefox.

Many of you will not have Firefox installed on your PC.

To install it, go to this link & click Download:

http://www.mozilla.com/en-US/firefox/new/?WT.mc_id=en2&WT.mc_ev=click&WT.srch=1&gclid=CKmCzqjm8acCFRFj7AodZEzHGg

Click “Run” to install it on your PC.

It’s quick & easy!

If you run into any problems with installing Firefox….or if you’re unable to install software onto your PC, please submit a ticket with the TSU HelpDesk here: https://www.tnstate.edu/cit/helpdesk.aspx

…and have at Tech come & install it for you.

  

FOR TRAINING CLASS:

https://www.tnstate.edu/_testadmin/contents

 

< back to top >

 

 

 

 

 

WEB SUPPORT

 

 

 

 

 

 

 

 

 

LOGIN TO OU CAMPUS

 

Video

How to Login

 

OU Campus uses your TSU network login and password...and not a separate OU Campus password.

NOTE THIS:
When entering your login-name, do NOT put the "@tnstate.edu" on it.


REMEMBER THIS! - There is no reason why you should get logged out of OU Campus!
WHY?

If you have two failed attempts at logging in, DON'T TRY AGAIN! Instead, re-boot the device/pc you're using and try again after a re-boot.

 

CAN'T LOGIN? DID YOU RECENTLY CHANGE YOUR TSU NETWORK PASSWORD? Remember, since the TSU network routinely notifies you to change your password...when you indeed do change it, you MUST re-boot your device (PC, cell phone, tablet) in order for OU Campus to re-sync with your new network password...or else you won't be able to login to OU Campus! So maybe you're unable to login because you've changed your TSU network password sometime in recent weeks....yet you haven't re-booted your PC/device yet.

 

UNSUCCESSFUL ATTEMPTS: Three strikes and you're out! If you login unsuccessfully 3 times into OU Campus, your OU Campus account will get locked and you must request that the TSU webmaster unlock your OU Campus account. So stop at two failed login attempts. Don't mis-login 3 times....or else your OU Campus account will get locked! Re-boot your PC instead!

 

GETTING ERROR MESSAGES WHEN LOGGING IN? - See below.

 

 

 

TO LOGIN:

  1. In a browser, bring up the page you are dealing with (not the TSU homepage).
  2. Scroll to the bottom.
  3. Click the “Last Modified” link.
  4. If you get one of the following messages when you login, click:

    "Continue to this website"
    OR
    "I understand the risks"
    OR
    "Advanced" and then "Proceed"

    Description: https://www.tnstate.edu/ouguide/documents/OU_Usage_Guide_web_files/image001.jpg

     

    Description: https://www.tnstate.edu/ouguide/documents/OU_Usage_Guide_web_files/image001.jpg


    Description: https://www.tnstate.edu/ouguide/documents/OU_Usage_Guide_web_files/image001.jpg

     

     

    • Enter your network login (not email address) and password.

I can't login! Help!

Re-boot your PC...and then try again using your current network login/password.

Just remember to always use your current network login/pass to login to OU Campus.

If you still can't login, contact x7777 or www.tnstate.edu/trackit and ask that your OU Campus account be unlocked.

 

ONCE YOU'RE LOGGED IN:

IF YOU NEED TO EDIT A PAGE:

If you logged into OU Campus via the page that you want to edit, you can click one of the little green buttons to edit your page.

 

IF YOU NEED TO EDIT A DIFFERENT PAGE

Click the little green arrow pointing to the right (to enlarge your file listing)

 

IF YOU NEED TO CREATE A NEW PAGE

Click the little green arrow pointing to the right TWICE (to enlarge your file listing so that you can get the "New" button on the upper right-hand-side.)

More on editing existing webpages

More on creating new webpages

< back to top >

 

 


UPLOADING IMAGES TO OU

 

First, you must have an image file on your PC to be able to upload it into OU Campus.

 

HOW TO PULL AN IMAGE FROM WORD DOC TO USE ON A WEB PAGE 

NOTE: if you have an image that is in a Word document that you’d like to insert onto your webpage, first save the image as an image file by doing the following:

In Word, right-click the image and choose “Save as Picture”.
Save the picture to a particular place on your PC.

(Now you have an image file on your PC that you can upload into OU Campus via the instructions below.)

< back to top >

 

UPLOAD IMAGE WHILE EDITING A PAGE

1.    While editing a page, click on your web page in the spot where you want the image to be inserted.

2.    Click the "Insert/Edit Image" icon (the mountain icon) in the editor-menu.
If you get a box that wants you to "Run" software, please click "Run" to do so.

3.    For "Image URL", click the reddish-colored button to browse for your image

4.    Confirm in the file path that is listed that you're in your image directory: "sites / main / myDept / images"
If you're not in your "images" directory, browse for it.

5.    Click "Upload & Edit"

6.    Browse your PC for the image you want to upload into OU Campus. Highlight it and click "Open".

7.    Now you have the opportunity to re-size it....which you'll want/need to do most every time.

 

STANDARDS FOR IMAGE SIZES

500 in size is a good size to make most images. But if you have some images in a vertical or horizontal row, so to speak, you need to see what size the existing images are before you re-size your new image...so it'll match.
- Sizing Tip: 1 inch is approx = 100 pixels (this should help you to re-size properly)

Click "Resize".

Alter the width to 500 or so.

Click "OK"

Also, if you need to crop the image, be sure to do so.

Click "Upload As"

Click "OK"

8.    You should now see your image in the listing. Click it.....and then click "Select File".

9.    Enter an "Image Description" (ex: "Students on Lawn" or "TSU Logo", etc.)

10.THEN ALTER THIS SETTING --
Click the Appearance tab.
Notice the width and height fields.

Alter its width to a percentage -- something like "25%"....or "75%" or "100%"....depending on how you want it to appear on the page. Test around with it. You can always change the percentage size to another percentage. Be sure to type the percent-sign in the field too! Then for the "height" field, delete it completely.

NOTE: if you have some images in a horizontal row, you need their heights to match in size. And if you have images in a vertical row/column, you need their widths to match in size.

11. Click "Insert" to insert it onto your web page.
Voila! There it is on your page!


After your image is on your page, you can always right-click it and choose "Insert/Edit Image" and alter the percentage to be another percentage. Always remember to have the percent-sign with it!

< back to top >

UPLOAD IMAGES OUTSIDE OF THE PAGE EDITOR

1.    Click the tab at the very top entitled “Content” and click “Pages”.

2.    Confirm that you're in your area in the breadcrumb. If not, navigate to your area/folder from the "main" root folder.

3.    Click your "images" folder to go into it (so you can upload your image into it).

4.    Click the "Production" tab (upper right) because images are stored there (not in Staging)

5.    On the upper right, click “Image/Upload”.

6.    In the box that pops up, browse for your image on your PC, highlight your image, and click "Open".

7.    Click “Upload As…”

8.    Click “OK”….and your image will be uploaded.

9.    You will now have the opportunity to resize your image -- which you usually need to do -- especially if your image is large. (Remember: 250 pixels is recommended for main images on a page.)
Click "re-size" to resize your image. (Remember: 100 pixels is about 1-inch wide)

10. Click "Upload as" to upload your image (this places it into OU Campus into your "images" folder)
Make sure you like the name and press "OK"

11. Voila! Your image is now in your "images" folder.

Do this for every image in your “New_Website_Images” directory that’s for this particular web section…..in order to get all of your images into your web-area so that you can work with them while creating web pages.

When this is completed, click the “Staging” tab in the upper right to return to your webpage-editing area.

NOTE: Images must be uploaded to "Production", not "Staging".

< back to top >

 

USE TSU FLICKR IMAGES ON YOUR WEBSITE

HOW TO DOWNLOAD FROM FLICKR:

  1. First, find the image you like on the TSU Flickr site.
    (Note: If you can’t find an image that suits your department on Flickr, fill out the images request form on this page: www.tnstate.edu/web.)
  2. Click on the image until it is the main image displaying (like shown below).
    You should see 3 dots in the lower right-hand corner (as shown below in the red circle).

 

t

 

  1. Click the 3 dots on the lower right of the image…..and choose “View all sizes”.
  2. Click the link for: “Small 240”
  3. Click “Download the Small 240 size of this photo”
    …and a popup window appears in your browser.
  4. In the popup-window, click the arrow beside “Save” and choose “Save as”.
  5. Choose a place on your PC to save the image to…being sure to name it an appropriate name, and click “Save”.

    (Remember where you saved your image on your PC because you will have to know that in order to insert the image onto your web page in OU Campus!)

 

HOW TO INSERT THE FLICKR IMAGE ONTO YOUR WEBPAGE

First, login and begin to edit your web page…by following these instructions: https://www.tnstate.edu/ouguide/#editing .

Then, to insert an image onto your web page, follow the instructions “UPLOAD IMAGE WHILE EDITING A PAGE”
on this webpage: https://www.tnstate.edu/ouguide/#uploading .

Save and publish your webpage. 

Voila!  You’re finished!  And you have a new image on your web page!

 

RE-SIZING IMAGES...

It's best to re-size most images that you are uploading into OU Campus. This way, you won't have terribly huge image files that take forever to load onto your web page. Once the image has been uploaded into OU Campus and you've inserted it onto your web page, you may want to alter its width for how to display on your page as well.

Free Graphics Software
(for handling images outside of OU Campus)
To crop or re-size images before loading them in to OU Campus, use
Pixlr: https://pixlr.com/editor/.
Note: the toolbar on the leftside of Pixlr has an arrow that you can click for more tools like "crop"
If the image is larger than 600 in width, re-size it to be 500. 500 is a good width to work with on the webpages.
Pixlr support

 

HOW TO ALTER THE DISPLAYING OF IMAGES ONCE UPLOADED INTO OU CAMPUS --
Right-click the image and choose "Insert/Edit Image". (Or "go to the mountain" in the top menu.)
Choose the "Appearance" tab.
To make a large image viewable on all devices, you'll want to set the width to "100%" (or any other percentage...depending on how you want it to look on the web page) and delete the height.

Be sure to never:

  • make a small image larger (they get really blurry; it's best to go and get your original image and upload it again into OU Campus...and re-size it while you're uploading, making it about 500 in width. Be sure to "overwrite existing" so that you replace the previous image file.
  • grab the corner of an image and drag to re-size it.

    Both of the above ways distort the image.

t

 

HOW TO RESIZE PROPERLY:
To re-size your image, you always want to re-upload it into OU Campus by choosing “Upload & Edit” (as mentioned above) and re-size while you’re uploading!

Remember, a simple rule-of-thumb is that 1-inch = about 100 pixels.  So if you re-size an image to be 250 wide, it’ll be about 2 ½ inches wide on your web page.

BANNER IMAGES
If you'd like Web Services to install a new banner image for the top of your website, please send:

< back to top >


EMBEDDING VIDEOS IN WEB PAGES


First, your video should be in the file format .mp4. If it's not, please ask the creator of it to convert it to .mp4.

 

Next, consider uploading your video to another site (like YouTube, Facebook, Vimeo). Videos work well when on these sites because they are fully optimized for best performance. After uploading to one of those sites, simply embed the link from that site onto your TSU departmental web page via the instructions below.

IF IT IS NOT POSSIBLE TO UPLOAD TO A SOCIAL MEDIA SITE --
You'll want to upload your video into your "videos" folder in OU Campus and then submit a help ticket (info below).
(If you don't have a "videos" folder, you'll want to create one first. Instructions on all things are below.)


In OU Campus, click the "Content" tab near the top. You will see a listing of your files.

 

Check to see if there is a "video" or "videos" folder. If there is not, create one by following the instructions below.

 

TO CREATE A "VIDEOS" folder: click "New" and "New Folder" and name it "videos".

 

ONCE YOU HAVE A "VIDEOS" FOLDER

  1. HOW TO UPLOAD YOUR VIDEO INTO OU CAMPUS
    Then, go into the "videos" folder that you created (or into the one that already existed)
  2. Click the "Upload" button (near upper right)
  3. Click "Add" and find your video on your PC, choose it & click "Open",
  4. Hover your video filename and choose "Rename"
  5. Rename it to a simple name. Like if you had it named "Differential Equations of 2016 Research Platform.mp4", change it to "Differential.mp4". You don't want any spaces in the name and you want it to be simple and short.
  6. Click "Upload.
  7. Now your video should be in your "videos" folder.
  8. Next, follow the instructions below in order to embed the video you uploaded onto your web page. And for "File/URL", click the search button to search for your video in your "videos" folder.

TO EMBED ONTO YOUR WEBPAGE:

Next, while editing your web page, do the instructions in the video below to embed your video onto your web page (Click the enlarge icon on the video below to enlarge the video):

VIDEO: How to embed video>>

VIDEO: How to replace video>>

< back to top >

 

UPLOADING PDFS/DOCUMENTS TO OU CAMPUS

  1. First, click the "Content" tab at the top.....and choose "Pages"
  2. In your file listing, go into your "documents" folder….or whichever folder you are uploading into.
  3. On the upper right, click “upload”
  4. If you are overwriting a file, click the box for "Overwrite Existing".
  5. Click "Add" to search for your document on your own PC.
  6. Find your specific file(s).
    You may upload multiple files at once by holding down the CTRL key (Command key on a Mac) and individually clicking your file choices.
  7. Click "Open
  8. Click “Start Upload”
  9. Your document will be uploaded.

 

 

REPLACE A PDF (alter the link to link to new PDF)

VIDEO: How to replace a PDF (change link to link to new PDF) >>

 

< back to top >

UPLOADING MULTIPLE FILES AT ONE TIME

To upload many files at one time, zip them all up in a zip file on your PC.

Then, in OU Campus….
Position yourself in your documents directory (or whatever directory you’re wanting to upload docs into)
Click “upload” (upper right)
Click the radio button for “zip file”
Browse for the zip file on your PC
Click “Upload”
Click “Extract”

…and the system will upload all your docs into the directory (And of course, they’ll be located in Production, not Staging.)

< back to top >

CREATING A NEW WEBSITE

Simply complete the form for "New Website" on this page.

 

CREATING A NEW WEB PAGE

View Video>>

In OU Campus, click the "Content" tab at the top and choose "Pages".

Click the “New” button in the upper right of the page to create a new web page.

 

New Button:

Description: https://www.tnstate.edu/ouguide/images/NewButton.png

< back to top >

Choose the template you desire for your page by clicking the graphic.

Enter the following information to create your new page:

Page Title
This appears on your webpage as its title, on the browser tab, and in the breadcrumb....so don't make it cryptic (but make it normal English!) :)

Description

This is important because it is the description that comes up on Google search results. Just change the part in red to be your department name:

(ex. Campus Life at Tennessee State University, Nashville, TN)

Keywords

These are the words that web-surfers would use in a search engine such as Google. Separate each by a comma.

Put every word that would apply specifically to the page content on the web page you are creating.

Use the following as an example. Just change the part in red to be the items on your specific web page:

(ex: campus, life, Tennessee, state, university, nashville, tn, university, universities, college, colleges, public, school, hbcu, southeast, tennessee state university, tsu, nashville, tennessee, state, public, TN, hbcu, black, international, program, tennessee state, nashville, state, public, african-american, tenessee, tennesee, tennesse, tennese, tenesse,tennese)

 

Author

Put your department's name (ex. Human Resources)

 

New Page Filename

  • All lowercase
  • Use short filenames (EX: Rather than "historyjournal.pcf", use "journal.pcf" because you're already in the history area/website)
  • No spaces
  • No underscores
  • Separate words with a hyphen...if you desire to separate words.
  • Always have the extension “.pcf”.(EX: campuslife.pcf or contact.pcf)

 

Overwrite New Page

You will probably never check this unless you are replacing a page with the same name that you previously created.

 

New Page Access

Select your group to have access to this page.

 

Press the “Create” button….and wait for it to create your new web page.

*NOTE: Your leftnav will not display your new page until you re-publish your leftnav file (_leftnav.html).

Then, edit your new page by clicking the "Edit" button at the top. Then, start with #5 in the "Edit Existing Web Pages" section below:

 

EDIT EXISTING WEB PAGE(S)
(including the right-hand boxes and leftnav)

1. Pull up the web page that you want to edit in a browser window (Firefox or Chrome).

2. Look at the bottom of your webpage in the footer and click the link labeled “Last Modified…”

3. A screen pops up. (Note: If you get the error screen, just click the link to continue.)

4. Login to OU Campus (using your normal network login & pass). -How to login to OU Campus

5. You will see little green edit buttons for each section of the web page:

a) leftnav

b) page title

c) page content

d) right-hand box #1 (maybe)

e) right-hand box #2 (maybe)

Click the green edit button for the section you're wanting to edit.

6. Make your edits. (the link button to make new hyperlinks is in the upper-right of the Page Editor)
how to edit leftnav | how to upload document | how to insert image | how to make a link | how to delete files/images | how to do other things |

7. Save (upper right of Page Editor).

8. Review your changes to ensure you have no mistakes.

9. “Publish Now” (green button at top).

10. Click “Publish” button (another little “publish” button at the bottom).

Your change will now be live on the TSU website...and the system furnishes a link at the bottom for you to view your new webpage.

 

 

CHANGE EXISTING KEYWORDS

First, you have to check out the file (webpage). So click "Pages" near the top (in OU Campus) to view your file listing. Find your filename (webpage) and look at the lightbulb on its line. If it's white in color, that means the file is checked in. So click the lightbulb to check out the file (it will turn yellow when checked out).

 

Then, hover your filename and the menu items for that filename will appear over to the right. Hover "Edit" and click "Properties". There you will see your existing keywords and will be able to modify them.

 

SEARCH RESULTS ON TSU WEBSITE NOT ACCURATE

 

The TSU website uses Google for its search.

 

So if you’re seeing old information when you search for items, it’s either:

• old PDFs/docs that need to be deleted,

• content on a webpage that needs to be updated, or

• an entire web page that needs to be deleted.

 

So you have to look at the item that the Search is showing you. And you have to decide if it’s an old PDF that you need to delete….or if it’s one of the other two options above. Then you can take action….detailed below.

 

TO UPDATE INACCURATE ITEMS BEING RETURNED ON A SEARCH

Delete File or Web page   (do this if the search is showing a web page that your department no longer wants to exist)
Delete Images, PDFs, Documents (do this if the search shows an old PDF/doc that your department needs to delete)
Edit Existing Webpages (do this if the search is linking to your department’s web page & the content on it needs to be updated)

 

 

HOW TO I MAKE MY PAGE FINDABLE ON SEARCH ENGINES?

If you're not able to find your page using Google or other search engines, you need to enhance your metadata (your page's "description" and "keywords").

 

For a web page that already exists, in order to alter the metadata for that page, do the following:

  1. Login to OU Campus via the page as you normally do (as this mentioned here )

  2. Near the top, on the line that has the "Preview" button, click the lightbulb-button to check out the webpage file.
  3. Then click "Properties" on the same line.
  4. In the "keywords" box, enter as many words about your web page as you can think of that persons searching for your site might enter into Google or another search engine. Be sure to separate each word with a comma. You may enter phrases too.
  5. Also, in the "description", make sure it is accurately representing your web page. Be sure to put the web page's title as the first words in the "description" field.

 

Having the proper "keywords" will greatly enhance your page's findability on search engines such as Google.

 

After making your edits, be sure to save (bottom right).

 

More about "description" and "keywords"

 

More about Optimizing PDFs to be Findable on Search Engines

 

 

< back to top >

 


UNLOCK PAGE/FILE
Help me! Someone wants to edit a file, but I have checked it out. How do I check it back in?

First, bring up the live page in a web browser (not in OU Campus)....and log into it as if you're going to edit it. Instructions

After you login to the page (& into OU Campus), Click the "Content" tab at the top....and choose "Pages".

In your file listing, find the page that you have checked out. It will have a yellow lightbulb. Click the yellow lightbult to make it white...which checks it in.

You're finished! :) You can now logout of OU Campus. And be sure to tell the person that you checked it back in!

Description: cid:image002.jpg@01CB17A4.C977AD10

 

 

 

 

RE-PUBLISH EXISTING WEB PAGE

1. Pull up your web page in a browser window (Firefox or Chrome).

2. Look at the bottom of your webpage in the footer and click the link labeled “Last Modified…”

3. A screen pops up. (Note: If you get the error screen, just click the link to continue.)

4. Login to OU Campus (using your normal network login & pass). -How to login to OU Campus

5. Review your changes to ensure you want to publish it.

6. “Publish Now” (green button at top).

7. Click “Publish” button (another little “publish” button at the bottom).

Your change will now be live on the TSU website.

< back to top >

 SINGLE SPACING TEXT

To single-space rather then double-space:

Hold down the <Shift> key and press <Enter>.

< back to top >

EDITING CONTENT

ALWAYS after pasting, click the “Remove formatting” button (top row). This will clean up any mal-formed HTML.

After copying the content into OU, you can then alter the content on the webpage to be accurate.

Click the “Edit” button at the top and wait for the page to render. You will notice green “Edit” buttons.

Click the green “Edit” button for the section that you need to update.

Go to your TSU webpage that has the content. Copy the content directly from the webpage, not from inside of SiteDoc. Paste the content into the OU editor.

**NOTE: Images will appear to copy over fine. But be not deceived. They are referencing our old web server and will display correctly now in OU, but not when we convert the system fully. So you must delete the images that copied over.

< back to top >

DELETE IMAGES THAT COPIED OVER

Delete any images that you copied from your website. And in their place, insert a new image.

**IMPORTANT: Once you’ve copied your content from the old web page into OU, click the “Clean up messy code” button. It’s an icon on the 2nd row, near the right. It looks like a paintbrush.

After clicking it, you may alter your content however you wish. Use the existing fonts to make your Title and Subtitle.

Save your file.

Publish your file (using the large green button at the top).

When you publish web pages, put the date, your name, and the change made. This may help you later to know what edits you last made to the page.

< back to top >

DELETING WEB ASSETS (IMAGES, PDFS, DOCUMENTS, VIDEOS)

 

To stop images from displaying on a web page,
While editing the web page, just select the image & delete it (press del on keyboard).

To delete images, videos, or documents permanently from OU Campus because they are old:
VIEW VIDEO: How to delete PDF, doc, image, video >>
First, get the name of the document (or image or video) you're wanting to delete...by looking at its URL.

HOW TO LOOK AT THE URL:

If you're deleting an image, do this to get its name/URL:
Right-click the image & choose "Open image in new window". The browser should have opened a new window (a new tab) in your browser. Go to that tab and you should see the image. Up at the top, take note of the URL to know where your image is actually stored. Observe the URL and match it to the following colored example below....so you can know where to find your file/doc in OU Campus.

For example, the following URL :
www.tnstate.edu/campus_life/images/services_hover.png means that:
the image is in the "campus_life" directory in OU Campus.....and is in the "images" folder.....and is named "services-hover.png" .

If you're deleting a document (PDF, Word, etc.), do this to get its name:
Find the link on your web page that links to the document. Right-click the link and click "Copy Link Address".
Paste this link into an email....just so you can look at it. Observe it and match it to the following colored example below....so you can know where to go to find your file/doc in OU Campus.

For example, the following URL :
www.tnstate.edu/campus_life/images/services_hover.png means that:
the image is in the "campus_life" directory in OU Campus.....and is in the "images" folder.....and is named "services-hover.png" .

Then in OU Campus,
Click the “Content” tab (near the top) and choose “Pages”
On the right, click “Production” because your images, videos, and documents are housed in “Production”.

Now, based on the URL/path that you're were asked to observe above, browse into the appropriate folders to find your document/image/video. Then, simply hover it and choose to “Delete” it….and confirm deletion.

 

 

BACK UP FILES BEFORE MAKING CHANGES TO THEM

DO NOT LOSE YOUR DATA!

Before making edits to a file, back it up. On the menu list, in the Column entitled “File”, click the Backup button.

In the box that appears, type the reason you are changing the file. This may come in handy for you later if you have to bring back a backed-up file.

Press “Commit”.

Description: cid:image002.jpg@01CB17A4.C977AD10

 

UPCOMING EVENTS BOX

 

To edit "Upcoming Events", go into the file folder “includes”…and alter the file named "upcomingevents". Be sure not to change the format & spacing. Only alter the text and links because system is using that format to construct the display properly on your page. The "more" button automatically links to a page in your area named "events.aspx"….so be sure you have a page in your dir named that.

< back to top >

MAKING LINKS

 

VIDEOS:

How to Make a Link


How to Change
an Email Link

 

How to Make a Link --.

This details the same instructions as the video above.
NOTE: If you're linking to another TSU page, see section further below
.

 

Type the text that you want to make into a link.

Highlight the text that you just typed.

Right-click the text you highlighted & choose "Insert/Edit Link".

Beside the “Link URL” box, click the reddish-browse button to browse for the webpage or document that you're linking to. If you're linking to a document in your web area, then, of course, you have to go into your "documents" folder in order to click on the correct document.

Once you've found the correct page or document to link to, click it.
However, if your file/PDF/doc is not in the directory because you haven't uploaded it yet, do the following:
      Click "Upload".

      Click "Browse" to browse your PC for the PDF that you want to upload.

      Click "Start Upload".

      Your document should be highlighted in the file listing. Click "Insert" to insert it as your hyperlink.

 

For the field "Target", choose "Open in New Window"....so that your link/document will open in a new browser window.

Click “Insert”.

…and you have your link on your page!

 

 

EMAIL LINKS

Type the text that you want to make into a link.

Highlight the text that you just typed.

Click the icon/button in the top menu that looks like an envelope.

For "Recipient Email" enter the email address.
For "Mail Subject", enter the subject you'd like to be on the email.

 

 

ANCHOR TAGS

 

Video

How to Make Anchor Tags


(for a Table of Contents, for example)

 

To make a "Table of Contents" at the top of your page (a set of links to sections further down on the web page), do the following:

 

First, you must name the sections below by bookmarking them (or anchor-tagging them).

So, scroll to the section below on the web page.

Place your cursor in front of the heading for that section.

Click the anchor-icon in the menu and name that place.

For example, if you had a section further down on your page with the heading of "Publications",
Place your cursor in front of "Publications".
Click the anchor-icon in the menu (on righthand side).

Type the word "publications" (to name that spot on the page "publications").

Then, you want to make a link near the top of your page that links to the anchor tag (section) that you just made. To do so, follow these instructions:

 

Somewhere near the top of your page (where you want to create the links/table-of-contents), type the text for your link....and then highlight your text.

Click the link-icon (chain-link) in the menu.

Instead of entering a URL like usual when you make a link, choose the anchor tag that you'd like to link to.....and click "Update" at the bottom.

So for our example above, you would:
Somewhere near the top of your page, you'd type "Publications".

Highlight the word "Publications".
Click the link-icon (chain-link) in the menu.

Choose the anchor tag "publications".

Click "Update".

 

< back to top >

ALTERING LINKS

Just click your cursor anywhere in the text that is a link.
Then, click the link button (chainlink icon) in the menu.

Alter the link-URL to be what you want it to be.

< back to top >

MAKING LINKS TO OTHER DEPARTMENTS' WEB PAGES

First, bring up in a web browser the new website: https://www.tnstate.edu/

Look for the page that you need to link to. Does it even exist yet? If you find it, look at its URL…

 

(For example, if I wanted to link to: https://www.tnstate.edu/records/online_forms.aspx

Notice that the URL contains /records/online_forms.aspx.

So I then know that the web page is in the “records” area in the OU Campus system. And the web page's name is "online_forms.aspx".)

 

Then, in OU Campus, edit the page that you want to put the link on:

 

Type the text you're making into a link and then highlight it.

Click the link button in the top menu.

Beside the “Link URL” box, use the browse button to browse for the department's directory (records, in my example) within the system. To browse, click “main” in the upper left….and browse for the department's directory. Then browse for the web page's name (online_forms.aspx, in my example) and click it.

(Note: If you were linking to a document in the Records area, you'd enter the Records department's "documents" directory, and find the document to click.

         

Click “Select File”.

Click “Insert”.

…and you have your link!

< back to top >

MAKING LINKS TO EMAIL ADDRESSES

Type and then highlight the text that you’re making into a link.

Click the mail-link button in the top menu.

In the "Recipient Email" box, enter the email address of the person that you're making an email-link for.

In the "Subject" box, enter something like "Web Question".

Click “Insert”.

…and you have your link!

< back to top >

HOW TO CREATE A PHOTO ALBUM

_________________________________________________

HOW TO CREATE A PHOTO ALBUM

If you wanting to create a Photo Album, here are instructions on initial steps to do so.

We’re using JAlbum for any photo albums. You’ll like it a lot. It’s slick…and very easy to use. Directions are below.

Here’s an example of one: https://www.tnstate.edu/x_jalbum/photoalbumcampus/album/ .

DOWNLOAD

Download JAlbum here: https://www.tnstate.edu/cit/web/software/Jalbum-install.exe

Then, install it on your PC. It’s pretty easy to use. If it asks you to publish your slideshow, don’t publish it. What we’ll do is take it from your PC & put it on our server. I’ll work with you on that after you create the slideshow. You just click “Make JAlbum” after you’ve uploaded all the pics. (btw, you can just open a folder that has all of your pics in it & drag them over to JAlbum….to get the pics into JAlbum. Then you just click “Make JAlbum”. Then save it to your PC somewhere. Then upload it

If it ever asks you to sign-in, don’t do that. You’re not wanting to use the online version…b/c it has very limited space. You’re wanting to use the software that you download to your own PC.

Give that a whirl & see if you’re able to use JAlbum.

INSTRUCTIONS

Open JAlbum on your own PC

Add photos

Drag and drop images with images from your computer to the big empty area in the jAlbum application. You can also use the "Add" button in the top left corner. jAlbum will ask for an album name and album description. Tell the story of your album and click "OK".

Choose a skin

Skins are templates that add graphics and functionality to your album. Select a skin for your album in the skin select box. Most skins come in different graphical flavours called styles. Pick a style in the style select box, to create the look you want. You can read more about skins in the skin usage tutorial.

Prepare your jAlbum for the web - Make album

Push the "Make album" button and the jAlbum app will scale your images for the web (without touching your orginals) and make your album.
The album is now saved on your computer. You can preview it with the preview button (magnifying glass) if you want.
If you're not satisfied with the result, go back and make some changes and click the "Make album" again.

COPY ALBUM

Go to the location on your computer where JAlbum automatically-saved your album by doing the following:

Go to "My Documents" on your computer.

Look for the folder named "My Albums"....and copy the folder named “album”.

Then, map a drive (so you can paste your album to this place):

To map a drive on a PC:
Go to "My Computer"
Click "Tools" & choose "Map Network Drive"
For "Folder: ", enter \\phlox\share2

Paste your "album" folder into this place.

If it acts like you don’t have permission or doesn’t paste, let me know. I may need to alter one more thing.

NOTIFY
Log a ticket at www.tnstate.edu/trackit stating which webpage you’d like the PhotoAlbum embedded on & we will embed it for you.

 

 

Upload New Student Catalog

  1. First, on your PC, re-name your new catalog to: Undergraduate_Catalog.pdf  (the new catalog MUST BE named this in order for this to work)
  2.  Login to this page (by pressing "Last Modified" in the footer): https://www.tnstate.edu/academic_affairs/
  3. Click the little green arrow located in the upper left (in order to view your file listing)
  4. Click (again) the little green arrow that points to the right  (above file listing) in order to expand the file listing
  5. In the file listing, navigate into your “documents” directory.
  6. Click “Upload” (upper right)
  7. Go through the prompts to locate the new catalog file on your own PC and upload it into OU Campus. 

Voila!  This page will now point to your new catalog: https://www.tnstate.edu/academic_programs/academic_resources.aspx

(Keep in mind that you may need to clear your browser’s cache in order to see the new catalog.  Instructions are below if you need to do that.

 

_________________________________


H
OW TO CLEAR YOUR BROWSER CACHE
The following instructions will clear the old images from your cache. 

First, CHECK WHICH BROWSER VERSION you have by using these instructions:
       http://www.whatsmybrowser.org/
       (Take note of which version you have.)
Then find your browser and version on this web page...and follow the related-instructions:
       http://www.wikihow.com/Clear-Your-Browser's-Cache

(By the way, re-booting your PC will also clear your browser cache.)
A good habit to get into is to re-boot your PC each day.  That way, you’ll know that you are starting with a cleared PC and browser cache each day.

 

 

_________________________________


BREADCRUMB / BROWSER TAB - HOW TO ALTER TEXT
The following instructions explain how to alter the text that is displaying on the live page's breadcrumb/filepath....or on the browser tab. 

If the breadcrumb (or browser tab) of your page is incorrect, it means the Page Parameter for title is incorrect.

To alter Page Parameters, do this:

  1. Within OU Campus, click “Content” and choose “Pages”.
  2. Find your web page (filename) in the file listing.
  3. Check out your file by clicking on the white lightbulb beside your filename (if the lightbulb is already yellow, do not click it because you, obviously, already have your file checked out)
  4. Then, hover your filename so that the file utilities (“Edit”, etc.) appear to the right.
  5. Hover “Edit” & choose “Properties”.
  6. For “Title”, change it to be what you want it to be.
  7. Save and Publish.

This change will affect both the breadcrumb on your web page AND the browser tab....which is exactly what you want to happen. Be sure to publish your page again for it to take effect.

 

_________________________________


ACCESSIBILITY CHECK
*NOTE: These instructions apply ONLY to web editors who have been notified to do Accessibility Checking.

When you click the "Publish" button to make your page LIVE, you are presented with options like "Check Spelling" and "Accessibility".

Each time you publish your designated web page, click the "Accessibility" option and ensure that your web page has 4 errors or less.

If the page has more than 4 errors, please contact the TSU Webmaster (webmaster   AT   tnstate DOT    edu) so the error(s) can be rectified.

** This Accessibility-checking is VERY important because it allows our physically-challenged web users to properly peruse our TSU website. Thank you for caring about them!

AGREEMENT FORM

 

< back to top >

 

 TROUBLESHOOTING OU CAMPUS

 

Support Page: https://www.tnstate.edu/cit/web/

Breadcrumb

If the breadcrumb for your page is inaccurate, edit the Properties (Props) for your page. Change the Page Title. The breadcrumb comes from the Page Title.

 

Error Messages

 

ERROR: "The site name was not provided.  Please try again, or contact technical support.  S27"

SOLUTION: Please use Mozilla Firefox or Chrome instead of Internet Explorer.

 

IE Fix:

"Site Name not found" is occurring because Internet Explorer has “compatibility mode” turned on.

This site explains how to turn it off:  http://answers.microsoft.com/en-us/ie/forum/ie8-windows_7/turn-off-compatibility-view/33bb7aaf-ab73-47e6-8b5d-d466162ee1cc

 


HTML Validation

This site will tell you about all invalid HTML on your page…..content that may not display correctly on every browser in the world. HTML validator: http://validator.w3.org/#validate_by_input

 


Images

Image already exists” = message that user gets when they are not allowed to upload images to that dir.

Change to a directory that you have access to.

Can't Upload Images – First, check to make sure you're in the "Production" tab & not the "Staging". If you're in "Production", then make sure you're in the "images" folder.

 


Metadata
(example below):

Page Title: Student Services

Description: Student Services at Tennessee State University –Visit us for all your needs!

Keywords: tennessee state university, tennessee, state, university, nashville, tn, university, universities, college, colleges, public, school, hbcu, southeast, tennessee state university, tsu, nashville, tennessee, state, public, TN, hbcu, black, international, program, tennessee state, nashville, state, public, african-american, tenessee, tennesee, tennesse, tennese, tenesse,tennese)

** Add more words to the above list….words that are specific for your page with each separated by a comma.

 


< back to top >

 

 SHARED WEB CONTENT

 

APPLY NOW! -Invite your web users to apply to TSU right on your page!

Explore TSU for yourself.
Visit us and see the campus,
learn more about life in Nashville,
and discover the heart of our exciting TSU Tiger community.

Apply for admission, request information, or contact Tennessee State University today.

Undergraduate Admissions
P. O. Box 9609
Nashville, TN 37209

888-463-6878 toll-free
615-963-5101
615-963-2930 fax

Graduate Admissions
P.O. Box 9584
Nashville, TN 37209

615-963-5901 voice
615-963-5963 fax
   gradschool@tnstate.edu


< back to top >


 TIPS ON WRITING FOR THE WEB


Writing for the web is different from writing for print.

Tackle each existing webpage this way:

Break long paragraphs into short ones not more than about 5 lines long.

Break long, complex sentences into short ones.

Add at least one subhead….visible when the page opens.

Continue adding subheads every few paragraphs.

Present important points as bullet points.

Tips

Use plenty of titles and break-up mechanisms (like bullet points and italics).

Aim for brevity.

Be wary of too much marketing-speak.

Watch out for font-legibility problems.

Font types, Arial and Verdana, are better for small print.

Write how you speak. (It’s personal & people like it. The web is so technical & this personalizes it.)

Skill in writing still matters….even though it’s brief.

Dark text on a light background is still the easiest to read for long periods.

 

Great Article on Writing for the Web


< back to top >

 

 POLICY

 

 

CIT-Web reserves the right to make any necessary corrections to web pages not abiding by these design and content guidelines and any other issues deemed erroneous for web-publication on our higher-education site.

 

HOMEPAGE

The homepage projects a particular image of TSU. Departments may not interrupt this image-projection by insisting that certain content be present on the homepage.

< back to top >