Free tool

Roofers Website Prompt Builder

Pick a roofing brand's design language, add your company's facts, choose your optimizations. Copy the finished prompt into ChatGPT or Claude and build a website that books inspections.

Already built it? Publish it free on Cloudflare →
Claude Code Masterclass

This tool writes the prompt for you. The masterclass teaches you to build tools like it yourself. Rolling enrollment: the full six-hour replay, a live onboarding session, and a prep clinic.

Apply at evyus.com/claude →

Stuck? Bring it to office hours, weekdays at 12pm and 7pm ET, free.

1

Design languageWhich roofing or home improvement brand's visual system should the site borrow?

2

Who the site is forPaste your Google Business Profile and let AI fill the form, or type the facts yourself.

0 / 30,000
Works with a Google Business Profile, a Yelp page, your old website, a brochure, or an AI research report. Whatever you paste also rides along inside the prompt as source material.
From your Google Business Profile optional, autofill targets these too
3

OptimizationsEach one adds a hard requirements block to the prompt.

0 selected
4

Page sectionsUntick anything you have no real content for.

5

DeliveryHow ChatGPT or Claude should hand the work back.

Publish it: Cloudflare Pages, free hosting, in about 10 minutes

Once ChatGPT or Claude hands you the site, you still need somewhere to put it. Cloudflare Pages hosts static sites free, with no bandwidth cap and no credit card. This is the whole path, from the file on your desktop to your own domain.

Part one: get the files ready

1Create the website

Use the prompt above in ChatGPT or Claude and ask for a static HTML website. When the site is finished, ask for it as a folder:

Create a downloadable website folder with the homepage named index.html. Put all images, CSS, and supporting pages inside the same folder structure so it can be uploaded directly to Cloudflare Pages.

The homepage must be named exactly index.html. Cloudflare looks for that filename and nothing else.

2Download and unzip it

Download the ZIP that the AI creates. On a Mac: open Downloads, double-click the ZIP, and it expands into a normal folder. Open that folder and confirm index.html sits at the top level, not buried one folder deeper.

MyWebsite
├── index.html
├── assets
├── about
├── services
└── insights
Common mistakeDo not upload only index.html when the site includes images, CSS or other pages. Upload the entire folder.

Part two: put it online

3Create a free Cloudflare account

Go to Cloudflare and create a free account. Once you are logged in, look in the left-hand navigation for Workers & Pages. It may sit under a Compute heading.

4Create a Pages project

Inside Workers & Pages, click Create, find the Pages option, choose the static site path, then choose Drag and Drop. If Cloudflare asks something like "Looking to deploy Pages?", choose Get Started.

Watch outDo not create a Worker. Workers run code. You want Pages, which serves files.
5Name the project

Give it a simple lowercase name with no spaces, for example mywebsite. Cloudflare turns that into a free temporary address like mywebsite.pages.dev so you can preview the site before pointing a real domain at it.

6Upload the folder

When Cloudflare asks for the project assets, upload the entire website folder. On a Mac you can drag the folder straight into the upload area, or click the folder upload option and pick it in Finder.

Cloudflare lists what it found. Confirm you can see index.html plus any folders holding images, CSS and other pages.

7Deploy

When Cloudflare confirms every file uploaded, click Deploy Site. Wait for it to finish, then click Continue to Project.

8Preview before you commit

Open the temporary .pages.dev address and check it properly: homepage, images, navigation, buttons, about page, service pages, external links, and the mobile view. Do not connect your real domain until the preview looks right.

9Make changes later

Cloudflare hosts your files. It is not a visual editor. To update the site: edit the files outside Cloudflare, build the updated folder, return to the Pages project, create a new deployment, upload the folder, and deploy again. The newest deployment becomes the live version, and older ones stay available to roll back to.

Part three: your own domain

10Buy a domain through Cloudflare

Cloudflare Registrar sells domains at wholesale cost with no markup and no first-year discount that jumps at renewal. WHOIS privacy is included free. Buying the domain in the same account you are hosting in removes every DNS step from the next section.

  1. In the Cloudflare dashboard, open Domain Registration, then Register Domains.
  2. Search for the domain you want and check the price, which is what Cloudflare pays the registry.
  3. Add it to the cart, enter your contact and payment details, and complete the purchase.
  4. The domain appears in your account within a minute or two, already using Cloudflare DNS.
If you already own the domain elsewhereYou have two choices. Transfer it in, which needs an unlock and an auth code from your current registrar and takes about five days. Or leave it where it is and just change its nameservers to the two Cloudflare gives you. Both work. Transferring is tidier long term.
11Connect the domain to your site
  1. Open your Cloudflare Pages project.
  2. Choose Custom Domains.
  3. Click Set Up a Custom Domain.
  4. Enter the domain you own and follow the prompts.

If the domain was bought through Cloudflare, this takes one click and Cloudflare writes the DNS record for you. If the domain lives elsewhere, Cloudflare shows you the exact record to add at your registrar.

Add both the bare domain and the www version, then set one to redirect to the other so you are not running two addresses. HTTPS is issued automatically and free, usually within a few minutes.

12Finish the SEO setup

Once the real domain is live, three things are worth ten minutes:

  • Update the canonical link tag and the Open Graph og:url in your HTML to the real domain, then redeploy. They will still point at the placeholder domain otherwise.
  • Upload the robots.txt, sitemap.xml and llms.txt files into the top level of your folder alongside index.html.
  • Add the site to Google Search Console and Bing Webmaster Tools, then submit the sitemap.

Part four: make it a working roofer site

13Wire the inspection form and emergency line

Connect the inspection form to your email (Cloudflare Pages Functions, Formspree, or your CRM's embed form from JobNimbus, AccuLynx, Roofr or Leap), make sure the emergency button dials a phone that is actually answered, and test both from your own phone.

Why it mattersIn roofing, the first company to call back gets the job. A form that lands in a mailbox nobody checks is worse than no form.
14Connect Google Business Profile and certification badges

Add your live site URL to your Google Business Profile, link your Google, Facebook and BBB reviews from the footer, and make sure your manufacturer certification profile (GAF, Owens Corning, CertainTeed) links back to this site. Those profile pages send homeowners who are already shopping for a certified installer.

When this method stops being the right one

Drag and drop works well for landing pages, personal sites, and simple business sites that rarely change. It gets tedious if you publish articles or newsletters regularly, because every edit means rebuilding and re-uploading the whole folder. At that point move to GitHub plus a content editor connected to Cloudflare, which lets you publish a new article without touching the folder again.