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