Guide to Custom Domains on GitHub Pages

---

ℹ️ℹ️ℹ️ The following content is translated by OpenAI.

Click here to view the original Chinese version. | 點此查看本文中文版

---

Guide to Custom Domains on GitHub Pages

Use your own domain instead of the default github.io URL.

About GitHub Pages

GitHub Pages is a free static site hosting service provided by GitHub. All GitHub Free accounts can use it for public repositories directly, while private repositories require a paid upgrade to a GitHub account.

ZhgChgLi ZhgChgLi iOS Developer, eager to learn, teaching and sharing, loves movies/TV shows/western music/sports/life zhgchg.li

• My Jekyll Blog deployed on GitHub Pages
• Seamless transfer from Medium to GitHub Pages ➡️➡️➡️

Limitations

• Only static file resources can be hosted: HTML, CSS, JavaScript, font files, images, PDFs, audio files, text files, etc.
• Website (Repo) size must not exceed: 1 GB This is likely a soft limit, as my GitHub Pages Jekyll Repo is nearly 5 GB.
• Maximum deployment time: 10 minutes
• Maximum deployments per hour: 10 (soft limit)
• Monthly bandwidth limit: 100 GB (soft limit)
• Frequent requests may result in an HTTP 429 response.

⭐️⭐️⭐️ If you only want to learn about custom domains on GitHub Pages, please continue reading.

GitHub Pages Tutorial: Create Your Personal Website with ChatGPT, No Coding Required

This section is aimed at beginners who are not familiar with Git.

1. Register and log in to GitHub: https://github.com/

• After logging in to GitHub, click the “+” icon in the upper right corner and select “New repository.”

2. Enter Repo Name and Settings

• Repository name: yourusername.github.io
• Public: Select for a public project
• Add a README file: This makes it easier to add files directly using GitHub Web after creation.
• Create repository.

Each account or organization can only create one main GitHub Pages Repo named yourusername.github.io. Other Repos that you want to deploy to GitHub Pages will be accessed via yourusername.github.io/RepoName. For example:

• yourusername/yourusername.github.io Repo → yourusername.github.io
• yourusername/mywebdemo Repo → yourusername.github.io/mywebdemo

For Repos that are not yourusername.github.io, you need to go to Settings to enable GitHub Pages:

For example, if I want my Repo zhgchgli0718/testgithubpage to have a GitHub Pages page:

• Settings → Pages → Branch → Select main/root → Save
• Done.

3. Create Your Homepage .html File

• On the Repo homepage, click the green “Code” button in the upper right corner.
• Select “+ Create new file.”

4. Use ChatGPT to Generate Your .html Page

• Here’s a simple prompt: Generate a cyberpunk-themed welcome page (.html).

5. Paste the .html into Your GitHub Repo File

• File name: Enter index.html
• Edit: Paste the .html content generated by ChatGPT. You can use ChatGPT to adjust your HTML or edit the HTML content directly here.
• Click the “Commit changes…” button in the upper right corner.

• Select “Commit directly to the main branch.”

---

Upload Resource Files (e.g., images):

• Click “Add file” and select “Upload files.”

• Drag and drop or select files, wait for the upload to complete.
• Click “Commit changes.”
• Done.

6. Wait for Deployment

As mentioned earlier, GitHub Pages requires deployment; simply saving won’t make it appear. You can click on “Actions” at the top of the Repo to check the deployment progress until the orange light 🟠 turns into a green checkmark ✅, indicating that deployment is complete.

7. View the Results

https://zhgchgli0718.github.io/

• Go to: https://yourusername.github.io to see the results.

Guide to Custom Domains on GitHub Pages

Now we get to the main point of this article: custom domains on GitHub Pages. As mentioned earlier, by default, we can only use yourusername.github.io as the main domain for your static website. For other Repos, you can only access them via /path, and you cannot create a second *.github.io.

However, GitHub Pages generously offers a custom domain feature.

⭐️⭐️⭐️ The purchased domain can also be used for: Medium Custom Domain Feature.

For example, my domains:

1. https://zhgchg.li → Used for my GitHub Pages Jekyll Blog

2. https://blog.zhgchg.li → Used for my Medium page

1. Purchase & Obtain a Domain from Namecheap (A well-known domain provider)

First, go to the Namecheap homepage and search for your desired domain:

You will receive search results:

If the button on the right shows “ Add To Cart “, it means the domain is available for registration, and you can add it to your cart for purchase.

If the button shows “ Make offer “ or “ Taken “, it means the domain has already been registered, and you should choose another suffix or a different domain:

After adding to the cart, click the “ Checkout “ button below.

You will enter the order confirmation page:

• Domain Registration: Here you can choose AUTO-RENEW for automatic renewal each year or change the number of years for a one-time purchase.
• WhoisGuard: Since domain information can be publicly queried by anyone (registration date, expiration date, registrant, contact information), this feature allows you to display Namecheap instead of your personal information to prevent spam messages. (This feature may incur a fee for some suffixes, but if it’s free, go ahead and use it!)

You can check some whois information results for google.com here.

• PremiumDNS: A domain name is like an address; seeing the address helps locate the place. This feature provides a more stable and secure “location finding” service. I think it’s unnecessary unless you’re running a high-traffic e-commerce site where even a slight error cannot occur.

After entering your credit card information, click “ Confirm Order “.

You will successfully purchase the domain!

You will receive an order confirmation email.

2. Domain Settings via Namecheap

Go to Account → Dashboard:

Find the domain you want to set up → Click “Manage” on the right:

Ensure Domain → NAMESERVERS → Select “Namecheap BasicDNS”:

Switch to “Advanced DNS” → Add A Record:

• Click “ADD NEW RECORD.”
• Select “A Record” for Type.
• Enter “ @ “ for Host.
• Enter the following values:

185.199.108.153
185.199.109.153
185.199.110.153
185.199.111.153

Four records in total.

• After entering each record, click “✔️” to save the settings.
• Done.

3. Add CNAME Record Based on Your Desired GitHub Pages Repo:

• Click “ADD NEW RECORD.”
• Select “CNAME Record” for Type.
• Enter your desired subdomain for Host; if you want a primary domain, enter “ www “.
• Enter the Value: yourusername.github.io

4. Go Back to GitHub Repo Settings

• GitHub Repo → Settings → Pages
• Custom domain: Enter yourdomain (omit www. if applicable).
• Click Save.

• You can check the box to enforce HTTPS for added security.

Wait for DNS Check…

Typically, confirmation can be completed within five minutes, but due to DNS mechanisms, it may take up to 72 hours for the settings to take effect. If you are sure the steps are correct but confirmation keeps failing, try again in a few days.

Setup Successful!

Go to your domain to verify the results:

Success! 🎉🎉🎉 Now we no longer need to use the old https://yourusername.github.io to access your GitHub Pages; we can directly use https://yourdomain for access!

Other Repos’ GitHub Pages can also be accessed via https://yourdomain/RepoName.

Other Articles

Medium Custom Domain

Medium Custom Domain

Seamless Transfer from Medium to GitHub Pages

Seamless Transfer from Medium to GitHub Pages

If you have any questions or feedback, feel free to contact me.

---

This article was first published on Medium ➡️ Click Here

Automatically converted and synchronized using ZMediumToMarkdown and Medium-to-jekyll-starter.

Improve this page on Github.

Follow Me on Medium 989+ Followers

896 Total Views
Last Statistics Date: 2025-03-11 | 829 Views on Medium.