You are here

Office of Information Technology » Web Editor Training

Web Editor Training

Web Editor Training

Navigation

On the login page, use the Reset Password link to request a new one.

  1. Click on the Reset Password link above the Log In button
  2. Enter your Username
  3. Enter the Triton Email associated with the account
  4. Click Submit
  5. An email will be sent to the email address in your user settings, which includes a link to reset your password

Screenshot image of the Login page

Your account needs to be unlocked by an administrator. Please contact Web Team for assistance.

There is a thirty-minute timeout on inactivity in OU Campus.

  • WYSIWYG: “What you see is what you get”
    • The default editing mode in OU Campus
  • Check-out: The act of locking a document for editing
  • Check-in: The act of releasing a document after editing
  • Snippet, component, asset: Different types of reusable content
  • Template: A preformatted layout that is used to create new pages 
  • Directory: A folder or location on the server
  • Home/Root directory: The outermost directory on the server
  • Staging server: Where all changes are made (OU Campus)
  • Production server: Where content is displayed publicly (www.uog.edu)
  • Submit: The act of submitting your changes to the Web Team and will we under review before publishing live on the website.
  • Publish: The act of moving content from the staging server to the production server

The WYSIWYG editor toolbar is very similar to other content editing toolbars, with the addition of some web development and specific options. 

Learn about the Toolbar Options

These tools are located at the toolbar of the WYSIWYG editor.

SNIPPETS
  • Snippets are a type of reusable content that insert predefined content into a page while editing.
  • Useful snippets
      • Accordion
      • Tabs
      • Dynamic Profile Listing
      • Green Table
COMPONENTS
  • Components are a form-based type of reusable content that simplify entering information into complex design elements.
  • Useful components
      • Responsive YouTube embed
      • Simple button
      • Image with caption
ASSETS
  • Assets are reusable content in OU Campus that provide a single source of content for use on multiple pages.
  • Useful assets
      • Accessibility notice
      • Site-specific banners
      • Site-specific social media integrations

Content & Editing Pages

WHAT IS ACCESSIBILITY?
  • Accessibility is the practice of making websites usable by as many people as possible. 
  • We traditionally think of this as focusing on people with disabilities, but the practice of making sites accessible also benefits other groups such as those using mobile devices, or those with slow network connections.

  • Minimize images that are purely text or convey important messages in text format.
  • If you have a flyer/graphic that has a lot of words, please provide us the full text so that we can include it on the website.
  • Always provide alt text 
    • Be as descriptive and as concise as possible
      • i.e. How would you describe the image to someone on the phone?
      • Keep in mind the context of the image in the page.
    • When using a caption, alt text is still required but do not copy-paste alt text to caption, as screen readers will read both. Instead, be aware of the different roles the two fill.

  • PDFs need to be tagged for accessibility. If you know how to do it yourself, please do, or run Acrobat’s AutoTag function, which meets the minimum requirement
  • NO image-only PDFs. PDFs that were created by scanning a hard copy must be converted to OCR (optical character recognition)

  • Page elements need to be properly structured 
    • define table headers, or use the Green Table snippet
  • Header levels need to be properly nested

  • Content is any information, files, or images that are placed on a web page.
  • Be familiar with UOG’s Official Branding Guidelines
    • We may need to edit your content in the case of images that don’t align with branding, or we may request that you redo them 
  • Any significant changes will need to be approved by the MARCOM team
    • Homepage Banners, edits to the global headers and footer, new mini-site creation, etc.
  • Any News, Events, or Homepage Banner requests will need to be approved by the MARCOM team

Download Branding Guidelines

Note: Please note that all files/images need to be placed into your respective /_resources folder. Documents such as PDFs, will be under the /_resources/files folder. For images, it will be under the /_resources/images folder.

  1. On the OU Campus menu bar, go to Content and select Pages.
  2. Navigate to your department/division’s folder.
    • For example, if the department is Marine Lab, inside the “ml” folder, check mark all the images (or files) that need to be moved.
  3. Click on the Move button
  4. Click on the folder icon next to the Source text field
  5. Navigate to sites > _resources > images > and go to your department's folder
  6. Click on Upload
  7. Click on +Add or drag and drop your image files from your computer to the Upload window
  8. If your image's filename does not meet the standards for the website, hover your cursor over Invalid filename and click on Rename to remove any special characters and spaces.
    • Hover and click on Rename
    • Rename your file, so that it has no spaces and special characters, dashes and underscores are allowed
  9. Click on Start Upload
  10. Click on Insert
  11. Provide a brief Description of the image
  12. Click on OK
  • Any requests for items to go on the News & Announcements and Event Calendar RSS feeds need to go through the MARCOM team.
  • You may contact Jackie Hanson at jhanson@triton.uog.edu 
  • Standard Size for Banner Images:
    • Width: 2000 pixels
    • Height: 625 pixels
