GitHub pages 2 | Get a custom domain name
Now we want to give our new website a cool looking name.
The product I am building is called the azure data platform, so I want to use azuredataplatform.net
Steps:
- Find a great domain and buy it
- Point the domain to GitHub
- add the domain to GitHub
Step 1: Find a great domain and buy it
There are tons of locations where you can buy a domain. One of the biggest is GoDaddy, I prefer Google Domains because their prices appear to be more stable to me.
Once you bought it it will appear under My domains and you can go to the properties with the Manage Button
I will use my own site azuredataplatform.net
Step 2: Point the domain to GitHub
In the Manage Settings you will find DNS
From here we need to point the new domain to GitHub To do so, please add 2 custom records: 1. Type A record 1. Type CNAME record
The Type a record needs to point to GitHubs IP-Addresses. Do not put anything in the field “Host name”. Enter the following records into the field “Data” (add more with the +)
- 185.199.108.153
- 185.199.109.153
- 185.199.110.153
- 185.199.111.153
The Type CNAME record needs to point to your GitHub repository. Please create a new record and enter www in the field “Host name”. Enter the following record into the field “Data”.
- 001328.github.io
Then hit Save
Step 3: add the domain to GitHub
Now go to your github repository, open the settings for Pages and enter your newly created domain into the field for Custom domain and Save
It will check the DNS records you just made and once successful publish your new website.
Once the DNS check is successful your website is published with your new name! Please be aware that GitHub needs to provision a TLS certificate to ensure it’s secure.
Once the certificate is provisioned, select the option Enforce HTTPS
Attention: It can take an hour until your website works properly
Step 4: Fix CSS
When you change your domain name your website will probably look like this
To fix it just adjust the baseurl and url in your local config file, then push the changes to github
remember to wait 1 Minute so the CSS can load
The final result:
The End
This Tutorial follows the offical Github Docs with a littlle help from this guy
By the way - DNS means Domain Name Service