Set up an HTML puzzle

This page describes how to set up a puzzle that uses an HTML page.
Note: these same instructions can be used for uploading either the puzzle files or the solution files.

Prerequisites

This assumes you have already completed the "Step 1: Add the puzzle entry" for your puzzle

Steps

1. Go to the "Files" page

2. Scroll down to "Materials" and upload a zip of the folder containing your HTML and CSS artifacts.
   It is generally good practice to name the folder the same name as your puzzle so that it doesn't conflict with other materials uploaded by other people

3. Check the box that says "<- Check this box to automatically extract the contents of zip files in materials or solve tokens into the same directory"

4. Click "Upload"

5. If it was successful, you should see the files under the "materials" section

   

6. Right click on the main HTML file to get the URL

7. Go to the "Details" page and paste that URL into the CustomURL section.
   If your HTML file is for the solutions, you can paste it in the CustomSolutionURL

8. Preferrably, please replace the event number with {eventId}, so in the above example we would
   convert https://puzzlehunt.azurewebsites.net/4/Files/ApplestoApples%2Fapples-to-apples.html
   to https://puzzlehunt.azurewebsites.net/{eventId}/Files/ApplestoApples%2Fapples-to-apples.html

9. You will know it was done correctly if you go back to the puzzles page and are able to click the "Link" button.
   You will notice that regular non-HTML puzzles will show up as a "File"