How to build a client website with Claude (and connect it to GoHighLevel)

1Pick how you'll use Claude

There are two easy routes:

• Claude chat (claude.ai): ask for a website and Claude builds it as an artifact that opens next to the chat, so you can preview it and keep editing. Artifacts are available on the Free plan; on Free you can copy or download new artifacts but not share them by link.
• Claude Code: works directly with files on your computer, which is handy for multi-page sites and repeat edits. Claude Code is included with paid plans (Pro and up), not Free.

For a one-page client site, chat is enough. Plans and features change, so check Claude's pricing page for what's current.

2Collect the client's info first

Claude writes better pages when you give it real material. Gather: business name, city and service area, main services, phone/email, brand colors (hex codes), logo file, 2-3 real reviews (with permission), and the one action you want visitors to take (call, quote form, or booking).

3Paste the starter prompt

Replace the {curly} parts and paste this into a new chat:

Build a one-page website for a local {business type} called {business name} in {city}.
Goal: get visitors to request a quote or book a call.
Sections: hero with headline + one call-to-action button, services (3-6 cards), why choose us,
reviews (use clearly marked placeholder text), service area, FAQ, contact section, footer.
Rules:
- One self-contained index.html file: all CSS in a <style> tag, no external frameworks, no build step.
- Mobile-first, fast, accessible (real headings, alt text, good color contrast).
- Brand colors: {primary hex} and {secondary hex}. Font: system font stack.
- In the contact section, leave an empty <div id="ghl-form"></div> where I will paste a form embed code.
- Add a <title> and meta description written for "{main service} in {city}".
Don't invent facts like licenses, awards, prices or review quotes: put [PLACEHOLDER] where I need to fill something in.

Asking for one self-contained file keeps hosting simple, and the empty ghl-form div gives you a clean spot for the GoHighLevel form later.

4Iterate in small, specific rounds

Look at the preview, then ask for 2-4 concrete changes at a time. Vague asks ("make it pop") get random results; specific ones get what you want:

Make these changes to the site and give me the full updated index.html:
1. The hero headline is too generic. Write 3 options focused on {main benefit} and use the best one.
2. Make the call-to-action buttons scroll to #contact.
3. On mobile, stack the service cards in one column and make the buttons full width.
4. Keep everything else the same.

Tip: check the preview at phone width too. Most local-service traffic is mobile.

5Export the HTML

When you're happy, download or copy the code from the artifact and save it as index.html in a new folder on your computer (add any images, like the logo, to the same folder). Double-click the file to open it in your browser and make sure it looks right outside Claude.

6Host it free on Cloudflare Pages

Cloudflare Pages hosts static sites for free with a *.pages.dev address. Per Cloudflare's docs, the drag-and-drop route is:

1. In the Cloudflare dashboard, go to Workers & Pages.
2. Choose Create application, then the drag-and-drop / direct upload option for Pages.
3. Name the project and drop in your folder (or a ZIP of it), then deploy.

The site goes live at your-project.pages.dev. To update it, create a new deployment and upload the folder again. Free-plan drag and drop handles up to 1,000 files, which is plenty for a landing page. You can then add the client's own domain under the project's Custom domains. Cloudflare's menus change from time to time; their Direct Upload docs have the current steps. Netlify and GitHub Pages also work.

7Embed a GoHighLevel form

In the client's sub-account, go to Sites > Forms, open (or create) the form, click Integrate at the top right, choose a layout (Inline is best for a contact section), and click Copy Embed Code. Then let Claude place it:

Here is the embed code from GoHighLevel for my form:
{paste embed code}
Put it inside <div id="ghl-form"> in the contact section without changing the code itself.
Style the wrapper (padding, max width, rounded corners) to match the site. Then give me the full index.html.

Two things worth knowing from HighLevel's docs: the embedded form renders in HighLevel's own frame, so you style the wrapper, not the fields (style fields in the form builder). And if you change layout or trigger settings later, regenerate the code and replace it.

8Add a booking calendar or chat widget (optional)

• Calendar: go to Calendars > Calendar Settings, click the three dots next to the calendar, choose Share, open the Embed Code tab and copy it. Paste it into a "Book a call" section the same way you did the form.
• Chat widget: set it up under Sites > Chat Widget, copy its code, and paste it just before the closing </body> tag so it shows on every page.

Redeploy to Cloudflare after each change.

9Send every lead into a pipeline

This is what turns a pretty page into a lead machine. In HighLevel:

1. Go to Automation > Workflows and create a workflow from scratch.
2. Add the trigger Form Submitted and filter it to the form you embedded.
3. Add the action Create/Update Opportunity, pick the pipeline and a stage like "New Lead", and set a value if you know it.
4. Add follow-up: an instant SMS or email to the lead, and an internal notification to the client.
5. Publish the workflow.

Using a booking calendar? Add a second trigger, Customer Booked Appointment, that moves them to a "Call booked" stage.

10Test the whole flow, then launch

Submit the live form yourself with obviously fake details. Confirm the contact appears in HighLevel, the opportunity lands in the right stage, and the follow-up messages fire. Then run a last check with Claude:

Review this index.html like a picky web developer before I launch it for a client.
Check: broken links, missing alt text, placeholder text I forgot, color contrast, mobile layout,
title/meta description, and anything that would look unprofessional. List the issues, then give me the fixed file.

Finally, swap every [PLACEHOLDER], connect the client's domain, and you're live.

11Next: reuse the whole build

Built a setup you'll use again? Turn it into a template for the next client: how to turn a client build into a reusable GoHighLevel snapshot. And see what ready-made snapshots cost before you build from scratch.