Documentation

Getting Started

Install NoLeemits AI Design, set your site up so the AI has something to work from, and build your first page — with or without an AI connected.

Requirements

  • WordPress 6.4 or newer (tested to 7.0)
  • PHP 8.0 or newer
  • Any theme, including block themes
  • An AI assistant that speaks MCP — optional, only needed for the AI design part

Install

  1. Plugins → Add New → Upload Plugin, choose the zip, install and activate.
  2. The plugin adds a Design Pages menu.
  3. Enter your licence key on the screen that opens after activation.

Your first page, without any AI

You do not need an AI account to use the editor.

  1. Design Pages → Add New.
  2. Add a section. Pick Content Mode if you want the friendly labelled form, or Advanced Mode to write template_html, scoped_css and section_js directly.
  3. Save, then Preview. Previews render in a sandboxed iframe, so they match the real front end.
  4. Publish.

To show a draft to someone who has no WordPress login, ask a connected assistant for a preview link (get_preview_url). The link works for 24 hours without a login, so you can send it to a client or open it on your phone.

Your first page, with AI

  1. Open Design Pages → Settings → MCP Config. Sign in from the browser (nothing to copy), or generate an API token. Team members who aren't administrators get their own copy under Design Pages → MCP Connection, showing only their own connections.
  2. Connect your client. See MCP Setup.
  3. Ask for what you want: "Design a homepage for a dental practice: hero, services, team, testimonials, contact." The AI reads your design tokens and style guide first, then writes the sections straight into your database.
  4. Open the page in Content Mode and refine the words yourself. That part costs nothing.

Set the site up properly first

Ten minutes here saves the AI from guessing, and makes everything it builds consistent:

  • Design Pages → Design Tokens: your colours, fonts, spacing and corner radius. Every page reads these.
  • Design Pages → Business Info: phone, email, address, social links. Referenced anywhere as {{business:phone}} and friends, and used for LocalBusiness JSON-LD.
  • Design Pages → Global Sections: your header and footer, defined once, injected on every page.

The Settings screens

Design Pages → Settings has ten tabs, in this order:

Tab What it controls
MCP Config Connecting an AI assistant: browser sign-in or API token, setup steps for seven clients, every live connection and its access level
Integrations Optional tool sets (Advanced Custom Fields, Gravity Forms, JetFormBuilder, Contact Form 7, Rank Math, Yoast SEO, WPCode), one switch each, and whether each is actually live
Builders Other NoLeemits page builders on the site, which tool names overlap, and pages marked by both
General Site-wide defaults, including Global Header & Footer on pages your theme or another builder renders
Post Types Which post types can be Design Pages, and the default render mode for each
Templates Template assignments for posts, archives, search, 404 and the homepage
Access Which user roles may create and edit Design Pages
Revisions How many versions to keep, and for how long
Caching Render cache behaviour
Advanced White label, agency attribution, and everything else

Where things live

  • Design Pages: your pages
  • Design Pages → Design Systems: ready-made sites and section layouts to import
  • Design Pages → Section Library: reusable sections
  • Design Pages → Global Sections: header and footer
  • Design Pages → Post Templates: templates for posts, archives, search and 404
  • Design Pages → Design Tokens: colours, fonts, spacing and radius for every page
  • Design Pages → Business Info: the {{business:*}} values
  • Design Pages → Libraries: JS and CSS libraries loaded on your pages (administrators only)
  • Design Pages → Comments: all feedback threads on the site
  • Design Pages → Settings: everything above

Convert a Design Page to a regular page

Use Convert to Page on a Design Page in the list. Sections, page CSS and JS, extra stylesheets, schema, header and footer settings, the featured image, SEO fields and the layout mode all come across, and the original Design Page goes to the trash. If "Pages" is not ticked under allowed post types, converting ticks it.

The result reports whether the page's design tokens, fonts and page CSS print; for a published page it checks the live page. If Vision Builder Control is also active, the result names the styles it adds to the page. Restore to Design Page reverses it.

Next