How to Add Custom Domain To GitHub Pages?

Adding a custom domain to your GitHub Pages site can significantly enhance its professional appearance and make it easier for your audience to remember and access. This guide will walk you through the process step-by-step, ensuring you can easily configure your custom domain and optimize your site's visibility.

Prerequisites

• How to Publish a Static Website on GitHub?
• How to Deploy Your React Websites on GitHub?

Steps to Add Custom Domain To GitHub Pages

Step 1: Getting the custom domain

The first step is to buy a domain of our choice. We can buy from any domain registered, usually, Google domains are considered the best in the market. However, I chose to go with GoDaddy because of their discount price on the domain of my choice. I got webrachna.in, which will be connected to GitHub pages in subsequent steps.

Step 2: The gh-pages branch

In this step, we will create a new branch in our project repository and give it a name gh-pages.

Now we will make gh-pages the default branch in this repository. By first going to settings and clicking the branch tab.

Now we will go the options page inside settings and scroll to GitHub Pages section. Here we will get a URL to the website that we just hosted. In this case the URL id https://ankitkj1999.github.io/WebRachna

Step 3: Connecting domain to the website

Now we will visit the DNS management page of the domain that we have bought and below is the view of GoDaddy's DNS page.

Here we will delete all and then add the four A type records as shown in the image below. The first four records are what we have to add.

Now we will go back to the GitHub Pages section in the settings and add our custom domain in the field asking for it and hit save. 

Then the page will reload, and we will see our custom domain in the place of the default github.io URL. Now we can see our website hosted on our custom domain. Most of the time it works quickly but it can take up to 24 hours to connect our custom domain to GitHub pages.

And if you want to host your static website on Firebase which is a comparatively better option refer to this article: Hosting A Static Website On Firebase For Free.