Jason's Web Premium live previews, social-ready visuals, and simple setup guides
Cloudflare guide

Connect your real domain after GitHub Pages is already live.

This guide is mainly about DNS. Keep it simple: point the domain the right way in Cloudflare, then tell GitHub Pages which domain belongs to the site.

Back to Guide Hub Back to Templates

What this guide does

Keep it simple Move in order and do not skip around unless you already know the step.
Wording may vary slightly Big sites change buttons sometimes, so focus on the meaning of the step.
Come back later These pages are here so you can re-open them any time without digging through chat.
Step by step

Click-by-click walkthrough

Read one step, do that one step, then come back. That is the whole idea here.

1

Make sure GitHub Pages already works

Before touching the domain, confirm that your GitHub Pages link opens the site correctly.

  • If the GitHub link is not working yet, stop here and finish the GitHub guide first.
2

Sign in to Cloudflare

Open Cloudflare, sign in, and click the domain you want to use for the website.

  • You should now be looking at that domain's dashboard area.
3

Open the DNS page

Find and click the DNS section for the domain.

  • This is where the records live.
4

Add the root A records

If you want the plain root domain to work too, add A records for @ that point to GitHub Pages.

  • Use 185.199.108.153
  • Use 185.199.109.153
  • Use 185.199.110.153
  • Use 185.199.111.153
5

Add the www CNAME record

Add a CNAME record where the name is www and the target is your GitHub Pages address.

  • The target usually looks like yourusername.github.io
  • If Cloudflare asks about proxy status, use DNS only for GitHub Pages style records.
6

Save the DNS records

Double-check the values, then save the records.

  • The root A records and the www CNAME are the main pieces most people need.
7

Go back to GitHub Pages settings

Open your GitHub repository again and go back to Settings, then Pages.

  • Now you are telling GitHub which custom domain belongs to this site.
8

Type your custom domain

In the custom domain box, enter the domain you want attached to the site.

  • Example: yourdomain.com
  • Some people prefer starting with www first, then adding the root domain too.
9

Save the custom domain

Save the custom domain in GitHub Pages and give it a little time to process.

  • GitHub may take a bit before the custom domain is fully recognized.
10

Wait for DNS to settle

Give the records a little time. Then test both the root domain and the www version.

  • Sometimes one works first and the other follows later.
11

Turn on HTTPS when available

When GitHub shows the HTTPS option as available, turn it on.

  • If the box is gray at first, wait and check again later.
12

Test the final website

Visit the domain in your browser and make sure the site loads correctly.

  • If it still shows old content, refresh hard or wait a bit longer for DNS updates to finish.