Publish Your Site on GitHub Pages
We will be publishing our collections using a GitHub feature called GitHub Pages. GitHub Pages provides free static web hosting from any repository. There are soft limits and guidelines for gh-pages usage, so if you’re planning on also publishing audio or video files with your project, click the button below for more information.
Step 1. Activate GitHub Pages
You’ve copied the repository and edited the config file. Now you’re going to actually “turn on” your website by telling GitHub to generate a website from your repository.
- On your project repository’s homepage, click the “Settings” button (appears on the right, towards the top of the page, just above the green “code” button).
- On the “Settings” page, locate the “Code and automation” section of the menu on the left.
- Under “Code and automation,” click on “Pages.” This will take you to a page titled “GitHub Pages.”
- Underneath the title “GitHub Pages,” locate the section titled “Source.” Change the dropdown button from “none” to “main.”
- Leave the other dropdown button just as it is (it should say “/(root)”), then click the “Save” button.
- Once saved, the page will refresh with a green alert that provides the URL where your site will appear.
Note that it takes a few minutes for your site to go live, so if you click on the URL right away, you’ll only see a 404 webpage. This is normal! Proceed to the next section while you’re waiting for your site to build.
Step 2. Add your new URL to the homepage of your GitHub repository
While you’re waiting for your site to build, we will set up our new site URL to display on your GitHub repository homepage, to make it easier for you to access in the future:
- Copy the URL that GitHub created for you.
- Go to repository’s homepage (if you ever are confused about how to get back to the homepage, click on the “<> Code” tab in the top left section of the screen).
- On the right side of the code area, to the right of the green “Code” button, look for the word “About”. Click the cog icon to the right of “About.” A box titled “Edit repository details” will pop up.
- In the “Edit repository details” popup, paste your URL into the “Website” section, then click the green “Save changes” button. This will post your URL underneath the “About” section on your GitHub repository’s homepage, making it easy to access the site in the future!
Now click on your URL again to see if your site is live yet. If you still get the 404 page, don’t worry–sometimes it can take up to five minutes. Refresh your browser every minute or so to check to see if it’s live.
If after five minutes it’s still not live, make sure you’ve followed the steps above, and if you’re still having trouble reach out to Professor Wikle who can help you troubleshoot.
Need a visual? Follow along with the video below:
Step 3. Celebrate!
Congratulations! Today you created a website.