(A3,11) HTML5 Content Development
Explore SLS Functions
Administer
Administer
(A1,i) Onboard New Students
(A1,ii) Reset Student Passwords for Classes
(A1,iii) Generate Two Hour Temporary Password for Students
Assess
Assess
(A1) Create Quizzes (New)
(A2) Monitor Students' Responses in an Assignment
(A3,1) Add Teacher Comments
(A3,2) Annotate (Underline) Students' Responses
(A3,3) Mark Google Attached Files
(A3,4) Mark a Copy of a Drawing
(A4) Print to Scan (Enhanced)
(B1) Mark Teacher Marked Quizzes
(B2,1) Release Teacher Marked Quizzes
(B2,2) Unsubmit Teacher Marked Quizzes
(C1,i) Add Feedback Assistant Mathematics
(C1,ii) Add Language Feedback Assistant for English
(C1,iii) Add Short Answer Feedback Assistant
(D1,i) View Assignments
(D1,ii) Edit Quizzes (New)
(D1,iii) Set Assignments as Assessments
(D1,iv) Add and View Passcodes
(D1,v) View Students' Notes
(D1,vi) Mark Assignments as Complete and Incomplete
Assign
Assign
(A1,i) Create Assignments
(A1,ii) Quick Assign Activities & Quizzes (New)
(A1,iii) Assign MOE Library Lessons
(A1,iv) Assign Community Gallery Lessons
(A1,v) Add Assignments to Class Group
(B1,i) Manage Assignments
(B1,ii) Schedule Assignments
(B1,iii) Edit Assignments
(B1,iv) Pause & Resume Assignments
(B1,v) Move Assignments
(B1,vi) Delete Assignments
(B1,vii) Copy Assignments
(B1,viii) Allow Students to Copy Assignments
(B1,ix) Allow Students to Share Assignments
(B1,x) Highlight and Annotate in Teacher's Copy of Assignment
Author
Author
Create New Lessons
(A1,1) Add New using Templates
(A1,2) Add New Activities & Sections
(A1,3) Add Existing From Library & Starred Resources
(A1,4) Add Introduction
(A2,1) Add Components (Enhanced)
(A2,2) Add Split Page Media (New)
(A2,3) Upload Question and Test Interoperability (QTI) Files
(A2,4) Add Multiple Choice Questions
(A2,5) Add Fill in the Blanks Questions (Enhanced)
(A2,6) Add Click and Drop Questions (Enhanced)
(A2,7) Add Error Editing Questions
(A2,8) Add Free Response Questions (Enhanced)
(A2,9) Add Audio Response Questions
(A2,10) Add Multi Part Questions
(A2,11) Add From Existing Questions
(A2,12) Add Display
(A2,13) Add Rubrics to Audio and Free Response Questions
(A2,14) Embed YouTube Videos
(A2,15) Insert Media Objects
(A3,1) About Rich Text Editor (Enhanced)
(A3,2) Formatting & Paragraphing
(A3,3) Insert Chinese or Tamil Text
(A3,4) Insert Mathematical or Chemical Equations
(A3,5) Insert Tables
(A3,6) Insert Emoticons
(A3,7) Insert Drawings (Enhanced)
(A3,8) Insert External Links
(A3,9) Insert Links to Sections
(A3,10) Insert Tooltips
(A3,11) HTML5 Content Development
(A3,12) Text to Speech (TTS)
(A3,13) Speech Evaluation
(A3,14) Localisation and EDictionary
About Templates
(B1,i) Manage Lessons
(B1,ii) Edit Lessons (Enhanced)
(B1,iii) Edit Activities & Sections (Enhanced)
(B1,iv) View and Edit Lesson Plans (Enhanced)
(B1,v) Make a Copy of Lessons or Assignments
(B1,vi) Edit Detail cards
(B1,vii) Add Question Tags
(B1,viii) Add Lesson Tags
(B1,ix) Edit Media Objects
(B1,x) Move Lessons to Trash
(B1,xi) File Size Limits
(C1,i) Resources
Collaborate
Collaborate
About the Forum
(A1,1) Add a Topic (New)
(A1,2) Add a Poll
(A2) Change Forum Settings
(A3) Post and Comment in the Forum
(B1) Create Team Activities (New)
(B2) Create Teams (Enhanced)
(C1,i) Add an Interactive Thinking Tool
(C1,ii) Add a Poll
(C1,iii) Add a Discussion (New)
(C1,iv) Attach Google Files
(D1,i) Share a Lesson
(D1,ii) Access a Shared Lesson
Customise
Customise
(A1,i) Customise an Avatar
(A1,ii) Change Display Name
(A1,iii) Set an Alternate Email Address
(A1,iv) Set Email Notifications
(A1,v) Manage Linked Account
(A1,vi) Change SLS Password
(A1,vii) Switch to Student Account (New)
(B1) Manage My Templates
Discover
Discover
About Resources
(A1,1) Add Existing Activities from Resources
(A1,2) Add Existing Components from Resources
(A1,3) Add Existing Media Objects from Resources
(A2) Search for Resources
(A3) View Lesson Details
(B1,1) View External Resources (New)
(B1,2) Previously Whitelisted & Non Whitelisted Websites
(B2) Embed Whitelisted Websites
(C1) Access App Library
(C2) Embed Integrated Apps (New)
(D1) Access My Subjects
(D2) Follow & Unfollow Subjects
(E1,i) Make a Copy of a Lesson
(E1,ii) View Print Friendly Worksheet
(E1,iii) Leave Reviews (New)
(E1,iv) About Adaptive Learning System (ALS)
Differentiate
Differentiate
(A1) Create Subgroups
(A2) View Subgroups
(A3) Edit & Delete a Subgroup
(B1,i) Add Activity, Quiz or Section Prerequisites
(B1,ii) Set Differentiated Access
Enact
Gamify
Gamify
About Gamification and Leaderboard (New)
(A1) Manage Gamification Settings (New)
(A2) Game Stories and Collectibles (New)
(A3) Add Conditions to Game Story or Collectibles (New)
(A4) Create Game Teams
(B1) Display Leaderboard for Students
(B2) Quiz Leaderboard and Ranking (New)
(C1) Award XP, Game Story and Achievements Manually (Enhanced)
Notify
Notify
(A1) View and Create Announcements (Enhanced)
(A2) Manage Announcements
About Notifications
(B1,i) View Notifications
Organise
Organise
About Class Groups (New)
(A1) Create Class Groups
(A2) Add Teachers as Students to a Class Group
(B1) Manage Class Group Resources
(C1,i) Install and Launch Apps
(C1,ii) App FAQs
(D1,i) Pin Class Groups
(D1,ii) Archive Class Groups
(D1,iii) View Past Class Groups
(E1) Access My Drive
(E2) Search in My Drive
(E3,1) Create New Folders
(E3,2) View Lessons Shared with Me
(E4) Delete Resources
(F1,i) Copy Lessons within My Drive
(F1,ii) Manage Folders
(F1,iii) Restore Resources from Trash
(G1) Star Resources
Personalise
Plan
Plan
(A1) Access Planner
(A2) Create Class Events
(A3) Attach Assignments and Resources to Events (New)
Publish
Track Progress
Track Progress
(A1,1) Access Learning Progress (New)
(A1,2) View Excluded Questions
(A2,1) View by Topic
(A2,2) View by Month
(A2,3) View by Student
Other Useful Information
(A3,11) HTML5 Content Development
Considerations when creating HTML5 Content
When creating HTML5 interactive content for SLS, the maximum file size limit is 500 MB.
- Acceptable languages: HTML5, CSS, and JavaScript (client-side only)
- Responsive requirements:
- Vector graphics should be used, using SVG or other suitable formats,
- The media object should be scaled proportionally in response to changing browser size - for HTML tags, ensure that the dimensions are defined using relative sizes (%, em) instead of absolute sizing (px).
- Output:
- Self-contained HTML5 (does not require an internet connection to work),
- Scales proportionally and works within an <iframe> regardless of the dimension of the <iframe>,
- Scales proportionately and works within its own browser window regardless of size,
- Self-contained HTML5 packages should contain the necessary WebGLibraries (if required) in their root folder.
- Others:
- There should not be any external libraries, including font libraries, when creating the HTML5 interactive content.
Uploading a HTML5 ZIP file in SLS
Ensure your Media Object folder contains the "index.html" file.
Select all the files within the folder and zip/compress them.
- In SLS, select File from Device under Text/Media on the Component Bar. Alternatively, click the Add Media icon and Upload File in the Rich Text Editor.
Upload the ZIP file by either dragging and dropping it into the box, or clicking the box to select a file through the file manager. A sample file is provided here
- Click Upload when done.
If the file is valid, it will be uploaded and scanned for viruses.
Note: The virus scan will take longer if the file size is large.
- When the file is successfully uploaded, the Media Object will be added to the Lesson.
FAQs
Why does the HTML5 Media Object close after an Assignment is opened in a new tab?
The following line of code in the HTML5 Media Object may have caused this issue:
top.close();
//window.opener.top.close();
As a workaround, students can access the assignment via the Assignment URL.