Title: WPBits Block Studio
Author: WPBits
Published: <strong>जुलाई 12, 2026</strong>
Last modified: अगस्त 28, 2026

---

Search plugins

![](https://ps.w.org/wpbits-block-studio/assets/banner-772x250.jpg?rev=3604572)

![](https://ps.w.org/wpbits-block-studio/assets/icon.svg?rev=3604572)

# WPBits Block Studio

 By [WPBits](https://profiles.wordpress.org/wpbits/)

[Download](https://downloads.wordpress.org/plugin/wpbits-block-studio.1.0.1.zip)

 * [Details](https://mai.wordpress.org/plugins/wpbits-block-studio/#description)
 * [Reviews](https://mai.wordpress.org/plugins/wpbits-block-studio/#reviews)
 *  [Installation](https://mai.wordpress.org/plugins/wpbits-block-studio/#installation)
 * [Development](https://mai.wordpress.org/plugins/wpbits-block-studio/#developers)

 [Support](https://wordpress.org/support/plugin/wpbits-block-studio/)

## Description

WPBits Block Studio is a developer-first Gutenberg block builder for creating static
and dynamic custom blocks with visual attribute editing, Twig templates, file synchronization,
and exportable block code.

Block Studio accelerates custom Gutenberg block development through a visual workflow.
Define attributes, configure controls, set up templates, and generate standard WordPress
block files — all from within the WordPress admin. The generated code is yours to
inspect, modify, and integrate into themes, plugins, or any WordPress project.

#### Why Block Studio?

 * **Visual Development Workflow** — Build custom Gutenberg blocks through a visual
   development interface.
 * **Real, Editable Block Files** — Generate standard WordPress block files that
   developers can inspect, modify, and integrate into their own projects.
 * **Static & Dynamic Rendering** — Create both static blocks and server-rendered
   dynamic blocks.
 * **Twig Templates** — Use clean, maintainable Twig templates for block markup.
 * **Developer Freedom** — Export and integrate generated blocks into themes, plugins,
   and other WordPress development workflows.

#### Perfect For

 * WordPress developers building custom blocks
 * Agencies creating blocks for multiple clients
 * Theme developers needing block patterns
 * Plugin developers requiring custom blocks
 * Advanced users who want to accelerate block development

### Free Features

 * **Visual Block Builder** – Accelerate block development through a visual workflow
 * **Schema-Based Generation** – JSON schema defines block structure
 * **Static & Dynamic Blocks** – Build both static and dynamic Gutenberg blocks
 * **Twig Template Engine** – Familiar templating syntax with powerful features
 * **Attribute Editor** – Visual editing for block attributes
 * **Conditional Visibility** – Show/hide blocks based on conditions
 * **Template System** – Reusable block templates
 * **Block Supports Editor** – Configure block support options
 * **Location Rules** – Control where blocks appear
 * **Auto-Sync** – Synchronize externally edited generated block files
 * **Import/Export** – Import and export block configurations
 * **Role-Based Access** – Control access by user role
 * **Internationalization** – Full i18n support for translations

### Pro Features

Need more control? Block Studio Pro adds InnerBlocks, repeaters, custom PHP rendering,
advanced organization tools, custom output paths, and standalone plugin export.

 * **Custom Render PHP** – Use your own PHP render logic
 * **Repeater Control Type** – Nested repeatable attribute groups
 * **Post Selector** – Select posts/pages with thumbnail preview
 * **InnerBlocks Support** – Configure nested block areas
 * **Groups Tab** – Organize attributes into collapsible sections
 * **Custom Categories** – Organize blocks in the inserter
 * **Custom Output Directory** – Set where block files are saved
 * **Custom Icon Upload** – Upload SVG, PNG, JPG, GIF icons
 * **Export as Plugin** – Package blocks as standalone WordPress plugins

#### Available Control Types

**Free Controls (18):**

 * Text – Single-line text input
 * Textarea – Multi-line text input with optional TinyMCE rich editor
 * Rich Text – WordPress rich text editor
 * Number – Numeric input with min/max/step
 * Range – Slider control with min/max/step
 * Checkbox – Boolean checkbox
 * Toggle – On/off toggle switch
 * Select – Dropdown select
 * Multi-Select – Multiple selection dropdown
 * Combobox – Searchable dropdown with free-text entry
 * Radio – Radio button group
 * Color – Color picker with palette support
 * Image – Media library image picker
 * Date – Popover-based date picker with format options
 * DateTime – Combined date and time picker
 * Time – Time-only picker
 * Link – URL picker with search and open-in-new-tab option
 * Unit – Numeric input with unit suffix (px, em, rem, %, etc.)

**Pro Controls (2):**

 * Repeater – Nested repeatable field groups with sub-fields (PRO)
 * Post Selector – Select posts/pages with thumbnail support (PRO)

#### Generated Block Structure

Block Studio generates standard WordPress block files that work independently of
the plugin. Each generated block includes:

 * `block.json` – Block metadata and configuration
 * `index.js` – Block registration
 * `edit.js` – Editor component
 * `save.js` – Save function (static blocks)
 * `render.php` – Server-side rendering (dynamic blocks)
 * `template.twig` – Twig template (when Twig mode is enabled)
 * `style.css` – Frontend styles
 * `editor.css` – Editor-only styles
 * `README.md` – Block documentation

Static blocks include `save.js` with the client-side save function. Dynamic blocks
include `render.php` for server-side rendering. All generated files follow WordPress
block development conventions and can be used with or without Block Studio installed.

### Developer Notes

#### REST API Endpoints

The plugin provides REST API endpoints for programmatic block management:

 * `GET /wp-json/wpbs/v1/blocks` – List all blocks
 * `POST /wp-json/wpbs/v1/blocks` – Create a new block
 * `GET /wp-json/wpbs/v1/blocks/{id}` – Get a single block
 * `PUT /wp-json/wpbs/v1/blocks/{id}` – Update a block
 * `DELETE /wp-json/wpbs/v1/blocks/{id}` – Delete a block
 * `POST /wp-json/wpbs/v1/blocks/{id}/generate` – Generate block files
 * `POST /wp-json/wpbs/v1/blocks/{id}/export` – Export block to ZIP
 * `GET /wp-json/wpbs/v1/settings` – Get plugin settings
 * `POST /wp-json/wpbs/v1/settings` – Update plugin settings

#### Filters & Actions

Developers can extend the plugin using WordPress hooks:

 * `wpbs_block_generation_path` – Filter the output path for generated blocks
 * `wpbs_template_replacements` – Filter template placeholder replacements
 * `wpbs_after_block_generation` – Action fired after block generation

#### Source Code & Build Tools

The human-readable JavaScript source files for the React admin interface are included
in this plugin package under the `admin/` directory.

### Privacy Policy

This plugin does not collect, store, or transmit any user data. All block schemas
are stored locally in your WordPress database.

### Support

For support, feature requests, or bug reports:

 * Visit [wpbits.net/contact](https://wpbits.net/contact/)
 * Use the in-plugin contact form
 * Manage your account at [account.wpbits.net](https://account.wpbits.net/)
 * Upgrade to Pro: [wpbits.net/blockstudio-pricing](https://wpbits.net/blockstudio-pricing/)

## Screenshots

[⌊Dashboard – Overview of all created blocks with DataViews⌉⌊Dashboard – Overview
of all created blocks with DataViews⌉[

Dashboard – Overview of all created blocks with DataViews

[⌊Block Form – Create and edit blocks with tabbed interface and validation⌉⌊Block
Form – Create and edit blocks with tabbed interface and validation⌉[

Block Form – Create and edit blocks with tabbed interface and validation

[⌊Attribute Editor – Visual editor with drag-and-drop reordering and conditional
visibility⌉⌊Attribute Editor – Visual editor with drag-and-drop reordering and conditional
visibility⌉[

Attribute Editor – Visual editor with drag-and-drop reordering and conditional visibility

[⌊Settings Page – Configure defaults, role management, and sync options⌉⌊Settings
Page – Configure defaults, role management, and sync options⌉[

Settings Page – Configure defaults, role management, and sync options

[⌊Icon Picker – Choose block icons from supported WordPress icon options⌉⌊Icon Picker–
Choose block icons from supported WordPress icon options⌉[

Icon Picker – Choose block icons from supported WordPress icon options

[⌊Export Options – Export block configurations⌉⌊Export Options – Export block configurations⌉[

Export Options – Export block configurations

[⌊Sync Status – Track externally edited generated files and sync state across all
blocks⌉⌊Sync Status – Track externally edited generated files and sync state across
all blocks⌉[

Sync Status – Track externally edited generated files and sync state across all 
blocks

[[

## Installation

 1. Upload the plugin files to the `/wp-content/plugins/wpbits-block-studio` directory,
    or install the plugin through the WordPress plugins screen directly.
 2. Activate the plugin through the ‘Plugins’ screen in WordPress.
 3. Navigate to **WPBits Block Studio** in your WordPress admin menu.
 4. Start creating blocks!

#### Manual Installation

 1. Download the plugin ZIP file.
 2. Go to WordPress admin  Plugins  Add New.
 3. Click “Upload Plugin” and select the ZIP file.
 4. Click “Install Now” and then “Activate Plugin”.

#### Requirements

 * WordPress 6.5 or higher
 * PHP 8.0 or higher (PHP 8.3 recommended)
 * Node.js 20.x for development builds

## FAQ

### Do I need coding knowledge to use this plugin?

Basic understanding of WordPress blocks is helpful. The visual interface accelerates
block development, but familiarity with block concepts helps you get the most out
of the generated code.

### Can I edit the generated blocks after creation?

Yes. You can update block configuration in the plugin interface, regenerate files,
or edit generated project files externally with your own editor, FTP, or local development
workflow.

### What’s the difference between static and dynamic blocks?

Static blocks save their output directly to the post content using JavaScript’s 
save function. Dynamic blocks render on the server side using the generated Twig
template, which is better for content that changes frequently.

### Can I use Twig templates?

Yes. WPBits Block Studio generates `template.twig` files and renders them through
the plugin runtime. Edit those generated files outside wp-admin using your normal
development tools.

### Can I use the generated blocks in my theme?

Yes. The free version generates block files in the plugin-managed output directory.
Pro can generate to a custom output directory.

### Does this work with block themes?

Yes! The plugin is fully compatible with both classic and block themes.

### Can I import existing blocks?

Yes, you can import compatible generated block files and regenerate them.

### Can I export multiple blocks at once?

The free version supports block configuration export. The separate Pro version adds
standalone plugin export.

### How does auto-sync work?

Auto-sync monitors generated block files edited outside wp-admin and compares them
with the saved block definitions. It detects new or changed generated files so you
can keep the file workflow and block configuration in sync.

## Reviews

There are no reviews for this plugin.

## Contributors & Developers

“WPBits Block Studio” is open source software. The following people have contributed
to this plugin.

Contributors

 *   [ WPBits ](https://profiles.wordpress.org/wpbits/)
 *   [ KEREM YILMAZ GUNEY ](https://profiles.wordpress.org/kyguney/)

[Translate “WPBits Block Studio” into your language.](https://translate.wordpress.org/projects/wp-plugins/wpbits-block-studio)

### Interested in development?

[Browse the code](https://plugins.trac.wordpress.org/browser/wpbits-block-studio/),
check out the [SVN repository](https://plugins.svn.wordpress.org/wpbits-block-studio/),
or subscribe to the [development log](https://plugins.trac.wordpress.org/log/wpbits-block-studio/)
by [RSS](https://plugins.trac.wordpress.org/log/wpbits-block-studio/?limit=100&mode=stop_on_copy&format=rss).

## Changelog

#### 1.0.1

 * Improved product positioning and documentation
 * Refactored CSS editor state handlers for improved reliability
 * Tested up to WordPress 7.1

#### 1.0.0

Initial release of WPBits Block Studio.

## Meta

 *  Version **1.0.1**
 *  Last updated **14 hours ago**
 *  Active installations **Fewer than 10**
 *  WordPress version ** 6.5 or higher **
 *  Tested up to **7.1**
 *  PHP version ** 8.0 or higher **
 *  Language
 * [English (US)](https://wordpress.org/plugins/wpbits-block-studio/)
 * Tags
 * [Block Builder](https://mai.wordpress.org/plugins/tags/block-builder/)[blocks](https://mai.wordpress.org/plugins/tags/blocks/)
   [developer-tools](https://mai.wordpress.org/plugins/tags/developer-tools/)[generator](https://mai.wordpress.org/plugins/tags/generator/)
   [gutenberg](https://mai.wordpress.org/plugins/tags/gutenberg/)
 *  [Advanced View](https://mai.wordpress.org/plugins/wpbits-block-studio/advanced/)

## Ratings

No reviews have been submitted yet.

[Your review](https://wordpress.org/support/plugin/wpbits-block-studio/reviews/#new-post)

[See all reviews](https://wordpress.org/support/plugin/wpbits-block-studio/reviews/)

## Contributors

 *   [ WPBits ](https://profiles.wordpress.org/wpbits/)
 *   [ KEREM YILMAZ GUNEY ](https://profiles.wordpress.org/kyguney/)

## Support

Got something to say? Need help?

 [View support forum](https://wordpress.org/support/plugin/wpbits-block-studio/)