Web Editor Training

Web Editor Training

Photo: Web Editor Guides web banner

Navigation

Logging In

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

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

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.

Terminology

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

Toolbar Options

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

Tools

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

COMPONENTS

Components are a form-based type of reusable content that simplify entering information into complex design elements.
Useful components

ASSETS

Assets are reusable content in OU Campus that provide a single source of content for use on multiple pages.
Useful assets

Content & Editing Pages

Accessibilty

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.
- - i.e., https://www.uog.edu/helpline/the-process
  - Flyers can also be made available for download (use the simple button component or a simple hyperlink)
Always provide alt text
- Be as descriptive and as concise as possible
- 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)

Converter resource: https://convertio.co/ocr/

Page elements need to be properly structured

define table headers, or use the Green Table snippet

Header levels need to be properly nested

Content

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

Moving Files to Another Folder

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.

On the OU Campus menu bar, go to Content and select Pages.
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.
Click on the Move button
Click on the folder icon next to the Source text field
Navigate to sites > _resources > images > and go to your department's folder
Click on Upload
Click on +Add or drag and drop your image files from your computer to the Upload window
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
Click on Start Upload
Click on Insert
Provide a brief Description of the image
Click on OK

News & Announcements

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

Web Banner Dimesions

Standard Size for Banner Images:

Width: 2000 pixels
Height: 625 pixels

Upload and Remove Files

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:

Go to the page you would like to edit.
Login to OU Campus using your credentials.
Click Main Content to edit the area you would like the insert your file.
Type a text that you would like for the file to be called.

i.e. “Job Announcement.pdf“

Highlight that text that was just created “Job Announcement.pdf“
On the Toolbar Click the Insert/Edit Link icon
An Insert Link window should popup
On the URL section, click the browse for file icon
Click/navigate to your department’s file folder www > _resources > files > department > folder
Upload your document by clicking the Upload button
Click the +Add button or drag your document from your desktop
Click the Start Upload button once you've selected the document you want to upload.
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
The document you've just uploaded should appear highlighted in blue on left part of the window, as seen below
Click the Insert button
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
Click OK
After doing the above steps, you are now able to click the text and it will open the file upon clicking.
Click the Save button.

REMOVE DOCUMENTS

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

Upload Images

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

SIZING

Use the image editor of your choice to crop and/or resize your images to the correct dimensions. Please note that if you are uploading multiple images to be used in a banner slider, they must all be the same height and width.
Standard Size for Banner Images:

Width: 2000 pixels
Height: 625 pixels

Video Tutorials
- For PC: How to Resize an Image using Microsoft Paint
- For Mac: How to Resize an Image using Mac’s Preview

For Photoshop: How to Resize an Image using Photoshop

COMPRESSION

Once your image is the correct size, use https://compressor.io/compress to compress it before uploading it to the website.

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”

Place your cursor on the page in the area you would like the image to appear
Click on the Insert/edit image icon
Click on the folder icon next to the Source text field
Navigate to sites > _resources > images > and go to your department's folder
Click on Upload
Click on +Add or drag and drop your image files from your computer to the Upload window
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
Click on Start Upload
Click on Insert
Provide a brief Description of the image
Click on OK

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

Custom Development

For any custom development requests/inquiries, please contact the Web Team. Here are some custom requests that we can implement:

Complex Functions

Any development that requires the following will have a cost:

Publications Module

i.e. https://www.uog.edu/wptrc/publications

Integrations with Colleague
Any functionality that will require custom, in-house development and future support and hosting

Forms

Need to gather information from prospective students, current students, faculty and staff, or any external audience?

SIMPLE FORMS

The Web Team uses Wufoo, a web-based form builder, to collect form and survey information on the university website. Forms created on Wufoo can be embedded seamlessly onto any of our websites. You will recieve an email notification every time your form is filled out. If needed, a custom report can be created so that you can review all of your responses in on place.

Samples (free of charge):

COMPLEX FORMS

Aside from Wufoo, the Web Team is also able to create fully customized secured forms, which will be hosted and stored in-house, at the university's Data Center.

Any form that contains the following requirements will have a cost:

FERPA-compliant forms
Integrations with Colleague
Complex logic
Frequent changes

Make sure data you wish to collect meets legal and policy guidelines.
If so, send a work request to Web Services with the information that you need to collect.

Wufoo forms are not secure so you may not collect restricted information (SSNs, credit card data, passwords, or other sensitive or confidential information) or any information protected by HIPAA (protected health information) or FERPA (student ID numbers, grades, academic evaluations, student records). Learn more.
What information does your form need to collect?
Which fields are required information for the form to be submitted?
Which email address(es) would you like the entries to be sent to?
In addition to received responses via email, do you need access to a report compiling some or all of your collected data?

Social Media Feeds

Web Team can quickly and easily add social media feeds to pages on the website.

Instagram, Facebook, Twitter
i.e. https://uog.edu/it, https://uog.edu/ml

If you’re making a new social media account, please register it with MARCOM. You may contact Bernie Capindo (capindob@triton.uog.edu).

