Launch Mode
CodeWP AI mode


note This mode is currently in alpha testing. After tested, it will be moved to beta, then GA.

Gutenberg is the new WordPress block editor that allows you to easily build customizable page layouts. With CodeWP, you can leverage chat and code modes to create custom Gutenberg blocks.

The chat mode provides guidance on block anatomy, attributes, templates, styles, and JavaScript. You can understand how to register blocks, work with the block API, and deeply integrate with the editor.

The code mode generates React components, block registration code, editor scripts, static block JSON, and CSS to build production-ready custom blocks. CodeWP gives you the tools to extend Gutenberg.


CodeWP offers an AI assistant for explanations, automated code generation, verified snippets library, and tutorials to build custom Gutenberg blocks.




The Gutenberg Mode comes with a number of presets that can be used to quickly generate code for common tasks. These presets are designed to be used as a starting point for your snippet/plugin generation while generating Code.
Native Block
Have CodeWP's AI Assistant walk you through the process of generating a native WordPress block.
We expect to add more presets in the future. Have a request? Let us know!

Example Prompts, Packages, and Snippets

AI Prompt Examples for Gutenberg
Example prompt ideas for this CodeWP AI mode.
Write the code to create a custom formatting control for applying H1 to H6 tags to text in Gutenberg.
Build a Gutenberg block with two columns where the user can add content modules in each column.
Generate the JSX, styles, and registration code for a Gutenberg block displaying a slider with ACF fields as slides.
The CodeWP conversational chat mode enables intuitive assistance with any aspect of Gutenberg custom block development. You can ask how to register blocks, use block attributes, create custom interfaces, integrate ACF, build complex layouts, and more. Simply describe what you want to build in plain language and CodeWP will provide tailored Gutenberg snippets, detailed explanations, and guidance to accomplish your goals. The natural language interface makes it easy to learn best practices and implement precise custom blocks for the WordPress editor.
This mode is available for all plans.
Sign up for CodeWP to use it ->

Getting Started

To get started with the Gutenberg Mode, simply select the Gutenberg Mode from the dropdown menu in the Code and Chat UIs. You can then begin generating code or asking questions.

You can also select Gutenberg Mode on the "Create New" screen.
Make WordPress Easy With AI
© WPAI, Inc. 2024 | d.b.a CodeWP