All the content on this site comes from one place in the code: the SITE_DATA object near the top of the <script> section in this file. Open index.html in any text editor (Notepad, VS Code, etc.) to edit it.

To add an image exercise (a scanned worksheet, a screenshot, a design sample):

1. Put your image file in a folder next to this website, e.g. exercises/word/COMPANY LOGO.jpg
2. In SITE_DATA, find the exercises list and add a new entry:
   { title: "Format a COMPANY LOGO", unit: "COMPANY LOGO", type: "image", file: "exercises/word/COMPANY LOGO.jpg" }

To add a text exercise (typed instructions):

1. Add an entry with type: "text" and write the exercise directly inside text: "..."

To show text AND an image together (e.g. typed instructions plus a reference picture to recreate):

1. On the same entry, include both file: "exercises/RESUME/1.jpg" and text: "Your instructions here..."
2. Both will appear in the right-hand panel — the short desc first, then the longer text, then the image.

To let students download a working file (e.g. an .xlsx they open and practice on, instead of just looking at a picture of it):

1. Put the file in a folder next to this website, e.g. exercises/RESUME/HOTEL_MANAGEMENT.xlsx
2. Add download: "exercises/RESUME/HOTEL_MANAGEMENT.xlsx" to the entry. You can combine this with text and/or file (image) on the same entry — the download button appears above the text/image.
3. Optional: set downloadLabel: "HOTEL_MANAGEMENT.xlsx" to control the file name shown to students (defaults to the file name in the path).

The unit field (e.g. "COMPANY LOGO", "DESIGN", "Letter") controls the category list on the left and the filter buttons above the grid. Give several exercises the same unit name to group them — that's how "Letter" holds its 5 sub-exercises below.

Once edited, re-upload index.html (and your exercises folder) to wherever you're hosting the site, or share the folder directly with students.