Helpful Tools & Resources

OCR conversion

https://convertio.co/ocr
https://www.onlineocr.net

Only outputs to Word, Excel, or .txt

No OCR (especially free) software will be 100% accurate. Please review results.

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 at webteam@uog.edu for further inquiries and support.

Website Content Publishing Procedure

Who to Seek

Please work with the Web Editor designated by your department to publish your content. A Web Editor is responsible to make changes to designated web pages and submit to Web Team for review and publishing.

Department Web Editors

Department	Web Editor	Contact
Athletics	Matthew Borja	borjam7113@triton.uog.edu
Business Office	Elsa Cagatuin	floresec@triton.uog.edu
Business Office & Bursar	Kate Edgar	edgark@triton.uog.edu
CIS	Phillip Cruz	philcruz@uog.edu
CLASS	John Del Castillo	delcastilloj@triton.uog.edu
CNAS	Kathleen Duenas	kduenas@triton.uog.edu
CNAS	Marissa Villaverde	villaverdem@triton.uog.edu
CNAS Extension	Olympia Terral	olympiat@triton.uog.edu
EMSS: AREC	Eden Galvez	galveze@triton.uog.edu
EMSS: AREC	Maria Caringal	caringalm@triton.uog.edu
EMSS	Desiree Aguon	desaguon@triton.uog.edu
EMSS	Rowena Andrade	rowenat@triton.uog.edu
EMSS	Cynthia Borja	cynborja@triton.uog.edu
EMSS	Sallie McDonald	salliemcd@triton.uog.edu
EMSS	Jamaica Nakama	career.development@triton.uog.edu
Financial Aid	Mark Duarte	mduarte@triton.uog.edu
HRO	Ci'Anna Cruz	cruzcr@triton.uog.edu
HRO	Elizabeth Flores	eflores@triton.uog.edu
Marine Lab	Christine Camacho	camachoca@triton.uog.edu
OIE	Trini Macduff	macdufft@triton.uog.edu
OIE	Nicolas Yasuhiro	yasuhiron@triton.uog.edu
PIP	Luigi Bansil	bansill@triton.uog.edu
Procurement	Priscilla Rideb	ridebp@triton.uog.edu
Procurement	Emily Gumataotao	guerreroe2862@triton.uog.edu
RCUOG	Coleen Bamba	bambac@triton.uog.edu
RFK Library	Jefrey Libao	jlibao@triton.uog.edu
RSP	Anthony Agustin	agustina@triton.uog.edu
SBPA	Julian Briosos	briososj@triton.uog.edu
SBPA	Cris Toves	ctoves@triton.uog.edu
Sea Grant / EPSCOR	Kyle Santos	kyledcsantos@gmail.com
SNHS	Jonathan Nguyen	nguyenj@triton.uog.edu
SOE	Gerwin Pineda	pinedag@triton.uog.edu
COLL	Manny Hechanova	mannyh@triton.uog.edu
COLL	Jed Henson	hensonj@triton.uog.edu
TRIO	John Aguon	trioSSSwebmaster@triton.uog.edu
WPTRC	Olympia Terral	olympiat@triton.uog.edu

Preparation and Submission of Content

The Department’s Web Editor will prepare the content in the OU Campus Content Management System. At this point, the content will not yet be available on the live website.
This step of the procedure involves editing, writing, or pasting text onto existing web pages; formatting static text; compressing, uploading, and formatting pictures; uploading documents to the server, and creating hyperlinks.

Approval Process

After the content is ready, the Department Web Editor will submit the page(s) for publication. A member of the UOG Web Team will then receive an automated notification of the submission.
The UOG Web Team will review all pages that are submitted for publication. The review process includes checking for spelling errors, broken hyperlinks, W3C Compliance, and accessibility issues.

Minor issues will be fixed by the Web Team.
If a page contains many issues, or if any of the issues cannot be fixed by the Web Team (such as missing documents), then the page will be declined for publication and sent back to the Department Web Editor for review.

If a page passes all system checks, it will be published directly to the UOG Website. The UOG Web Team will do its best to expedite all requests for publication; however, please allow for a maximum delay of 1 business day.
If a page is declined for publication, a reason will be provided, and the Department Web Editor can then address the problem and resubmit the page, or he/she can work with the UOG Web Team to correct the issue.

UOG Home Page Content Request

Requests for home page content (such as main banner images and links), news items, and calendar event items will be forwarded to the UOG Office of Integrated Marketing and Communications (IMC) for approval before being published.

Estimated Time of Approval

Simple requests, such as the creation of new pages or directories that fall within the currently available templates, can be finished within a day.
For complex projects, more time will need to be allocated. Please keep this in mind when submitting requests.

Special Requests

Should your content require further development to the UOG Website, your Department Web Editor will communicate this with the UOG Web Team, who will then coordinate with the IMC and establish the scope of work involved.

Training Sessions

Training sessions take up to 2 hours and are conducted over Zoom. To request to be included in the next scheduled training session, please email webteam@uog.edu.