Skip to main content

Claude/ChatGPT Prompt to Build a Full SEO-Ready Marketing Site in Nuxt 3

Nuxt 3 marketing site with @nuxt/content and @nuxt/image: sitemap, OG meta, structured data, dark mode, and optimised responsive images.

Fill in the placeholders

Edit the values, then copy your finished prompt.

Your Prompt
prompt.txt
You are a senior Nuxt engineer. Build an SEO-ready marketing site and return working code, not pseudocode — pages should render and pass a Lighthouse SEO check.

Context:
- Brand: Acme Analytics
- Pages: home, features, pricing, blog, about, contact
- Content source: local markdown in content/
- Primary keyword theme: team analytics dashboard

Deliverables:
1. Project structure using @nuxt/content for markdown pages and @nuxt/image for optimised assets.
2. The home, features, pricing, blog, about, contact routes, with content authored via local markdown in content/.
3. Per-page SEO: title/description, canonical, and Open Graph + Twitter meta driven by useSeoMeta.
4. Structured data (Organization + WebSite/Article JSON-LD) and an auto-generated sitemap + robots.
5. Responsive images with width/format variants and lazy loading, plus a dark-mode toggle that persists.
6. A keyword-aware content outline for the home and one inner page around team analytics dashboard.

Output: the file tree, nuxt.config, one content page, and the SEO/meta composable.

What this prompt does

This prompt asks the model to act as a senior Nuxt engineer and build an SEO-ready marketing site that renders and passes a Lighthouse SEO check, returning working code rather than pseudocode. You set the [brand], the [pages], the [content_source], and the primary [keyword_theme], and it returns a project structure with @nuxt/content and @nuxt/image, the routes, per-page SEO meta, structured data, a sitemap and robots, responsive images, a dark-mode toggle, and a keyword-aware outline.

The structure works because the gap between a pretty site and one that ranks is all the unglamorous SEO plumbing. By driving per-page title/description, canonical, and Open Graph + Twitter meta through useSeoMeta, adding Organization and WebSite/Article JSON-LD, and auto-generating a sitemap, the prompt makes that plumbing concrete. [pages] defines the routes, [content_source] defines authoring, and [keyword_theme] shapes the content outline. Pairing @nuxt/content with @nuxt/image means writers work in markdown while images are emitted in optimised variants, so the site stays fast without a custom build pipeline.

When to use it

  • You're building a marketing site or landing pages that actually need to rank.
  • You want @nuxt/content for markdown pages and @nuxt/image for optimised assets.
  • You need per-page SEO meta, canonical tags, and Open Graph driven by useSeoMeta.
  • You want structured data plus an auto-generated sitemap and robots.
  • You need responsive images with width/format variants and lazy loading.
  • You want a keyword-aware content outline around a target theme.
  • You want a persistent dark-mode toggle without wiring it from scratch.

Example output

Expect the file tree, the nuxt.config, one content page, and the SEO/meta composable. Around those, the build covers the [pages] routes authored via [content_source], per-page SEO meta through useSeoMeta, Organization and WebSite/Article JSON-LD, an auto-generated sitemap and robots, responsive images with format variants and lazy loading, a persistent dark-mode toggle, and a keyword-aware outline for the home and one inner page around [keyword_theme]. Together these give you a deployable starting point that already has the meta, structured data, and image handling a Lighthouse SEO check looks for.

Pro tips

  • Validate your structured data before launch — one malformed JSON-LD block and the rich result silently never shows.
  • Define [pages] to match your real site map (e.g. home, features, pricing, blog) so routes and the sitemap are complete.
  • Set [content_source] to how you'll actually author (e.g. local markdown in content/) so the @nuxt/content setup fits your workflow.
  • Make [keyword_theme] specific; a vague theme produces a generic outline that won't target real search intent.
  • Use [brand] consistently so the Organization JSON-LD and meta titles reflect the real product name.
  • Check the responsive images actually emit width/format variants, since image weight is a common Lighthouse drag.

Frequently Asked Questions

Will the site actually pass an SEO audit?
The prompt explicitly requires pages that render and pass a Lighthouse SEO check, including meta, canonical tags, JSON-LD, and a real sitemap. Validate the structured data before launch, since a malformed block can stop a rich result from ever showing.
How is page content authored?
Through whatever you set in `[content_source]`, such as local markdown in content/, using @nuxt/content. The `[pages]` routes are then authored against that source, so writers work in markdown rather than editing components.
Does it include structured data?
Yes. It generates Organization plus WebSite or Article JSON-LD, alongside per-page Open Graph and Twitter meta driven by useSeoMeta. Validating the JSON-LD is recommended because one malformed block silently breaks the rich result.
Can I target a specific keyword theme?
Yes. Set `[keyword_theme]` and the prompt produces a keyword-aware content outline for the home page and one inner page. A specific theme yields an outline aimed at real search intent rather than generic copy.
Engr Mejba Ahmed

Need this built for real?

Engr Mejba Ahmed

AI Developer · Software Engineer

I'm Mejba — I design and ship production AI systems, automations, and full-stack apps. If you want this turned into a working solution for your team, let's talk.

More in Vue.js & Angular Prompts

Engr Mejba Ahmed

Engr Mejba Ahmed

AI assistant · trained on my work

👋

Hey there!

Quick Actions

WhatsApp Direct line to me

Chat on WhatsApp

+880 1723 741224 · Replies within the hour on working days

Popular Questions

Engr Mejba Ahmed is connected
Engr Mejba Ahmed is typing...
Engr Mejba Ahmed avatar

✉ Want me to follow up? Drop your email

Engr Mejba Ahmed avatar

📞 Connect Directly

Choose how you'd like to reach me

WhatsApp

+880 1723 741224

Email

mejba.13@gmail.com

✓ Details sent! I'll get back to you shortly.

Powered by OpenAI

335+

Blog Posts

25

AI Courses

63

Projects

Services & Expertise

Pricing & Process

Learning & Resources

Connect & Support