Course 05 · Lesson 8 of 13
Master Build Prompt: Build Complete Landing Page
You have your headline. You have your copy. You know your offer and your lead magnet.
Now you build the whole page in one prompt.
This is the most important prompt in this course. Copy it exactly, fill in your information, and send it. Claude will build your entire landing page from top to bottom.
What you need before sending
Your my-landing-page folder open in Claude Code. Your CLAUDE.md with design rules already inside the folder. Your headline from the previous lesson. Your copy elements including your problem statement, benefits, and CTA text from the lesson before that. Your lead magnet title and description from the lead magnets lesson.
The master build prompt
Copy this entire template. Fill in every section with your own information. Replace every line in square brackets.
Build me a complete, high-converting landing page. Follow all design rules in @CLAUDE.md.
WHAT THIS PAGE IS FOR:
[One sentence: who visits this page and what they are looking for]
[One sentence: what the page offers them and what action I want them to take]
THE ONE RULE:
This is a landing page not a website. There is ONE goal, ONE offer, ONE call to action.
No navigation links that take people off the page.
Navigation: my name or logo on the left only. One CTA button on the right.
Every section drives toward: [YOUR ONE CTA TEXT] MY CONTENT: Headline: [YOUR HEADLINE]
Subheadline: [YOUR SUBHEADLINE — one sentence expanding the headline]
Problem section:
- Heading: [E.G. "Does This Sound Familiar?"]
- Body: [2 to 3 sentences describing the specific frustration your visitor feels.
- Write in their language. Make them feel understood.]
Solution section:
Heading: [E.G. "There Is a Better Way" or "Introducing [YOUR OFFER NAME]"]
Body: [2 to 3 sentences introducing your offer as the solution. What is it? What does it do?]
Benefits — what they get:
- [BENEFIT 1 — specific outcome, not a feature]
- [BENEFIT 2]
- [BENEFIT 3]
- [BENEFIT 4]
- [BENEFIT 5 — optional]
Lead magnet or offer:
Name: [YOUR LEAD MAGNET TITLE]
Description: [ONE SENTENCE about what it is and what they get]
What it includes: [LIST 2 TO 3 THINGS INSIDE IT]
Social proof (use what you have — skip sections you do not have):
Testimonial 1: "[QUOTE]" from [NAME, brief description] Testimonial 2: "[QUOTE]" from [NAME, brief description]
If you have no testimonials yet: skip this section entirely and do not fabricate any
FAQ:
Write 4 questions and answers based on common objections someone might have about [YOUR OFFER].
Questions should address: cost, time required, who it is for, and what happens after signup.
My contact and brand:
Name or brand: [YOUR NAME OR BRAND] Email: [YOUR EMAIL]
SECTION ORDER — BUILD IN EXACTLY THIS ORDER:
- MINIMAL NAVIGATION
Logo or name text on the left with no link attached
CTA button on the right: "[YOUR CTA BUTTON TEXT]"
Button links to the lead capture form below via #lead-capture
No other navigation elements of any kind
- HERO SECTION
Full viewport height
Centered content
Headline: [HEADLINE] Subheadline: [SUBHEADLINE] Primary CTA button: "[CTA TEXT]" linking to #lead-capture
Optional trust line below button: "[E.G. Free. No credit card. No spam.]"
- PROBLEM SECTION
Section heading: [YOUR PROBLEM HEADING] Body paragraph: [YOUR PROBLEM COPY]
No CTA here — just resonance and understanding
- SOLUTION SECTION
Section heading: [YOUR SOLUTION HEADING] Body paragraph: [YOUR SOLUTION COPY]
- BENEFITS SECTION
Section heading: "What You Will Get" or [YOUR HEADING]
Layout: clean list or 2-column grid
Each benefit clearly stated with a short supporting line
[YOUR BENEFITS LIST]
- SOCIAL PROOF — skip entirely if you have no testimonials or stats
Section heading: "What Others Are Saying" or [YOUR HEADING] [YOUR TESTIMONIALS OR STATS]
- LEAD CAPTURE SECTION with id="lead-capture"
Section heading: [ACTION-FOCUSED HEADING such as "Get Your Free [MAGNET NAME] Now"] Subtext: [ONE PERSUASION SENTENCE]
Form with:
- Name field with placeholder: "Your first name"
- Email field with placeholder: "Your email address"
- Submit button: "[CTA BUTTON TEXT]"
- Trust line below button: "No spam. Unsubscribe any time."
Form attributes: method="POST" data-netlify="true" name="landing-page-leads"
Hidden field: input type hidden name="form-name" value="landing-page-leads"
- FAQ SECTION
Section heading: "Common Questions"
4 questions with clear honest answers generated based on my offer
- FINAL CTA SECTION
Short heading: [ONE FINAL COMPELLING LINE]
1 to 2 sentence summary of what they get
CTA button: "[CTA BUTTON TEXT]" linking to #lead-capture
- FOOTER — minimal
Copyright 2026 [YOUR NAME OR BRAND] Privacy Policy link and [YOUR EMAIL] DESIGN:
Follow all rules in @CLAUDE.md
Colors: Background [HEX], Text [HEX], Accent [HEX] Heading font: [FONT] from Google Fonts Body font: [FONT] from Google Fonts
Maximum content width: 760px — landing pages are narrower than websites for focused reading
Section padding: 120px top and bottom on desktop, 70px on mobile
TECHNICAL:
- Files: index.html and style.css only
- All CSS in style.css with zero inline styles
- Google Fonts loaded via link tag in the head
- Mobile responsive at 375px minimum
- Smooth scroll: html { scroll-behavior: smooth; }
- Netlify form must have: data-netlify="true" name="landing-page-leads" method="POST"
SELF-REVIEW BEFORE REPORTING COMPLETE:
- Only one CTA action used throughout the entire page
- No navigation links that take people off the page
- Hero makes the offer clear before the user scrolls
- Lead capture form has correct Netlify attributes
- Page looks clean on mobile
- No purple or blue gradients or vibe-coded patterns
After sending: what to expect
Claude will build the full page and create index.html and style.css. This takes 5 to 10 minutes. When it finishes, open index.html in your browser.
Look at four things: does the hero make you want to scroll down, does the problem section make you feel understood, is the form visible and clearly positioned, and does the whole page push toward one action consistently.
You will refine in the next lesson and set up the form connection in the lesson after that.
Fixing common first-build issues
If the hero does not communicate the offer clearly enough before scrolling:
- The hero section does not make the offer clear enough before the user scrolls.
- Rewrite it so that the headline, subheadline, and CTA button together communicate
- the complete offer without anything else being needed. A visitor should know
- exactly what they are getting within 3 seconds of landing on the page.
If the navigation has distracting links:
- The navigation has links that take visitors off the page. Remove all of them.
- Navigation should only have my brand name on the left with no link attached, and
- one CTA button on the right linking to #lead-capture. Nothing else at all.
If the lead capture form section is not prominent enough:
- The lead capture form section is not visually prominent enough. Make it the visual
- centrepiece of the page. Larger heading, more padding, the form itself more
- visible and inviting. The submit button should be the largest most visible
- button on the entire page.
Your action right now
Fill in the master prompt above with your real content and send it.
Once Claude finishes building, open the file in your browser. The form is built but not yet connected to collect submissions. That is the next lesson.
Do it with other builders
Post your homework. Get unstuck.
Every course ends with homework. Post yours in Claude Codex Mastery, the community this course comes from, and get feedback from Yar and 400+ people building the same way.
Join the community · $29/mo