How to Update and Maintain the SumTotal Homepage...
Transcript of How to Update and Maintain the SumTotal Homepage...
How to Update and Maintain the SumTotal Homepage v2
Learning & Organizational Development
3360 Geary Blvd. Rm. 246 San Francisco, CA 94118
Designed and Developed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III 1/3/2014 [email protected] M:\SumTotal_Homepage-FINAL-Max-122013\documentation\SumTotalHomePagev2-Max-010313
How to Update and Maintain the SumTotal Homepage v2
File Management
Local Root:
M:\SumTotal_Homepage-FINAL-Max-122013\
Server:
W:\sumtotal\home121313
Backup:
Dropbox | Team Folder | Developer Technical Documents | SumTotal | Home Page | SumTotal_Homepage-FINAL-122013
Zipped archives included per site modifications
Project Documentation:
M:\SumTotal_Homepage-FINAL-Max-122013\documentation\SumTotalHomePagev2-Max-010313.docx
ChangeLog:
M:\SumTotal_Homepage-FINAL-Max-122013\ documentation\changeLog.txt
Bug List:
M:\SumTotal_Homepage-FINAL-Max-122013\ documentation\BugList-Mobile.txt
Dreamweaver ste:
M:\SumTotal_Homepage-FINAL-Max-122013\sumtotal_home_FINAL122713.ste
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 2
How to Update and Maintain the SumTotal Homepage v2
Document Change Log
This document should be updated and maintained as project revisions are required.
Date Author Description 12/30/13 Max Ferman, M.Ed Initial Draft 1/3/13 Max Ferman, M.Ed Created provider.lbi
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 3
How to Update and Maintain the SumTotal Homepage v2
SumTotal HomePage
Learner Tab
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 4
How to Update and Maintain the SumTotal Homepage v2
File Manager (Dreamweaver)
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 5
How to Update and Maintain the SumTotal Homepage v2
Learner Content Files:
1. learner\apex.html 2. learner\campus.html 3. learner\medcenter.html
Required Files:
1. assets\fancybox a. jquery.easing-1.3.pack.js b. jquery.fancybox-1.3.1.css c. jquery.fancybox-1.3.1.pack.js
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 6
How to Update and Maintain the SumTotal Homepage v2
2. assets\scripts\tabs_Modified_Chris_121213.js
3. assets\css\stylesModv2.css <div class="tabs_wrap"> <div class="nav group"> <ul class="tabs">
4. assets\images\ • Several images utilized • Sprites available as needed
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 7
How to Update and Maintain the SumTotal Homepage v2
APeX Tab
learner\apex.html
<div id="content_01" class="tab_content">
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 8
How to Update and Maintain the SumTotal Homepage v2
Campus Tab
learner\campus.html
<div id="content_02" class="tab_content">
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 9
How to Update and Maintain the SumTotal Homepage v2
Medical Center Tab
learner\medcenter.html
<div id="content_03" class="tab_content">
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 10
How to Update and Maintain the SumTotal Homepage v2
CSS
To insure consistency and maintain the quality and integrity of the design, please adhere to the following styles when modifying or adding new content.
Example: learner\apex.html
Styles used throughout all .html files:
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 11
How to Update and Maintain the SumTotal Homepage v2
Example: learner\campus.html
Styles used for logo/icon align right and required classes
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 12
How to Update and Maintain the SumTotal Homepage v2
Example: learner\medcenter.html - aaIncident Reporting section
Styles used to highlight new content:
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 13
How to Update and Maintain the SumTotal Homepage v2
Library Items (.lbi)
Library (.lbi) files are unique to Dreamweaver, and can contain content, code and/or assets that can be shared on several web pages throughout the site. Library Items are an efficient way to eliminate redundant code or duplicate assets, and allow developers to insure consistency throughout the site.
WARNING: ALL changes made to an .lbi file will automatically update every .html file that references it throughout the site.
See also: http://tinyurl.com/m3xo5eg
Library\carousel.lbi
a. Includes ALL graphics, css, js and text that make up the entire carousel on all pages
2. Library\FeaturedCourses_h3.lbi - <h3>Featured Courses</h3>
a. The main heading that is shared on all content files (tabs).
3. Library\providers.lbi a. Requested to duplicate "Providers" info on both the Campus and Medical Center
Tab. b. Because content is redundant on both campus.html and medcenter.html,
"providers.lbi" was created to insure consistency, avoid error and repetitive work.
4. Library\sidebar.lbi a. Includes ALL graphics, css, js and text included in the sidebar on all pages
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 14
How to Update and Maintain the SumTotal Homepage v2
Library\carousel.lbi
Required Files:
1. assets\scripts\carousel.js 2. assets\css\mainv3.css 3. assets\css\reset.css 4. assets\css\stylesModv2.css 5. assets\images
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 15
How to Update and Maintain the SumTotal Homepage v2
Carousel Thumbnail Images Specs
assets\images
200px x 150px
Carousel CSS
assets\css\stylesModev2.css
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 16
How to Update and Maintain the SumTotal Homepage v2
Example: Incident Reporting Carousel Code
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 17
How to Update and Maintain the SumTotal Homepage v2
Library\sidebar.lbi
Required files: 1. assets\css\mainv3.css 2. assets\css\reset.css 3. assets\css\stylesModv2.css 4. assets\images
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 18
How to Update and Maintain the SumTotal Homepage v2
Sidebar CSS
assets\css\stylesModev2.css
Example: Welcome Sidebar Code
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 19
How to Update and Maintain the SumTotal Homepage v2
Absolute vs Relative Paths
To maintain the integrity of the site structure, all assets are referenced relative to the root directory.
AutoLaunch eCourses
Links to all eCourses are absolute, and set to launch automatically, rather than have users click an additional “Start” button in SumTotal.
CODE: LMS_CNT_LaunchCourse.aspx?AutoLaunch=true&
Example:
<a href="https://uc.sumtotalsystems.com/sumtotal/app/management/LMS_CNT_LaunchCourse.aspx?AutoLaunch=true&ActivityId=167569" target="_top">Incident Reporting</a>
NOTE: Include target="_top" for all eCourse links to insure eCourse opens in pop-up window.
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 20
How to Update and Maintain the SumTotal Homepage v2
ipDetector
learner\redirect.html
NOTE: The ipDetector scripts were created to satisfy the requirement of Learning Services management to default to either the Campus or Medical Center tab, based on the users IP address and subsequent position with UCSF. This is not a standard SumTotal requirement or process.
Required files:
1. assets\scripts\ get-ip.asp 2. assets\ scripts \ get-ip.js 3. assets\ scripts \ get-ip_redirectCustom.js
Dependent Files
1. learner\index.html
The sole purpose of this file is to point to redirect.html
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 21
How to Update and Maintain the SumTotal Homepage v2
2. learner\index.htm
The sole purpose of the learner\index.htm is to reference the index.allow SumTotal to correctly load the learner tabs (apex.html, campus.html, medcenter.html) through an iframe. This is considered the standard workaround as per SumTotal.
NOTE: the index.htm file is zipped (index.zip) and uploaded directly into SumTotal
See Also: How to Upload index.zip to SumTotal
File Dependencies:
Because of the ipDetector requirement, these files must reference each other in this order:
redirect.html
index.html
index.htm
index.zip
SumTotal
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 22
How to Update and Maintain the SumTotal Homepage v2
How to Upload index.zip to SumTotal
See also: Dropbox | Team Folder | Developer Technical Documents | SumTotal | Administering the SumTotal Suite 8_2SP1.pdf Pages 74-79
1. CREATE index.zip to include ONLY the index.htm file.
SumTotal Administrator
2. SELECT the Manage menu 3. SELECT Organizations
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 23
How to Update and Maintain the SumTotal Homepage v2
4. CLICK UCSF
View-Assign Sidebar
5. SELECT News from the View-Assign Sidebar
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 24
How to Update and Maintain the SumTotal Homepage v2
6. CHECK English (United States) in the Learner Mode
7. CLICK Browse to locate the index.zip file 8. SELECT Language: English (United States) 9. SELECT Mode: Learner 10. CLICK Upload
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 25
How to Update and Maintain the SumTotal Homepage v2
Manager Tab Under construction 1/3/13
Because the ipDetect process is NOT required, a standard index.htm file can be uploaded directly to SumTotal.
Designed by: Maxine (Max) Ferman, M.Ed. eLearning Developer | Programmer Analyst III [email protected] Updated: 1/3/2014 26