1
2
3
4
5
6
7

Step 4 of 7 , Unit 11

Upload Your Files

This is the most important step. You are about to move your website from your computer into the cloud. Read through this whole step before you start uploading, the file structure matters, and a couple of things to know upfront will save you troubleshooting later.

1

Understand what GitHub needs from you

GitHub Pages looks for a file called index.html at the root of your repository, meaning at the top level, not inside a folder. When someone visits your URL, GitHub serves that index.html as the homepage.

If you built the Federal Indian Policy Series (Units 11-19), your Unit 19 publication homepage is that index.html. The eight era unit folders should be inside a folder called code (or whatever you named it), each in their own subfolder: unit-11, unit-12, and so on. Your file structure should look something like this:

index.html ← your Unit 19 homepage goes here (at the root)
code/
  unit-11/
    index.html
    stage-1.html ...
  unit-12/
    index.html ...
  ... (units 13-19)
assets/
  css/
    main.css
  RF.logotype.png ...
2

Open the upload page on GitHub

Go to your repository on GitHub. You should see the README.md file listed. Look for a button that says "Add file" (near the top right of the file list). Click it, then click "Upload files" from the dropdown menu.

github.com/yourusername/yourusername.github.io

You will see an upload page with a large dashed box in the center. It says "Drag files here to add them to your repository" and has a link that says "choose your files" underneath. This is the upload area.

Below the upload area you will see a "Commit changes" section with a text field. You will fill that in after uploading.

3

Drag and drop your files and folders

Open your computer's file manager (Finder on Mac, File Explorer on Windows) and navigate to your project folder. Select all the files and folders you want to upload, your index.html, your code folder, your assets folder, and drag them into the dashed upload area on GitHub.

GitHub handles folders automatically. If you drag a folder called code, it will upload the entire folder with all its subfolders and files intact. The structure you have on your computer will be preserved exactly in your repository.

Select all at once

On Mac: press Command + A to select all files in the folder, then drag them to the GitHub upload area. On Windows: press Ctrl + A to select all, then drag.

If your browser does not support dragging folders, use the "choose your files" link instead. You may need to upload folders one at a time.

4

Wait for the upload to finish

Depending on how many files you have, the upload could take anywhere from a few seconds to a couple of minutes. You will see a progress indicator as GitHub processes each file. Do not close the browser tab while the upload is running.

When all files have uploaded, you will see them listed above the "Commit changes" area.

5

Write a commit message and commit

Below the file list you will see a field that says "Add files via upload" or shows a default message. This is your commit message, a note describing what you just added or changed.

Clear the default text and write something like: Initial upload: Federal Indian Policy Series. Or: Upload completed project files. Then click the green "Commit changes" button.

What a commit is

A commit is a saved snapshot of your repository at a specific moment in time. Every time you make changes to your repository and commit them, GitHub stores that snapshot. You can always go back and see what your repository looked like at any previous commit. Think of it like hitting Save, except the previous Save is never overwritten, it is always there if you need it.

Make sure index.html is at the root

GitHub Pages serves your site from the root of the repository. That means your main index.html file needs to be at the top level, not inside a folder. If your only index.html is inside a code/unit-19/ subfolder, GitHub Pages will show a 404 error instead of your site.

If your Unit 19 homepage is the only index.html you have, copy it to the root of your project folder before uploading. It can exist in both places.

github.com/yourusername/yourusername.github.io

After committing, GitHub returns you to the repository's main page. You will now see all your uploaded files and folders listed, index.html at the top, then your code folder, assets folder, and any other files you uploaded.

If you click on any folder, you will see its contents. Your entire project structure is now in the cloud.

Files uploaded

Your website files are now on GitHub. They are backed up, safe, and ready to be published. In Step 5 you will flip the switch that turns this repository into a live website.

← Step 3 Step 5: Turn On GitHub Pages →