Shoutout Digital — Internal Guide

Hosting Reports with
Cloudflare Pages

How to publish HTML reports from Claude as a live client link — step by step, no technical experience needed.

1
Download from Claude
2
Rename to index.html
3
Create a folder
4
Upload to Cloudflare
5
Share the link
Before You Start
What you need
Make sure you have these three things ready before you begin.
💡
Each team member should have their own free Cloudflare account. Use any email you have access to — Gmail is fine. No credit card needed.
Step 1
Download the HTML file from Claude
Once Claude generates the report, download it to your computer.
1
Find the download button on the artifact
Top-right corner of the white report panel in Claude
claude.ai
Magical Smiles — May 2026 Report
⟨/⟩
↓ Download
May 2026 Monthly Report
Social Media Performance ........... ████
Engagement Rate .................... ████
💡
The download button is the downward arrow in the top-right corner of the report. Click it and the file will save to your Downloads folder as an .html file.
Step 2 — Critical
Rename the file to index.html
This is the most important step. Cloudflare needs a file named exactly index.html to know what page to show. If you skip this, the page will show a 404 error.
1
Find the downloaded file and rename it
It's probably called something like report.html or artifact.html
report.html
index.html ✓

On Mac: Click the file once → press Return → type index.html → press Return

On Windows: Right-click the file → click Rename → type index.html → press Enter

⚠️
Do not skip this step. If the file is still named report.html or anything else, Cloudflare will show a 404 error and the client won't see anything.
Step 3
Create a folder and put the file inside
Cloudflare needs you to upload a folder, not just the file by itself. Create a folder named after the client and month, then put index.html inside it.
1
Create a new folder on your computer
Name it after the client and month

Use this naming format for the folder:

client-name-month-report
ClientMonthFolder name
Absolute SmilesMayabsolute-smiles-may-report
Chapman RoadAprilchapman-road-april-report
Aurora SmilesJuneaurora-smiles-june-report

On Mac: Right-click on your Desktop → New Folder → name it

On Windows: Right-click on your Desktop → New → Folder → name it

2
Move the index.html file into the folder
Drag it in — make sure it's directly inside, not in a subfolder

Your folder should look exactly like this:

📁 absolute-smiles-may-report/
index.html
⚠️
Make sure index.html is directly inside the folder — not inside another folder inside the folder. That's a common mistake.
Step 4
Upload to Cloudflare Pages
Follow these steps exactly — the "Get started" link is the key step that gets you into Pages and not Workers.
1
Go to Workers & Pages and click "Create application"
Blue button in the top right of the Workers & Pages screen
dash.cloudflare.com
⟨/⟩ Workers & Pages
Build & deploy serverless functions, sites, and full-stack applications.
Documentation
Create application
No projects found. You have not created any projects yet.
2
At the bottom, click "Get started" next to "Looking to deploy Pages?"
Do NOT click any of the options above it — this bottom link is what gets you into Pages
dash.cloudflare.com/pages/new
Ship something new
Select from a git repo, drag and drop your code or select a template.
🐙Connect GitHub
🦊Connect GitLab
🌐Start with Hello World!
🔵Select a template
📁Upload your static files
Looking to deploy Pages?
⚠️
This is the most confusing part. The options above (GitHub, GitLab, Upload your static files) are for Workers. Ignore them. The only thing to click here is "Get started" at the very bottom next to "Looking to deploy Pages?"
3
Choose "Drag and drop your files" and click "Get started"
Do not choose Import Git repository — that's for developers
dash.cloudflare.com/pages/new/upload
← Create a Worker
Get started
Get started with Pages. How would you like to begin?
Import an existing Git repository
Start by importing an existing Git repository.
Get started
☁️
Drag and drop your files
Upload your site's assets including HTML, CSS, and JS files directly from your computer.
Get started
💡
Always choose Drag and drop your files and click its Get started button. The blue button means that's the right one.
4
Type the project name, click "Create project", then upload your folder
The project name becomes your URL — name it carefully
dash.cloudflare.com/pages/new/upload
Deploy a site by uploading your project
Name your project and upload your site's assets including HTML, CSS, and JS files that you would like to deploy.
1
Create a name for your project:
Project name
absolute-smiles-may-report|
Create project
Your URL will be: absolute-smiles-may-report.pages.dev
2
Upload your project assets:
📁
Drag in or click to upload a file or folder
Upload the whole folder containing index.html
⚠️
The project name is your URL. Whatever you type here becomes yourname.pages.dev. Use lowercase and hyphens only — no spaces, no capitals. Example: absolute-smiles-may-report
💡
You need to create the project first (step 1) before the upload zone (step 2) becomes active. Click "Create project" first, then drag your folder in.
Step 6
Publishing next month's report
Each month is a brand new Cloudflare project with its own URL. You never overwrite old reports — each one stays live permanently.
💡
One project per report. May's report is one project. June's report is a separate new project. This means old links never break and you only ever upload one file at a time.

So for the same client across multiple months, your projects look like this:

☁️ Cloudflare Projects
absolute-smiles-may-report → absolute-smiles-may-report.pages.dev
absolute-smiles-june-report → absolute-smiles-june-report.pages.dev
absolute-smiles-july-report → absolute-smiles-july-report.pages.dev
⚠️
Cloudflare free accounts have a limit of 100 projects. If you manage many clients, keep an eye on this. You can always create a second free account if needed.
Revisions
Need to update a published report?
Same process as Netlify — upload the revised file to the same project and it overwrites. The URL stays the same, the client sees the updated version straight away.
1
Fix the report in Claude and download the updated HTML file
Make sure all changes are correct before downloading

