Convert a Figma design to editable WordPress
Connect your design and WordPress separately, prepare a frame, and review an editable Gutenberg draft.
1. Connect WordPress
Install the AI2WP plugin from Plugin & setup and pair your domain. Connect the AI2WP MCP from MCP connections. Your invitation or license, domain allowance and conversion allowance still apply.
2. Give your AI access to Figma
Enable the official Figma connection in your AI workspace using an account that can read the design. This is separate from AI2WP. The platform does not receive your Figma password or OAuth credentials. Web AI clients can use available MCP tools, but complete conversion requires a workspace with local files and browser testing, such as Codex or Claude Code.
3. Select and extract a frame
In Figma, select the intended page frame and copy its link. Use a design or file link containing node-id, not a prototype or Figma Make URL. Ask your AI to read the frame and extract section context, screenshots and assets before reserving a conversion. A link alone does not prove access. If extraction hits an access or quota limit, keep captured sections and resume later. A partial page requires your explicit agreement.
4. Prepare your brief
In Conversion, choose Figma design, paste the frame link and confirm your AI has read it. Choose your connected WordPress domain, page title and AI workspace. Confirm you have permission to reproduce the design, then prepare and copy your prompt. Preparing a brief reserves a conversion; retry or refine that same brief instead of creating another.
5. Build the editable draft
Open the matching downloaded AI2WP workspace and use its included skill. Your AI translates the extracted design into reviewed semantic sections and locally packages assets. Some designs require a reviewed design add-on installed by your WordPress administrator; the MCP does not upload executable plugin code. After readiness and preflight checks pass, the AI2WP gateway creates a separate draft without replacing the homepage.
6. Test before publishing
Compare the draft against the captured frame. In Gutenberg, change text, replace an image, move a section and adjust a responsive style. Save, reopen and check the public rendering, then restore test edits. Review complex animations, forms and pricing switches separately: a visual reconstruction does not automatically reproduce application behavior. Publish from WordPress after review.
Privacy and limitations
Figma frame URLs and reference screenshots stay out of public scans and the conversion directory. Source links are kept in your private brief. Do not place private Figma links in WordPress source metadata or canonical tags. We do not promise arbitrary Figma files will convert pixel-perfectly; quality and editor checks are recorded separately.