GitHub Pages with custom DNS
GitHub Pages is a static site hosting service offered by GitHub. It allows users to host personal, organization, or project pages directly from a GitHub repository. This service is commonly used for hosting documentation, personal blogs, or simple websites.
Key Features
- Static Site Hosting: GitHub Pages hosts static websites directly from a GitHub repository, making it easy to publish and maintain web content.
- Jekyll Integration: It supports Jekyll, a popular static site generator, allowing for easy customization and theming of websites.
- Custom Domain Support: GitHub Pages allows users to use a custom domain for their websites, providing flexibility in branding and hosting.
- Version Control Integration: Since it is integrated with GitHub, version control and collaboration features are readily available for managing website content.
- Free Hosting: GitHub Pages provides free hosting for static websites, making it an attractive option for personal and small-scale projects.
Getting started
To get started with GitHub Pages, you can create a new repository on GitHub and enable GitHub Pages in the repository settings. You can then customize your website using Jekyll or by simply pushing HTML, CSS, and JavaScript files to the repository.
Custom DNS
GitHub Pages allows you to use a custom domain for your websites, which means you can point a domain you own to your GitHub Pages site. This is often referred to as setting up custom DNS for GitHub Pages. By configuring the DNS settings for your domain, you can make it resolve to your GitHub Pages site, effectively associating your custom domain with your GitHub Pages website.
Create CNAME file
To create a CNAME file for your custom domain, follow these steps:
- Create a new file in the root of your GitHub Pages repository.
- Name the file “CNAME” (without any file extension).
- Open the “CNAME” file and add your custom domain (e.g., example.com) as the content of the file.
You can consult an example at CNAME.
Crate DNS CNAME record
Navigate to your DNS provider and create a CNAME record that points your subdomain to the default domain for your site. For example, if you want to use the subdomain www.example.com for your user site, create a CNAME record that points www.example.com to <user>.github.io.
If you want to use the subdomain another.example.com for your organization site, create a CNAME record that points another.example.com to <organization>.github.io. The CNAME record should always point to <user>.github.io or <organization>.github.io, excluding the repository name. For more information about how to create the correct record, see your DNS provider’s documentation. For more information about the default domain for your site, see “About GitHub Pages”.
Configure DNS with Cloudflare
If you are using Cloudflare as your DNS provider, follow these steps to configure your custom domain:
- Log in to your Cloudflare account.
- Navigate to your domain’s DNS settings.
- Add a CNAME record with the name “www” and point it to
<user>.github.io. - Ensure the CNAME record is proxied through Cloudflare to benefit from their security and performance features.
Configure GitHub Pages
To set up a www or custom subdomain, such as www.example.com or blog.example.com, you must add your domain in the repository settings. After that, configure a CNAME record with your DNS provider.
On GitHub, navigate to your site’s repository.
Under your repository name, click Settings. If you cannot see the “Settings” tab, select the dropdown menu, then click Settings.
Screenshot of a repository header showing the tabs. The “Settings” tab is highlighted by a dark orange outline.
In the “Code and automation” section of the sidebar, click Pages.