Once Claude has made the corrections, download the updated HTML file the same way as usual. Then rename it to index.html and put it inside a folder — same as the first time you published it.

⚠️
The file must still be named index.html and placed inside a folder before uploading. Even for revisions. Don't skip this.
2
Go to the existing project in Cloudflare and click "Create deployment"
Top right corner of the project page — not "Create application"

Go to Workers & Pages → click the existing project (e.g. absolute-smiles-may-report). You'll see the Deployments tab. Click Create deployment in the top right.

dash.cloudflare.com/pages/absolute-smiles-may-report
Workers & Pages / absolute-smiles-may-report
Deployments
Metrics
Custom domains
Settings
☁️ Create deployment
Production
Domains: absolute-smiles-may-report.pages.dev
Production ☁️ main 35 minutes ago
3
Drag in the folder and click "Save and deploy"
Make sure the folder contains index.html — you'll see it listed before deploying

Drag your folder into the upload zone. You'll see it confirm the folder name and index.html inside it. Once you see "All files were successfully uploaded", click Save and deploy.

dash.cloudflare.com/pages/absolute-smiles-may-report/deploy
Deploy a site by uploading your project
Name your project and upload your site's assets including HTML, CSS, and JS files that you would like to deploy.
Select your deployment environment
1/1 files uploaded
Remove all
All files were successfully uploaded.
📁 absolute-smiles-may-report
63 KB
📄 index.html
63 KB
Save and deploy
💡
Check that you can see the folder name and index.html inside it in the file list before clicking Save and deploy. If you only see the file without a folder, remove it and try again with the whole folder.

Revision flow at a glance:

Fix in Claude
Download
Rename to index.html
Put in folder
Open project → Create deployment
Drag folder in → Save and deploy
Done ✓
Notion Tracker
Log the link in the Notion tracker
Once the report is live, add it to the Strategies tracker in Notion so the whole team can find it easily without digging through Cloudflare.
💡
The tracker already has two fields built in — Strategy HTML File (to attach the file) and Strategy Link (to paste the live URL). You just need to fill them in after deploying.
1
Open the Strategies tracker in Notion
Find the row for the client and month you just published

Click the link below to open the tracker:

Find the row for the client and month you just deployed. If it does not exist yet, create a new entry.

2
Paste the live URL into the "Strategy Link" field
This is the Cloudflare link you just got after deploying

Open the row and find the Strategy Link field. Paste the full Cloudflare URL including https://.

Absolute Smiles — May 2026
Approved
Client
Absolute Smiles
Month Coverage
May 2026
Strategy Link ←
https://absolute-smiles-may-report.pages.dev|
Strategy HTML File
📄 may-2026-strategy.html
💡
Always include https:// at the start so Notion turns it into a clickable link.
3
Upload the HTML file to "Strategy HTML File"
Use the dated copy — not the index.html one

Click the Strategy HTML File field and upload the dated copy (e.g. may-2026-strategy.html). This is the archived version with the date in the name — not the index.html you uploaded to Cloudflare.

⚠️
Upload the dated file (e.g. may-2026-strategy.html) to Notion — not index.html. The index.html name will not tell you which month or client it belongs to.
Troubleshooting
Common issues and fixes
If something goes wrong, check here first.
!
404 error — page can't be found
Most common issue

Check these four things in order:

  • 1
    Is the file named exactly index.html? (not report.html, not Index.html)
  • 2
    Is index.html directly inside the folder, not in a subfolder?
  • 3
    Did you upload the folder, not just the file by itself?
  • 4
    Did you use Pages, not Workers? Check the URL — it should end in .pages.dev not .workers.dev
!
URL shows .workers.dev instead of .pages.dev
You ended up in Workers instead of Pages

This means the project was created as a Worker, not a Pages project. Delete it and start again — this time make sure to click the Pages tab or the "Get started" link before uploading anything.

To delete: Go to the project → Settings → scroll to the bottom → Delete.

!
SSL error — "can't provide a secure connection"
Usually means you typed the URL wrong

Don't type the URL manually. Always copy it directly from Cloudflare after deploying. If you're visiting from a link someone sent, ask them to resend it.

!
The URL has a random name like "billowing-base-69d2"
You forgot to change the project name before deploying

You can rename it after the fact. Go to the project → Settings → scroll to find the project name field → change it → save. The URL will update to reflect the new name.

Quick Reference
Summary and naming cheat sheet

Full workflow every time you publish a report:

Naming cheat sheet:

WhatFormatExample
File nameindex.htmlindex.html (always)
Folder name (report)client-month-reportabsolute-smiles-may-report
Folder name (strategy)client-month-strategyabsolute-smiles-may-strategy
Project name (report)client-month-reportabsolute-smiles-may-report
Project name (strategy)client-month-strategyabsolute-smiles-may-strategy
Live URL (report)project-name.pages.devabsolute-smiles-may-report.pages.dev
Live URL (strategy)project-name.pages.devabsolute-smiles-may-strategy.pages.dev
Notion file (report)mmm-yyyy-report.htmlmay-2026-report.html
Notion file (strategy)mmm-yyyy-strategy.htmlmay-2026-strategy.html

Good vs bad naming examples:

✅ Good❌ Bad
absolute-smiles-may-reportAbsolute Smiles May Report!!!
absolute-smiles-may-strategyAbsolute Smiles Strategy Final
chapman-road-april-reportChapman Road Report Final v2
chapman-road-april-strategychapman road april strat
aurora-smiles-june-reportaurora smiles june