Skip to content

Instantly share code, notes, and snippets.

@cvan

cvan/HOWTO.md

Last active May 16, 2025 06:07
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save cvan/8630f847f579f90e0c014dc5199c337b to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save cvan/8630f847f579f90e0c014dc5199c337b to your computer and use it in GitHub Desktop.
Download ZIP
How to serve a custom HTTPS domain on GitHub Pages with CloudFlare: *FREE*, secure and performant by default
Raw
HOWTO.md

Instructions

CloudFlare is an awesome reverse cache proxy and CDN that provides DNS, free HTTPS (TLS) support, best-in-class performance settings (gzip, SDCH, HTTP/2, sane Cache-Control and E-Tag headers, etc.), minification, etc.

  1. Make sure you have registered a domain name.
  2. Sign up for CloudFlare and create an account for your domain.
  3. In your domain registrar's admin panel, point the nameservers to CloudFlare's (refer to this awesome list of links for instructions for various registrars).
  4. From the CloudFlare settings for that domain, enable HTTPS/SSL and set up a Page Rule to force HTTPS redirects. (If you want to get fancy, you can also enable automatic minification for text-based assets [HTML/CSS/JS/SVG/etc.], which is a pretty cool feature if you don't want already have a build step for minification.)
  5. If you don't already have one, create a new repository on GitHub to store your site's contents (preferably in the form of static web pages and assets; though not necessary, for the A-Frame site we use a static-site generator called Hexo).
  6. From your domain registrar's settings, create a CNAME record to point <domain>.<tld> to <user>.github.io. (Refer to the GitHub docs for more information.)
  7. In your Github repo, create a file at the root called CNAME containing the domain name (e.g., aframe.io).
  8. Push to GitHub Pages (either by pushing to gh-pages or master of your repo; or you can use the master branch of a repo named <org>.github.io - example: https://github.com/aframevr/aframevr.github.io/ automatically gets published to https://aframevr.github.io/, which redirects to https://aframe.io/)
  9. You're done! All content will now be served to your users from CloudFlare.
@colinbrislawn
Copy link

colinbrislawn commented Feb 10, 2018

After running 3. point the nameservers to CloudFlare's, all your DNS setting must be changed in Cloudflare!
(I spent time changing settings in Hover, only to discover at it's all-CloudFlare, all-the-time, after changing DNS settings.)
🌩️ ⚡

@alexgtn
Copy link

alexgtn commented Feb 10, 2018 •
edited
Loading

Thanks bro! Yea Cloudflare DNS requires proper cleanup for this to work.

@hopes91
Copy link

hopes91 commented Mar 14, 2018

Thank you!

@micnguyen
Copy link

micnguyen commented Apr 1, 2018 •
edited
Loading

I'm having the same question as @Andrew-Max: My github pages is served under <username>.github.io/<repo>, where would I configure that in Cloudfare/Registrar/GitHub for that to work?

EDIT: I just decided to move my page to a user github page hosted under <username>.github.io and everything works and is secure. Thanks!

@GuiSim
Copy link

GuiSim commented Apr 13, 2018 •
edited
Loading

@rugk I understand the importance of Strict but I couldn't set it up. How would the SSL certificate on my github page be valid if I set a CNAME on github? Even CloudFlare's official guide (see above) recommends using Full but not Full (strict). I don't see how it could work.

@gpkc
Copy link

gpkc commented Apr 20, 2018

I looks like the option "Always use HTTPS" is not served as a page rule anymore.
I found this option under the Crypto tab.

@aneeshmg
Copy link

aneeshmg commented May 13, 2018

@gpkc are you sure? cause I was able to find the "Always use HTTPS" as a page rule.

@newswim
Copy link

newswim commented May 22, 2018

Just so everyone's aware, Github Pages now supports forced HTTPS for custom domains.

https://blog.github.com/2018-05-01-github-pages-custom-domains-https

@snmslavk
Copy link

snmslavk commented Aug 9, 2018

I described my experience here when I tried to configure it
https://medium.com/@avsenev/build-your-website-with-github-pages-godaddy-and-cloudflare-62ac7cb3faed

Unfortunately I faced the situation that this approach is not covered all my needs and I switched to amazon s3 and route53.

@awwsmm
Copy link

awwsmm commented Oct 3, 2019

Brilliant! Thanks a lot

@usamasshafique
Copy link

usamasshafique commented Apr 25, 2020

I have done all the steps above mentioned but when I open GitHub webpage it displays an error 521

@cvan
Copy link
Author

cvan commented Apr 28, 2020

I have done all the steps above mentioned but when I open GitHub webpage it displays an error 521

@usama-shafiqu3: you have a CNAME file at the root of your repo? if you go to the Settings page of your repo, scroll down to the GitHub Pages section, you can see whether it's configured on the correct branch (master or gh-pages).

@Aurorum
Copy link

Aurorum commented May 26, 2020

For those wondering about the link in step six which now seems to be broken, the guide is here: https://help.github.com/en/github/working-with-github-pages/managing-a-custom-domain-for-your-github-pages-site

@cvan
Copy link
Author

cvan commented May 26, 2020

@Aurorum fixed link; thanks

@aneessh18
Copy link

aneessh18 commented Jan 30, 2022

brilliant, thanks a lot.
this articles was supplemented by your steps
https://blog.cloudflare.com/secure-and-fast-github-pages-with-cloudflare/

@tomekit
Copy link

tomekit commented May 4, 2022 •
edited
Loading

If despite all that, you're still getting: "404 File not found The site configured at this address does not contain the requested file." your repo might be configured to use: main instead of master branch. You may try to change default repo back to master, but Github Pages doesn't seem to care about that (you may have to modify Actions/Workflows)... but hey don't worry, at least you support some good cause, the more time you waste/spend on things like this !

@taufiq33
Copy link

taufiq33 commented Jun 9, 2022

Great Tutorial! thanks for sharing

@bkingg
Copy link

bkingg commented Dec 1, 2023

I managed to have HTTPS on my custom domain without any third party.

  • Make sure your A record points to the correct IP addresses
  • Create a CNAME record www and set it to <USERNAME>.github.io
  • Go back to your repo settings and remove the custom domain and re-enter it then Save.
  • HTTPS checkbox should be checked after certificate issued

@TiloGit
Copy link

TiloGit commented Feb 24, 2024

I managed to have HTTPS on my custom domain without any third party.

* Make sure your A record points to the correct IP addresses

* Create a CNAME record **www** and set it to <_USERNAME_>.github.io

* Go back to your repo settings and remove the custom domain and re-enter it then Save.

* HTTPS checkbox should be checked after certificate issued

did you use Cloudfare (CF) Proxy DNS or disabled that?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment