BlockStudio

Status
Alpha
Launch Mode
CodeWP AI mode

BlockStudio

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

BlockStudio is a popular block framework for building custom WordPress blocks. With CodeWP, you can use both chat and code modes to easily create BlockStudio blocks.

The chat mode allows you to ask questions and get helpful tips on block development with BlockStudio. You can learn how to register blocks, use attributes, create custom interfaces, and integrate with Advanced Custom Fields.

The code mode generates the actual PHP, JS, and CSS you need to build your custom blocks. It can create registration code, render callbacks, editor scripts, and styling for any type of block you want to build.

Between understanding from chat and implementation with code, CodeWP gives you the knowledge and tools to quickly build production-ready BlockStudio blocks. You can create everything from simple content blocks to complex, customizable landing page sections and layouts. Accelerate your workflow and spend more time focusing on design rather than coding.

Features

CodeWP offers an AI assistant for chat guidance, automatic BlockStudio code generation, snippets library, and tutorials to help developers quickly build, customize, and deploy WordPress blocks.

UIs

help
checkChat
checkCode

Presets

The BlockStudio 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.
Free
GA
Custom Block
Tailored for developing custom Gutenberg blocks in WordPress.
We expect to add more presets in the future. Have a request? Let us know!

Example Prompts, Packages, and Snippets

AI Prompt Examples for BlockStudio
Example prompt ideas for this CodeWP AI mode.
Prompt://
Create a BlockStudio block that displays a headline, WYSIWYG content, and a Call to Action button
Prompt://
Generate a BlockStudio block with an Advanced Custom Fields repeater field for testimonials
Prompt://
Build a BlockStudio slider block with 3 slides using ACF Gallery field. Provide PHP for registering the block and JSX for the editor
The conversational chat interface in CodeWP is extremely useful when working with BlockStudio for several reasons. You can get guidance on best practices for structuring your blocks, learn how to properly integrate ACF fields, and understand how to optimize blocks for editing. For example, you may ask "What is the best way to organize my block PHP classes?" and CodeWP will explain organizing into subdirectories and namespaces. Or you might say "I'm having trouble displaying ACF fields in my block preview" and CodeWP can provide the proper JSX to load and display the fields. The chat is great when you know what you want to achieve but lack the specifics on how to implement it in BlockStudio code. You can describe your goal such as "I need to create a block that displays posts in a carousel" and CodeWP can provide snippets and advice tailored to that goal. The chat mode bridges the gap between concept and implementation when building with BlockStudio.
This mode is only available for pro and agency plans.
Sign up for CodeWP to use it ->

Getting Started

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

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