The Xizoa
2026-07-05 • Website Building

How to Set Up a Blog on Cloudflare Pages + GitHub: A Complete Beginner's Guide

How to Set Up a Blog on Cloudflare Pages + GitHub: A Complete Beginner's Guide

I built xizoa.com on Cloudflare Pages + GitHub because I wanted a blog that was free, fast, and completely under my control. No WordPress dashboards. No monthly hosting bills. Just HTML, a GitHub repository, and Cloudflare's global CDN.

If you're a creator, developer, or solopreneur who wants to own your blog completely, this is the stack for you.

This guide assumes you know what GitHub is but doesn't assume you're a coding expert. I'll walk you through every step I took to build my blog from scratch.

Why Cloudflare Pages + GitHub?

Before we start, let me explain why this matters.

Traditional blogging platforms (Medium, Substack, Notion) are great if you want reach, but they own your content. You're building on rented land.

Self-hosted WordPress gives you control but costs money ($5–15/month minimum) and requires maintenance.

Cloudflare Pages + GitHub gives you: - Free hosting forever (unless you go beyond free tier limits) - Fast delivery (Cloudflare's global network) - Version control (GitHub stores everything, tracks changes) - Custom domain support (xizoa.com points here) - Automatic deployments (push to GitHub → site updates instantly) - No vendor lock-in (your code is yours)

The trade-off? You write HTML/CSS yourself (or use a static site generator). But once it's set up, publishing is just pushing code.

What You'll Need

Before we start, have these ready:

  1. A GitHub account (free, at github.com)
  2. A text editor (VS Code is free, or even Notepad works)
  3. Basic HTML knowledge (or copy-paste willingness)
  4. A domain name (optional but recommended—I use xizoa.com)
  5. Cloudflare account (free, at cloudflare.com)
  6. Git installed on your computer (if working locally; we'll explain alternatives)

If you're on mobile only (like me), you can skip Git and use GitHub Web Editor + Termux. I'll mention that as we go.

Step 1: Create a GitHub Repository

This is where your blog code lives.

  1. Go to github.com and log in
  2. Click "New" (top-left) or go to github.com/new
  3. Fill in:
  4. Repository name: yourusername.github.io (replace yourusername)
  5. Description: "My personal blog"
  6. Public (select this—Cloudflare needs to read it)
  7. Add a README file (check this)
  8. Click "Create repository"

Done. You now have a GitHub repo.

Step 2: Add Your Blog Files to GitHub

You have two options here:

Option A: Web Editor (Easiest, Mobile-Friendly)

If you don't have Git installed (like me on phone):

  1. Go to your new repository
  2. Click "Add file" → "Create new file"
  3. Name it index.html
  4. Paste this starter template:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Blog</title>
    <style>
        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
            max-width: 800px;
            margin: 0 auto;
            padding: 20px;
            line-height: 1.6;
            color: #333;
        }
        h1 { margin-bottom: 10px; }
        .meta { color: #666; font-size: 0.9em; margin-bottom: 20px; }
    </style>
</head>
<body>
    <h1>Welcome to My Blog</h1>
    <p>This is your first blog post. Edit it and add more content.</p>
</body>
</html>
  1. Click "Commit changes"

Option B: Clone Locally (If You Have Git)

git clone https://github.com/yourusername/yourusername.github.io.git
cd yourusername.github.io

Then edit index.html in your text editor, and push:

git add .
git commit -m "Initial blog setup"
git push

Step 3: Connect to Cloudflare

Now Cloudflare will build and deploy your site every time you push to GitHub.

  1. Go to dash.cloudflare.com and log in (create account if needed)
  2. Click "Pages" (left sidebar)
  3. Click "Connect to Git"
  4. Select GitHub and authorize Cloudflare
  5. Pick your repository (yourusername.github.io)
  6. Under Build settings:
  7. Framework: None (if using plain HTML)
  8. Build command: Leave blank
  9. Build output directory: Leave blank
  10. Click "Save and Deploy"

Cloudflare will instantly deploy your site. You'll get a URL like:

https://yourusername.pages.dev

Visit it. Your blog is live.

Step 4: Add Your Custom Domain (Optional)

I use xizoa.com. Here's how:

If you already own a domain:

  1. In Cloudflare Pages, go to your project → Settings → Domains
  2. Click "Add domain" and enter yourdomain.com
  3. Cloudflare gives you nameservers. Go to your domain registrar (GoDaddy, Namecheap, etc.) and update the nameservers there
  4. Wait 24–48 hours for DNS to propagate

If you don't own a domain yet:

Domain costs ~₹300–500/year in India. I use Namecheap. Once you buy it, follow the steps above.

Step 5: Create Your First Real Blog Post

Now that the setup is done, let's add actual content.

Create a new file in GitHub Web Editor:

  1. Go back to your repository
  2. Click "Add file" → "Create new file"
  3. Name it posts/first-post.html
  4. Use this template:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My First Blog Post</title>
    <style>
        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
            max-width: 800px;
            margin: 0 auto;
            padding: 20px;
            line-height: 1.6;
            color: #333;
        }
        .meta { color: #666; font-size: 0.9em; margin-bottom: 20px; }
        a { color: #0066cc; }
    </style>
</head>
<body>
    <a href="/">← Back to Home</a>

    <h1>My First Blog Post</h1>
    <div class="meta">Published: July 5, 2026</div>

    <p>This is my first post. I'll write about what I'm learning as I build in public.</p>
    <p>Add more paragraphs here...</p>
</body>
</html>
  1. Commit the changes

Then update your index.html to link to it:

<h1>My Blog</h1>
<ul>
    <li><a href="/posts/first-post.html">My First Blog Post</a></li>
</ul>

Step 6: Automate (Optional but Recommended)

Once you're comfortable, you can:

  • Add an RSS feed (Python script that generates it automatically)
  • Build a sitemap (helps SEO)
  • Dark mode toggle (CSS + JavaScript)

I did this for xizoa.com using Python + GitHub Actions. It's overkill for beginners, so skip it for now.

Publishing Workflow (Going Forward)

Every time you publish:

  1. Edit index.html to add a link to your new post
  2. Create a new file in the posts/ folder
  3. Commit to GitHub
  4. Cloudflare automatically rebuilds and deploys within seconds

That's it.

Troubleshooting

Site not updating after I pushed?

Give Cloudflare 2–3 minutes to rebuild. Check the Deployments tab in Cloudflare Pages to see build logs.

Custom domain not working?

DNS changes take 24–48 hours. Check your domain registrar's nameservers match Cloudflare's.

Want to use a static site generator (Hugo, Jekyll)?

That's next-level. For now, stick with plain HTML. Once you have 10 posts, optimize.

Next Steps

  1. ✅ Set up the repo
  2. ✅ Connect Cloudflare
  3. ✅ Publish your first post
  4. Write your second post (this is the hard part—you now have the system, focus on content)

The platform is done. The real work is writing.

Honest truth: I spent 2 weeks overthinking the design and automation before I published a single post. Don't do that. Get 10 posts written, then optimize.

Your blog setup is now live. Now comes the part that actually matters: writing what you've learned.

Building Xizoa in public. No fake expertise. Just documenting the journey.

Discussions & Feedback