Cloudflare DNS + GitHub Pages: Custom Domain and SEO for Your al-folio Site
Running an al-folio site on GitHub Pages is a great setup — fast, free, and version-controlled. But by default your site lives at username.github.io, which isn’t great for branding or SEO. This post walks through connecting a custom domain via Cloudflare DNS, then configuring al-folio’s built-in SEO features to make sure search engines actually find and rank your content.
Part 1: Cloudflare DNS Setup
Prerequisites
- A registered domain (from any registrar — Namecheap, Google Domains, Porkbun, etc.)
- A Cloudflare account (free tier is fine)
- Your al-folio site deployed to GitHub Pages at
username.github.io
Step 1: Add Your Domain to Cloudflare
- Log in to cloudflare.com and click Add a Site.
- Enter your domain (e.g.
yourname.com) and choose the Free plan. - Cloudflare will scan your existing DNS records. Review them, then continue.
- Cloudflare will give you two nameserver addresses, something like:
aria.ns.cloudflare.com bob.ns.cloudflare.com - Go to your domain registrar and replace the existing nameservers with Cloudflare’s. This step hands DNS control to Cloudflare. Propagation can take up to 24 hours, but is usually much faster.
Step 2: Add DNS Records in Cloudflare
Once your domain is active in Cloudflare, navigate to DNS → Records and add the following.
A Records (apex domain)
Add four A records pointing your root domain (@) to GitHub Pages’ IP addresses:
| Type | Name | Content | Proxy Status |
|---|---|---|---|
| A | @ | 185.199.108.153 | DNS only |
| A | @ | 185.199.109.153 | DNS only |
| A | @ | 185.199.110.153 | DNS only |
| A | @ | 185.199.111.153 | DNS only |
Important: Set Proxy Status to DNS only (grey cloud), not Proxied (orange cloud). If you proxy through Cloudflare, GitHub Pages cannot provision a Let’s Encrypt SSL certificate for your domain, which you need for the enforced HTTPS option.
CNAME Record (www subdomain)
| Type | Name | Content | Proxy Status |
|---|---|---|---|
| CNAME | www | username.github.io | DNS only |
This lets www.yourname.com resolve to your site. Replace username with your actual GitHub username.
Optional: IPv6 AAAA Records
GitHub Pages also supports IPv6. Adding these is good practice:
| Type | Name | Content | Proxy Status |
|---|---|---|---|
| AAAA | @ | 2606:50c0:8000::153 | DNS only |
| AAAA | @ | 2606:50c0:8001::153 | DNS only |
| AAAA | @ | 2606:50c0:8002::153 | DNS only |
| AAAA | @ | 2606:50c0:8003::153 | DNS only |
Step 3: Configure the Custom Domain in GitHub
- In your GitHub repository, go to Settings → Pages.
- Under Custom domain, enter your apex domain (e.g.
yourname.com) and click Save. - GitHub will create (or update) a
CNAMEfile at the root of your repo. Make sure this file is committed and not gitignored. For al-folio sites deployed via GitHub Actions, you may need to add this file manually to your repo root. - Wait a few minutes, then check the Enforce HTTPS checkbox. If it’s greyed out, DNS hasn’t fully propagated yet — give it another 10–30 minutes.
Verify DNS with dig
Once propagation is done, confirm your records are correct:
# Check A records
dig yourname.com +noall +answer -t A
# Expected output:
# yourname.com. 3600 IN A 185.199.108.153
# yourname.com. 3600 IN A 185.199.109.153
# yourname.com. 3600 IN A 185.199.110.153
# yourname.com. 3600 IN A 185.199.111.153
# Check CNAME for www
dig www.yourname.com +noall +answer -t CNAME
Step 4: Update _config.yml with Your Custom Domain
Open _config.yml in your al-folio repo and update the url field:
url: https://yourname.com # your custom domain, NOT username.github.io
baseurl: "" # leave empty for apex domains
This is important — al-folio uses url and baseurl to generate canonical URLs, Open Graph tags, and the sitemap. If these are wrong, your SEO metadata will point to the wrong domain.
Part 2: SEO Configuration in al-folio
Al-folio ships with several SEO features built in. Most of them just need the right values in _config.yml and your post front matter.
What al-folio gives you out of the box
-
jekyll-seo-tag— generates<title>,<meta name="description">, Open Graph (og:), and Twitter Card tags on every page automatically. -
jekyll-sitemap— generates/sitemap.xmlfor search engine crawlers. -
robots.txt— included at the root with permissive crawl rules. - Canonical URLs — built into the SEO tag plugin, preventing duplicate content penalties.
_config.yml SEO settings
Here are the key fields to fill in:
# Site identity
title: Your Name
first_name: First
last_name: Last
email: you@yourname.com
description: >
Academic researcher and engineer. Writing about systems,
machine learning, and the occasional DevOps rabbit hole.
# URL — must be your custom domain once Cloudflare is set up
url: https://yourname.com
baseurl: ""
# Keywords used in <meta name="keywords">
keywords: jekyll, academic, portfolio, machine-learning
# Language
lang: en
# Social — used in SEO tags and footer
social:
name: Your Full Name
links:
- https://twitter.com/yourhandle
- https://github.com/yourusername
- https://linkedin.com/in/yourprofile
# Google Analytics (optional but useful for tracking search performance)
google_analytics: G-XXXXXXXXXX # your Measurement ID
# Google Search Console verification
google_site_verification: your-verification-token
The social.links array is picked up by jekyll-seo-tag and rendered as sameAs JSON-LD structured data, which helps Google associate your profiles across the web.
Per-post front matter for SEO
For each blog post, these front matter fields directly influence how the page is indexed and displayed in search results:
---
layout: post
title: "Your Post Title" # <title> tag and og:title
date: 2026-05-17
description: "A concise summary of what this post covers. Aim for
150–160 characters — this is what appears in Google's
search result snippets."
tags: [tag1, tag2, tag3]
categories: [category]
og_image: /assets/img/posts/your-preview-image.jpg # og:image for link previews
---
Tip on descriptions: Write these as if they’re ad copy. They don’t directly affect ranking, but a good description improves click-through rate from search results, which does.
Enabling Google Search Console
Once your domain is live:
- Go to search.google.com/search-console.
- Add a new property using your custom domain.
- Google will ask you to verify ownership. The easiest method is the HTML tag approach — copy the
contentvalue from the meta tag Google provides, and paste it into_config.yml:
google_site_verification: abc123yourtokenhere
Al-folio’s _includes/head.html already outputs this tag when the field is set. Rebuild and push, then click Verify in Search Console.
- Once verified, submit your sitemap:
https://yourname.com/sitemap.xml
Checking your sitemap and robots.txt
After deploying with your custom domain set in _config.yml, verify these are generating correctly:
https://yourname.com/sitemap.xml
https://yourname.com/robots.txt
The default robots.txt in al-folio looks like:
User-agent: *
Allow: /
Sitemap: https://yourname.com/sitemap.xml
If you want to exclude certain pages (e.g. a /drafts/ path or /admin/), you can add Disallow rules here.
Structured Data (JSON-LD)
Al-folio doesn’t output rich structured data by default beyond what jekyll-seo-tag provides. If you want to add BlogPosting schema to individual posts (which can enable rich results in Google), add a _layouts/post.html override with a JSON-LD block:
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BlogPosting",
"headline": "Cloudflare DNS + GitHub Pages: Custom Domain and SEO for Your al-folio Site",
"datePublished": "2026-05-17T00:00:00+00:00",
"description": "Step-by-step guide to pointing a custom domain at your GitHub Pages site using Cloudflare DNS, and tuning your al-folio Jekyll theme for solid SEO.",
"url": "https://crystalhansen.ca/blog/2026/cloudflare-dns-github-pages-seo-al-folio/",
"author": {
"@type": "Person",
"name": "Crystal Hansen"
}
}
</script>
Quick Reference
| Task | Where |
|---|---|
| Add A records for apex domain | Cloudflare DNS → Records |
Add CNAME for www | Cloudflare DNS → Records |
| Set Proxy Status | DNS only (grey cloud) for all GitHub Pages records |
| Set custom domain | GitHub repo → Settings → Pages |
Update url field | _config.yml |
| Set site description & keywords | _config.yml |
| Enable Google Search Console | google_site_verification in _config.yml |
| Submit sitemap | Google Search Console → Sitemaps |
| Per-post SEO | description and og_image in post front matter |
Wrapping Up
The Cloudflare + GitHub Pages combination is hard to beat for a personal or academic site: free CDN, DDoS protection, and a clean DNS dashboard. The key gotcha is keeping records in DNS only mode so GitHub can handle HTTPS itself — don’t let Cloudflare proxy the connection until you have the SSL cert provisioned.
On the SEO side, al-folio handles the heavy lifting through jekyll-seo-tag and jekyll-sitemap. The main things left for you to do are fill in _config.yml properly, write good post description fields, and register with Google Search Console so you can actually track how your content performs in search.