Adding Content, Images, and Interactivity

A polished layout with placeholder text and stock imagery is still a demo. This lesson turns it into a real website by adding your actual content, replacing the images with ones that fit your brand, and wiring up the interactive pieces, forms, buttons, and links, that let visitors take action. Everything here is done through prompts and simple clicks, no code.

What You'll Learn

• How to swap placeholder text for your final content
• How to source and add images without a photographer (including AI-generated ones)
• How to add a working contact or signup form
• How to add buttons, links, and simple interactivity that drives your goal

Finish Your Content

By now most of your real copy is already in place from the build brief. This is the pass where you close the gaps and sharpen the words. Walk each page top to bottom and replace anything still generic.

• "Replace the placeholder text in the About section with this: {paste final copy}."
• "Update the three service cards with these exact titles, descriptions, and prices: {list them}."
• "Change the footer email to hello@myrealdomain.com and add my Instagram link."

Two content pieces that quietly build trust and are worth adding:

• An FAQ section. Ask your assistant: "Write five FAQs a {type of customer} would ask before buying, with short honest answers, using these facts: ..." FAQs handle objections and help your search ranking.
• A clear call to action, repeated. The one action from your plan (book, buy, subscribe) should appear in the hero, again mid-page, and once more near the footer. "Add a 'Book a meet-and-greet' button at the end of the Services section linking to the contact form."

One rule carries over from planning: never publish a fact you have not checked. If the AI reintroduces a statistic, a guarantee, or a claim like "award-winning," delete it unless it is true and you can back it up.

Add Real Images

Images make or break a site's credibility, and you have several no-cost ways to get good ones:

Practical tips:

• Real beats perfect. For a personal brand, a service business, or a portfolio, one authentic photo of you or your work outperforms a flawless stock image. People trust real.
• Sourcing free stock: sites like Unsplash and Pexels offer photos free to use, including commercially. Download, then upload into your builder. "Replace the hero background with this image I uploaded."
• Generating with AI: if you need a custom illustration or a hero concept that does not exist as a photo, an AI image tool can create it. Always inspect AI images closely for garbled text, extra fingers, or warped details before using them, and never use them to fake a real thing (a real testimonial photo, a real product you do not sell).
• Keep images light. Large images slow your site and hurt both experience and SEO. Most builders optimize automatically; if yours does not, resize before uploading.
• Add alt text. "Add descriptive alt text to every image." Alt text helps visually impaired visitors and search engines understand your images.

Add a Working Form

A form is how visitors actually reach you, and it is usually the single most important interactive element on a small site. AI builders make this genuinely easy.

Add a contact form to the Contact page with fields for name, email,
and message, plus a Submit button. When someone submits, show a
friendly confirmation message and send the submission to my email.

How the submission is delivered depends on your tool:

• Visual builders (Framer, Wix) have built-in form handling, submissions collect in a dashboard or forward to your email with a setting.
• Prompt-to-code builders (Lovable, Bolt) can wire the form to a backend. Lovable, for instance, can connect to a Supabase database to store submissions, or route them to an email or a tool like a Google Sheet. Ask the AI: "Store form submissions and also email them to me," and follow its setup steps.

Whatever you build, test it: submit the form yourself and confirm the message actually arrives. A form that silently fails is worse than no form, you will think it is working while leads vanish.

Add Buttons, Links, and Light Interactivity

Interactivity does not mean complexity. A few well-placed elements do most of the work:

• Buttons that go somewhere: "Make the hero button scroll down to the Contact form." "Link the 'Buy now' button to my Stripe payment link / my store URL."
• Navigation that works: confirm every menu link jumps to the right page or section, and add a "back to top" behavior on long pages.
• Simple motion, used sparingly: "Add a subtle fade-in as each section scrolls into view." A little motion feels modern; too much is distracting and can hurt performance.
• Social and contact links: wire up your email, phone (as a tap-to-call link on mobile), and any social profiles.

Resist adding features your goal does not need. A chatbot, a booking calendar, or a members area can come later, if the data says visitors want them. For launch, the winning formula is: clear content, credible images, a form that works, and buttons that drive your one goal.

A Pre-Launch Content Check

Before moving on, run this quick pass on every page:

When all four pass on all pages, your site is content-complete and ready to go live. In the next module you will connect a domain, choose hosting, and deploy it to the world.

Key Takeaways

• Replace every placeholder with final copy, and add an FAQ plus a repeated call to action.
• Get images from free stock, AI generation, or your own camera, but real photos win for anything customers judge you on.
• Always inspect AI images, add alt text, and keep files light.
• Add a contact form and test it end to end, a silently failing form loses leads.
• Wire buttons and links to drive your one goal, and resist features you do not yet need.