How to Set Up a Custom Domain on GitHub Pages

Hosting a static website on GitHub Pages is a great way to build a professional web presence for free, but using a custom domain gives it that extra touch of professionalism. Here’s a detailed guide on how to set up a custom domain on GitHub Pages.

Step 1: Register a Custom Domain

Before you can configure GitHub Pages, you’ll need to purchase a domain name. You can buy domains from various registrars such as Namecheap, GoDaddy, or Google Domains.

Once you’ve registered the domain, you’ll have access to its DNS settings, which is crucial for the next steps.

Step 2: Configure Your DNS Settings

After acquiring your custom domain, you'll need to configure DNS records to point the domain to GitHub’s servers. Here’s how:

  1. Login to your domain registrar's account.
  2. Access the DNS settings or DNS management section.
  3. Add the following A records to your domain:
    • 185.199.108.153
    • 185.199.109.153
    • 185.199.110.153
    • 185.199.111.153
    These IP addresses are GitHub’s servers that will handle the hosting of your custom domain. For more details on this, check out GitHub Docs - Configuring an A record.
  4. Add a CNAME recordif you’re using a subdomain (like www):
    • Name/Host/Value: www
    • Points to: username.github.io (replace username with your GitHub username)

More detailed instructions on configuring CNAME records can be found on GitHub Pages Documentation.

Step 3: Add the Custom Domain in GitHub

Now that your domain is pointing to GitHub Pages via DNS, the next step is to link your GitHub Pages repository to the domain.

  1. Go to the repository for your website.
  2. Click on Settings.
  3. Scroll down to the GitHub Pages section.
  4. In the Custom domain field, enter your custom domain name (e.g., www.mysite.com).
  5. Click Save.

Once saved, GitHub will automatically create a CNAME file in the root of your repository, which ensures that GitHub Pages knows your custom domain is linked to your site.

For more detailed information on this step, check out GitHub's official guide.

Watch video on adding a custom domain on github

Step 4: Enforce HTTPS

After setting up your custom domain, it's recommended to enforce HTTPS for security reasons. GitHub Pages provides a free SSL certificate through Let's Encrypt.

  1. Navigate back to the GitHub Pages settings in your repository.
  2. Check the box labeled nforce HTTPS.

This ensures that visitors access your website securely via https://. More information on HTTPS setup is available in GitHub Pages Documentation.

Step 5: Allow Time for DNS Propagation

DNS changes typically take time to propagate across the web, so your custom domain may not work immediately. It may take up to 24-48 hours for the changes to take effect. You can use online tools like DNSChecker to monitor the progress of DNS propagation.

Troubleshooting Tips

If your custom domain isn’t working as expected, here are a few common troubleshooting tips:

  • DNS Settings Check: Make sure your DNS records are correctly configured. You can use What's My DNS to verify.
  • Clear Cache: Sometimes, your browser's cache may be holding old DNS records. Clear your browser’s cache or use an incognito window to check the changes.
  • GitHub Pages Configuration: Double-check that your custom domain is correctly entered in your repository settings and that the CNAME file exists.

For more detailed troubleshooting, GitHub’s official help page provides extensive information.

By following this guide, you should have your custom domain set up and working on GitHub Pages in no time!

© Copyright 2024 Art Sentinel - All Rights Reserved