Built on WIX Headless

Blog / how-to

Wix Harmony Tutorial: Build and Publish Your First Website

· Wix Harmony tutorial

Wix Harmony Tutorial: Build and Publish Your First Website

This walkthrough takes you from a blank Wix Harmony site to something you can publish: a simple brochure homepage (and maybe one extra page) that you prompted with Aria, edited yourself, checked on mobile, and put live.

You do not need a CMS for this tutorial. When you’re ready for directories or searchable lists, use the Wix CMS Guide.

What you’ll have at the end

A small business-style site with:

Step 0 — Create the site

Option A — Free starter from us

  1. Open the free starter site flow.
  2. Enter the email address on your Wix account.
  3. Create the site, then accept the co-owner invite from your email.
  4. Open the site in Harmony.

Option B — Create it in Wix

From your Wix account, create a new site and choose Harmony when prompted.

Reminder: a Harmony site stays on Harmony. You can’t convert it later to the classic Editor or Studio.

Step 1 — Ask Aria for a first homepage (not the whole business)

Open Ask Aria and describe one page, not twelve. Include:

Example:

Build a calm homepage for a residential plumber in Austin. Homeowners who need fast repairs. Sections: hero with a clear “call now” button, three services (drain cleaning, water heaters, leak repair), three short trust points, and a simple contact strip with phone. Minimal layout, no fake customer photos.

Generate, then wait for the canvas to settle. Treat the result as a draft.

More prompt patterns: Better Harmony prompts.

Step 2 — Edit like you mean it

This is the step that turns an AI draft into a real site.

  1. Replace every placeholder phone number, city, and claim with facts you can stand behind.
  2. Swap stock images for your own work photos or brand imagery.
  3. Delete sections you won’t maintain. A shorter honest page beats a long generic one.
  4. Check navigation labels match the pages you actually keep.
  5. If Aria invents testimonials, licenses, or awards you don’t have, remove them.

Step 3 — Add a second page (optional but useful)

Most brochure sites need at least Home + About or Services.

  1. Create or duplicate a page.
  2. Keep the header and spacing rhythm consistent with Home.
  3. Link both pages in the site menu.
  4. You can prompt Aria again for the new page, or build it manually—whichever is faster for you.

Step 4 — Check mobile before you celebrate

Harmony layouts adapt automatically, but mobile still needs a human eye.

  1. Switch to mobile view.
  2. Fix oversized headings, cramped buttons, and large empty gaps.
  3. Hide elements that only make sense on desktop if they’re getting in the way.
  4. Tap through the menu once as if you were a visitor on a phone.

Step 5 — Fill in the basics Google cares about

Before publish:

  1. Set a unique page title and meta description for Home.
  2. Keep one clear H1 that matches the page topic.
  3. Add alt text on the main images.

Fuller checklist: Harmony SEO checklist.

Step 6 — Publish and smoke-test

  1. Preview on desktop and mobile.
  2. Publish.
  3. Open the live URL in a private window and click every menu item once.

What’s next

GoalGuide
Compare editors before a bigger rebuildHarmony vs Editor vs Studio
Check capability limitsHarmony limitations
Add searchable lists or directoriesWix CMS Guide
Learn Harmony’s built-in CMS + app widgetsCan you use a CMS in Wix Harmony?

Updated:

Ready to try it on Harmony? Get a free starter site CMS for Harmony