Website & App Building · Marketing & Advertising

Build a fast custom WordPress block theme

A detailed prompt to build a lightweight WordPress block theme with theme.json, patterns, templates and full site editing, scoring 90+ on PageSpeed.

Your prompt is ready 5 brackets to fill
You are a senior WordPress theme developer. Build a fast, accessible custom block theme with me, phase by phase, so the owner can edit everything in the Site Editor without code.

## The theme
- Website and business: [BUSINESS AND WHAT THE SITE IS FOR]
- Pages needed: [e.g. home, services, about, blog, contact]
- Brand colours, fonts and logo: [DETAILS]
- Design reference sites I like: [URLS]
- Plugins it must support: [e.g. WooCommerce, Contact Form 7, Yoast or Rank Math]

## Features
1. theme.json with the full design system: colour palette, gradients, font families (self-hosted), fluid type sizes, spacing scale, layout widths, block styles.
2. Templates: index, home, front page, single, page, archive, search, 404, and WooCommerce templates if needed; template parts for header, footer and sidebar.
3. Header with logo, menu, mobile menu, call-to-action button and optional sticky behaviour; footer with columns, social links and legal links.
4. Block patterns: hero, features grid, services, testimonials, pricing table, FAQ, call to action, team, logos, contact section, blog grid; registered in a pattern category.
5. Custom block styles and variations (buttons, cards, headings).
6. Blog: post cards, reading time, author box, related posts, table of contents style.
7. Dark mode style variation and one alternative colour variation.
8. Editor styles that match the front end exactly.

## Theme rules
- No page builder and no jQuery on the front end; load only the CSS each block needs.
- PageSpeed 90+ on mobile, CLS under 0.1, images with width and height, fonts preloaded.
- WCAG 2.2 AA: skip link, focus styles, landmark regions, contrast.
- Pass Theme Check and follow the WordPress.org theme review requirements.

## Quality rules (apply to every phase)
- Security: prepared statements or an ORM for every query, output escaping, CSRF tokens on every form, passwords hashed with bcrypt or Argon2, rate-limited login, role checks on the server for every admin route, file uploads checked by type and size and stored outside the web root or with random names, secrets only in an .env file.
- Validation: validate every input on the server (and also in the browser for speed). Show clear error messages next to the field that is wrong, and keep what the user already typed.
- Performance: pagination on every list, database indexes on every column used for search, filter or join, lazy-loaded and resized images (WebP), caching for pages that rarely change, no N+1 queries.
- Responsive and accessible: mobile first, works from 360px to wide desktop, proper labels on every form field, keyboard navigation, visible focus, colour contrast of at least 4.5:1, alt text on images.
- SEO: clean URLs, a unique title and meta description per page, canonical tags, Open Graph tags, schema.org JSON-LD where it applies, an XML sitemap and robots.txt.
- Code: small functions with clear names, one responsibility per file, comments only where the reason is not obvious, consistent formatting, no dead code.
- Errors: friendly error pages (404, 500), server errors written to a log, never shown to visitors.
- Deliver with: a README (install steps, .env example, how to create the first admin), database migrations and seed data with realistic sample content, and a deployment checklist.

## How to work with me
Do not write code yet. First reply with:
1. A short summary of what you understood, and anything in the brief that is unclear or contradictory (ask me, do not guess).
2. The final tech stack, with a one-line reason for each choice.
3. The folder and file structure.
4. The full database schema: every table, column, type, index and relation.
5. Every page or screen, and every API endpoint (method, path, who can call it, what it returns).
6. The build plan as numbered phases, each one small enough to finish and test on its own.

Wait for me to reply "go". Then build one phase at a time:
- For every file, give the full path and the complete code. Never write "...", "rest of the code stays the same" or TODO.
- After each phase, tell me how to run it, what to click to test it, and what is still missing. Then wait for me to reply "next".
- If you change a file you already gave me, give the whole updated file again.
Open in ChatGPT Claude Perplexity

How to use this prompt

  1. Copy the prompt. Press Copy prompt and the full text goes to your clipboard.
  2. Fill the brackets. Use the form above, or replace [BUSINESS AND WHAT THE SITE IS FOR], [e.g. home, services, about, blog, contact], [DETAILS], [URLS], [e.g. WooCommerce, Contact Form 7, Yoast or Rank Math] with your own details.
  3. Paste and send. Paste it into ChatGPT, Claude, Gemini and DeepSeek and send. Ask follow-up questions to refine the answer.

Why this prompt works

The “Build a fast custom WordPress block theme” prompt describes the whole app before any code is written: 8 features, starting with theme.json with the full design system; templates; and header with logo, menu, mobile menu, call-to-action button and optional sticky behaviour. It then has the assistant build it in 9 stages, so you can test each part before the next one starts. Quality rules apply to every stage, so the result is code you can run rather than a sketch.

How to get the best answer

  1. Fill every bracket with real detail: [BUSINESS AND WHAT THE SITE IS FOR], [e.g. home, services, about, blog, contact], [DETAILS] and the rest should hold real names, numbers and dates, not placeholders.
  2. Paste real material: where the prompt asks for notes, data or text, paste the actual content rather than a summary.
  3. Refine in the same chat: ask "make it shorter", "turn it into a table" or "add more detail on step 2".
  4. Check the result: test what it builds or writes before you rely on it.

FAQ

Frequently asked questions

Which AI assistant works best with the “Build a fast custom WordPress block theme” prompt?

The “Build a fast custom WordPress block theme” prompt works in any chat assistant and suits ChatGPT, Claude, Gemini and DeepSeek best. Paste it in, send it, and ask follow-up questions in the same chat to refine the answer.

What do I fill in before sending the “Build a fast custom WordPress block theme” prompt?

Replace the 5 highlighted brackets – [BUSINESS AND WHAT THE SITE IS FOR], [e.g. home, services, about, blog, contact], [DETAILS], [URLS], [e.g. WooCommerce, Contact Form 7, Yoast or Rank Math] – with your own details. The more specific you are, the better the answer.

Who is the “Build a fast custom WordPress block theme” prompt for?

Anyone who wants a complete, working result from an AI assistant. Replace the brackets with your own project details.

Is the “Build a fast custom WordPress block theme” prompt free to use?

Yes. First AI Prompt prompts are free to copy and use in personal and business work, with no sign-up, no account and no daily limit.

Can I trust the answer the “Build a fast custom WordPress block theme” prompt gives?

Treat it as a strong first draft: the prompt tells the assistant not to invent facts and to mark its assumptions, but check figures yourself, especially anything with legal, financial or safety consequences.

Keep exploring

Browse more Marketing & Advertising prompts