SLS HTML Helper

Chat with the authoring assistants, create the html for your programme, paste the html into the right window, press zip button to create SLS-ready ZIP files, and follow the step-by-step guide to upload them into Student Learning Space (SLS).

Step 1 · Plan & generate code

Your HTML Authoring Chatbots

Use these chatbots to generate or refine your HTML5 interactives, including xAPI and SLS settings. One focuses on Practice + Test (Mode A) and the other on Test-only (Mode B).

Chatbot A – Practice + Test (Mode A)

Click the button below to open your Mode A authoring assistant in a new browser tab.

💬 Open Mode A – Practice + Test Chatbot
• Use this when you want activities with both Practice and Test sections (Mode A).
• Example prompt: “Mode A: Create a P2 Practice + Test activity on comparing unit fractions…”
• chatgpt.com does not allow embedding inside other websites, so it opens in a new tab.

Chatbot B – Test-only (Mode B)

Click the button below to open your Mode B authoring assistant in a new browser tab.

🧪 Open Mode B – Test-only Chatbot
• Use this when you want Test-only activities (Mode B).
• Example prompt: “Mode B: Create a P3 Test-only activity on area and perimeter word problems…”

🔧 To customise further: If you build your own web-based chatbots using the OpenAI API, you can host them on your own domain and embed them here with an <iframe> instead of buttons.

Step 2 · Build SLS-ready ZIP

SLS One-Click ZIP Factory

Use your working ZIP Factory tool here to package index.html, index.js and xapiwrapper.min.js into an SLS-compatible HTML5 package.

📦 To customise: If your ZIP Factory file has a different name (e.g. factory.html), change the iframe src to match.

B. Uploading the ZIP into a SLS lesson (Teacher view)

  1. Log in to Student Learning Space (SLS) in Teacher mode. (Open SLS Login)
  2. Create the Activity where you want the interactive to appear.
  3. Enter the Module Editor for the activity / slide.
  4. In the component bar, add a new question:
    • Click Question.
    • Select Free-Response → Interactive Response.
  5. In the Interactive Response settings, look for the option to Upload HTML5 Package / ZIP, then click Upload.
  6. Browse to your ZIP file (generated by your ZIP Factory) and select it. Wait for the upload and virus scan to complete.
  7. Once uploaded, SLS should show a playable preview (not just a download link).
  8. Switch to Student View and test the interactive: answer the questions and confirm that score/feedback are recorded correctly in SLS.
Quick Checklist (for SLS-friendly ZIP):
▸ index.html at the root of the ZIP
▸ No extra wrapping folder inside the ZIP
▸ All JS/CSS/media files in expected locations
▸ ZIP size within SLS / school limits
▸ Preview shows an embedded interactive, not just a download link