No servers. No monthly fees. Just your landing page, live in minutes — and optimized for speed.
Whether you’re running Google Ads, launching a product, or just testing an idea — you need a landing page. Building landing pages shouldn’t feel like spinning up a full web server.
In this guide, I’ll show you exactly how to deploy a blazing-fast landing page using Cloudflare Pages + GitHub — no backend, no cost, no stress.
If you’ve never deployed a page before, don’t worry. I’ll walk you through every step — from domain setup to custom URLs — with zero fluff.
Goal: Use Cloudflare + GitHub to deploy a pre-designed landing page.
Why? To deliver lightning-fast load speeds, improve user experience, and make it easy to update content on the fly.
Here’s how to get it done:
Step 1: Prepare Your Domain
First, register a Cloudflare account — it’s simple, so we won’t dwell on it.
Then, buy a domain. This will serve as the primary domain for your landing page deployment.
Point your domain’s DNS to Cloudflare, and install Cloudflare’s free SSL certificate. This makes future redirects and custom domains easier to manage.
Pro Tip: Buy your domain directly from Cloudflare. DNS and SSL setup happens automatically.
For this guide, we’ll use the example domain:https://example.com
Step 2: Plan Your Target URL
Let’s say you’re promoting a pair of Nike running shoes. You’ll want your landing page URL to look like this:
⚠️ Note: Cloudflare defaults to using “pretty URLs” — meaning folder-style paths. That trailing
/indicates a request to find anindex.htmlfile inside thebest-running-shoesfolder.
Avoid using .html in the URL —
For example, https://example.com/best-running-shoes.html
This format may still get redirected, and it could break things unexpectedly.
Step 3: Design the Landing Page
There are plenty of landing page design tools — we won’t go into that here.
Once your design is ready, place all files in a single folder named after your page slug — in this case, best-running-shoes.
Your folder should include:
index.htmlimg/for imagesjs/for JavaScriptcss/for stylesheets
… and anything else your page requires.
Important:
When referencing files inside index.html, always use relative paths — for example:<img src=img/nike.png />
This way, if you ever switch domains for ad targeting, you won’t need to rewrite a single line in your HTML.
The final folder structure should look like this:
Step 4: Create a GitHub Repository
Start by registering a free GitHub account. It’s a quick setup, no need for details here.
What’s a repository?
Put simply: it’s a storage space for code.
Each repository is like a folder that holds a specific type of code.
In our case, it’s where we’ll store the landing page we just designed.
Once logged in:
- Click the “+” icon in the upper-right corner
- Select “New repository”
- （1）In the name field, enter:
example - （2）Under visibility, check “Private” — so only you can view or modify it
- （3）Optionally, check the box to initialize with a README
Leave everything else as default, then hit “Create repository”.
Your example repo is now ready.
Step 5: Upload Your Landing Page Code
First, create the best-running-shoes folder.
- Click “Add file”, then click “Create new file”
- In the filename field, enter the folder name
best-running-shoesfollowed by any file name (for example,readme)
- Click “Commit changes” on the right
The folder is now created.
Next, upload your files into that folder:
- Click “Add file”, then click “Upload files”
- Click “Choose your files”, select
index.htmlfrom your localbest-running-shoesfolder
- Click “Commit changes”
Repeat the same process to create and upload the following folders and their contents:
img(store all images)js(store all JavaScript files)css(store all CSS files)
Once everything is uploaded, your file structure should look like this:
At this point, your landing page files and code are now stored on GitHub.
Step 6: Connect Cloudflare to GitHub
Log in to your Cloudflare dashboard.
From the left-hand menu, click “Workers and Pages”.
Then, click “Pages” tab , select “Import an existing Git repository”
→ “Connect Github”.
You’ll be prompted to authorize access to your GitHub repositories.
Just follow the steps — enter your GitHub credentials.
(If you’ve already authorized access, you won’t need to do this again.)
Once authorized, you’ll be taken to the deployment setup:
- Select the GitHub repo you just created —
example
- No need to change anything, just click “Save and Deploy”
Wait for a few seconds — Cloudflare will handle the deployment in the background.
Once you see the success message, it means the deployment is complete.
The system will automatically generate a URL.
Append /best-running-shoes/ to the end of that link and open it in your browser to test if it’s working correctly.
If the page loads as expected, the deployment was successful.
Step 7: Use a Custom Domain
This is the final step.
The system-generated URLhttps://example-693.pages.dev/best-running-shoes/
already works.
But now, let’s connect your own custom domain, like:https://example.com/best-running-shoes/
Here’s how:
Go to “Set up custom domain”
Enter your domain and click “Continue”
Click “Activate domain”
Wait a few minutes for the DNS to update.
Now, test the new URL:https://example.com/best-running-shoes/
If everything works, you’re ready to use this landing page link for your Google Ads campaigns.
Step 8: Other Notes
- About deployment:
Everything we did above was via the Cloudflare web interface.
Alternatively, you can use GitHub Desktop or command-line tools for deployment. - About redirects:
Cloudflare Pages also includes a powerful redirect feature worth exploring. - About updates:
If you ever need to update the landing page later, just use GitHub’s online editor.
If you have extra time and interest, there’s much more to explore.
If you liked the article, show your support with a clap 👏 and follow me! Feel free to highlight your favorite parts too. Your engagement keeps me inspired!