Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
If you've purchased a domain name for your website, you can configure it so that it points to your site hosted on GitHub pages.
Further reading
Resources
- Tips for configuring an A record with your DNS provider
- What is a CNAME record?
- What is an A record?
GitHub IP addresses
- 185.199.108.153
- 185.199.109.153
- 185.199.110.153
- 185.199.111.153
Video review
- When configuring a custom domain name with GitHub Pages you: create a CNAME containing your custom domain name, point your custom domain's A record to GitHub's servers, then wait for the changes to take effect.
- To redirect a custom domain to your GitHub Pages site, create a CNAME file that specifies the custom domain.
- CNAME stands for 'canonical name'; it's a type of record used for creating aliases for domains.
- In the CNAME file is where you specify that a domain name is an alias for another domain.
- When creating the CNAME, you need to name the CNAME file in all uppercase letters.
- The 'www.' in the domain is optional in the CNAME.
- The CNAME can contain only one domain.
- An A (Address) record points a domain to one or more IP addresses.
- Make sure you read the instructions provided by your domain service before you create an A record.
Related videos
Besides being free, one of the best parts
about hosting your site with GitHub Pages
0:00
is that you can use your own domain name.
0:04
If you've purchased a domain name for
your website, you can configure it so
0:06
that it points to your site
hosted on GitHub Pages.
0:09
So, I'm gonna show you how by configuring
the custom domain name I own,
0:13
frontendcourses.com, to point to
the GitHub Pages server from my site at
0:17
guilh.githug.io.
0:21
That way, when we type the custom domain
in the address bar, it will go to GitHub
0:24
pages, but the web address we see
will always be frontendcourses.com.
0:28
When configuring a custom
domain name with GitHub pages,
0:33
you'll need to follow three simple steps.
0:36
First, create a CNAME file
containing your custom domain name.
0:38
Then point your custom domain's
A record to GitHub's DNS, then wait for
0:42
the changes to take effect.
0:47
So, first, to redirect a custom
domain to your GitHub page's site,
0:49
you need to create a CNAME file
that specifies the custom domain.
0:54
So, I'm going to create the CNAME file in
the root of my course's directory first,
0:59
then commit the file to my GitHub
user pages website repository.
1:05
When creating the CNAME, you need to name
the c name file in all upper case letters.
1:11
CNAME stands for canonical name,
and it's a type of record used for
1:18
creating aliases for domains.
1:22
In the CNAME file is where we specify
that a domain name is an alias for
1:24
another domain.
1:28
So for example, the domain for
my website is currently the github domain,
1:30
guilh.github.io, but
1:35
I wanna use my domain name
frontendcourses.com as the alias.
1:39
So I need to write that domain
name in the CNAME file, and
1:45
that's all you have to write.
1:50
Now the www in the domain is
optional in the CNAME, and
1:52
it's important to remember that
the CNAME can contain only one domain.
1:55
Once I push the CNAME to GitHub,
it will point the GitHub page's domain,
2:00
guilh.github.io to
the frontendcourses.com domain.
2:05
Back in the terminal,
if I run a git status,
2:10
it lists the new untracked CNAME file.
2:14
So now I'm going to add and commit this
file to my local repository by typing git
2:18
add period, and git commit -m,
2:23
and as the commit messages
say add see name.
2:28
And finally, I'll push it up to
the project's master branch by typing git,
2:33
push, origin, master.
2:37
So now if I go back to
my github repository and
2:44
refresh, we can see that the CNAME
is now inside the repository.
2:47
Although I created a CNAME file and pushed
it up to github, the rest of the web
2:52
doesn't know that my custom domain
name points to this GitHub account.
2:57
To do that, I have to update the DNS,
3:01
or domain system record, for
the frontendcourses.com domain.
3:04
I can do that by creating an address
record, also called an A record.
3:09
An A record is used to point a domain
to one or more IP addresses.
3:13
So I'm going to create an A record
that points to the domain,
3:19
frontendcourses.com, to
GitHub Pages IP addresses.
3:22
You'll usually create an A record
through your domain name provider.
3:27
Keep in mind that domain name services
are different, so make sure you read
3:30
the instructions provided by your domain
name service before you begin this step.
3:34
And I've also posted helpful
links about creating A records
3:38
in the teacher's notes of this workshop.
3:41
I registered my domain
name with namecheap.com.
3:44
Using namecheap's domain manager I created
3:48
two A records that resolve
to these two IP addresses.
3:52
Now, these are the GitHub IP addresses,
which you can find on GitHub's website,
3:56
and I've also posted them
in the teacher's notes.
4:01
Once I create and
save the new domain savings,
4:03
it will map frontendcourses.com
to these IP addresses.
4:06
Now, depending on your service,
4:11
it can take up to 25 hours for
this to take effect, but
4:13
it's usually much faster, and often within
a few minutes, so, let's take a look.
4:16
So, I'll open up a new tab and
type frontendcourses.com.
4:21
Great.
So, now it points to my GitHub pages site.
4:28
So, that's it.
4:33
My site is now live on the web.
4:34
If you want to learn more about DNS,
A records, and CNAME,
4:37
I've posted links to Treehouse videos
on those topics in the teacher's notes.
4:41
If you've just set up and hosted your
very first website via GitHub pages,
4:46
congratulations that's a pretty big deal.
4:50
Hey, even I still get excited every
time I see a new project I built
4:52
go live on the web.
4:55
It's a rewarding feeling.
4:56
So now that you're site is up
on the web for the world to see,
4:58
be sure to share your site
with the Treehouse community.
5:00
Thanks everyone.
5:03
You need to sign up for Treehouse in order to download course files.
Sign up