ABOUT HYPERLINKS
  • Definition: a link from a hypertext file or document to another location or file, typically activated by clicking on a highlighted word or image on the screen. Typically, on any platform, a chain icon represents hyperlinks.
  • Purpose: 
    • Hyperlinks can be used when you would like to upload a file that you would like for others to view/download.
    • Hyperlinks can also be used to link certain text/image to certain websites that you would like for people to see when they click on the text/image.

To add documents to your page, please see the following steps:

  1. Go to the page you would like to edit.
  2. Login to OU Campus using your credentials.
  3. Click Main Content to edit the area you would like the insert your file.
  4. Type a text that you would like for the file to be called.
    • i.e. “Job Announcement.pdf“
  5. Highlight that text that was just created “Job Announcement.pdf“
  6. On the Toolbar Click the Insert/Edit Link icon   
  7. An Insert Link window should popup
  8. On the URL section, click the browse for file icon  
  9. Click/navigate to your department’s file folder www > _resources > files > department > folder
  10. Upload your document by clicking the Upload button 
  11. Click the +Add button or drag your document from your desktop
  12. Click the Start Upload button once you've selected the document you want to upload.
  13. If your file’s filename does not meet the standards for the website, hover your cursor over Invalid filename and click on Rename to remove any special characters and spaces.
    • Hover and click on Rename
    • Rename your file, so that it has no spaces and special characters, dashes and underscores are allowed
  14. The document you've just uploaded should appear highlighted in blue on left part of the window, as seen below
  15. Click the Insert button 
  16. You will see a window that show information about the file
    • URL: is the File's Location
    • Text to display: is the words seen on the body text
    • Title: Input a short title description about the link
      • i.e. "Click here to visit the website"
    • Target:
      • None: is if you would like to open the link within the user's current browser window
      • New Window: is if you would like the user to open the link in a new window
  17. Click OK
  18. After doing the above steps, you are now able to click the text and it will open the file upon clicking.
  19. Click the Save button.

REMOVE DOCUMENTS
  1. Go to the page you would like to edit.
  2. Login to OU Campus using your credentials.
  3. Click Main Content to edit the area you would like the insert your file.
  4. Go to the row where you would like to remove the file and right click that row. Select Row and Delete Row.
  5. After doing the steps the file is now deleted.
  6. Click the Save button. 

Note: Before uploading images, please ensure that they are the correct size and compressed.

SIZING

COMPRESSION

  1. Enter the WYSIWYG* editor for the editable region you would like to insert your image into (i.e., click on Main Content, Page Banner / Slider, etc.)
    • *WYSIWYG = “What You See Is What You Get”
  2. Place your cursor on the page in the area you would like the image to appear
  3. Click on the Insert/edit image icon
  4. Click on the folder icon next to the Source text field
  5. Navigate to sites > _resources > images > and go to your department's folder
  6. Click on Upload
  7. Click on +Add or drag and drop your image files from your computer to the Upload window
  8. If your image's filename does not meet the standards for the website, hover your cursor over Invalid filename and click on Rename to remove any special characters and spaces.
    • Hover and click on Rename
    • Rename your file, so that it has no spaces and special characters, dashes and underscores are allowed
  9. Click on Start Upload
  10. Click on Insert
  11. Provide a brief Description of the image
  12. Click on OK

Click the image you would like to remove, and press Delete on your keyboard.

Helpful Tools & Resources

Didn't find what you're looking for?

There are documentation, resources, tutorials, and more, available at the OU Campus Support website. Please feel free to navigate through the site any time or contact the Web Team on our Discord channel for immediate inquiries and support.

Video Guides

Using the 70th Anniversary website as an example, here's how to edit web page banners. Note: The same process is done for other pages, except the main homepage.

 

web team

Raymundo  L.  Matthew

hours Office Hours:
location Office Location:
Mailing Address:

Expertise

  • Tel:
  • Mobile:
  • Fax:
  • website

Isidro    Jaevani "Våni"

hours Office Hours:
location Office Location:
Mailing Address:

Expertise

  • Tel:
  • Mobile:
  • Fax:
  • website

Guerrero    Chase

hours Office Hours:
location Office Location:
Mailing Address:

Expertise

  • Tel:
  • Mobile:
  • Fax:
  • website

marketing and communications team

Macapinlac  D.  Jonas

hours Office Hours:
location Office Location:
Mailing Address:

Expertise

  • Tel:
  • Mobile:
  • Fax:
  • website

Hanson    Jackie

hours Office Hours:
location Office Location:
Mailing Address:

Expertise

  • Tel:
  • Mobile:
  • Fax:
  • website

Herrera    Eugene

hours Office Hours:
location Office Location:
Mailing Address:

Expertise

  • Tel:
  • Mobile:
  • Fax:
  • website

 


WEB TEAM HOURS

Monday - Friday: 8AM - 5PM

CONTACT

Email: webteam@uog.edu 
Phone: (671) 735-2631

  intstagram  twitter facebook