Brifing

PHP-Only Block Development in WordPress

Create custom WordPress blocks without learning React or JavaScript.

CSS-Tricks3 min

1Introduction to PHP-Only Block Registration

WordPress 7.0 introduces a revolutionary feature allowing developers to create custom blocks using only PHP, eliminating the need for React or JavaScript knowledge. The 'autoRegister' flag enables block registration with minimal PHP code, removing the traditional dual registration requirement (PHP and JavaScript). A simple 'Hello World' block can now be created with just a few lines of PHP, making block development accessible to a wider range of developers.

2Advantages of PHP-Only Blocks

This new system brings back the simplicity of early WordPress development days. Developers no longer need to deal with NPM packages or complex build pipelines. Block features are defined using simple PHP arrays, and WordPress automatically generates the necessary JavaScript code. The blocks work seamlessly in the block editor, making this approach ideal for simple content blocks. This significantly lowers the barrier to entry for custom block development.

3Adding Customizable Attributes

PHP-only blocks support attributes that allow users to customize block appearance and behavior. Unlike traditional methods, control elements are automatically generated. For example, defining a 'greeting' attribute in your PHP code makes WordPress automatically create a corresponding text input in the block's settings panel. Attributes are defined during block registration using PHP arrays, with support for default values and basic data types.

4Block Preview Limitations

The most significant drawback of PHP-only blocks is the lack of interaction with block content. The preview only shows static HTML output from the PHP render function. Users cannot edit content directly within the block preview - all controls are confined to the settings sidebar. Additionally, some basic features like multi-line text inputs or image uploads aren't currently supported, limiting the types of blocks that can be effectively created with this approach.

5Incompatibility with JavaScript Libraries

PHP-only blocks aren't suitable for creating interactive components like sliders. This is because the block preview constantly re-renders, making DOM manipulation unreliable. While JavaScript libraries might work on the front end, they often fail in the editor preview. This architectural limitation makes PHP-only blocks inappropriate for dynamic content display or any block requiring client-side interactivity.

6Data Freshness Issues

PHP-only blocks bypass WordPress's client-side data store, querying the database directly. This means changes made in the editor don't immediately reflect in block previews. For example, if a post title changes, PHP-only blocks will continue showing the old title until the post is saved and the editor reloaded. This makes them unsuitable for blocks that need to reflect real-time editor changes.

7Lack of Control and Flexibility

JavaScript-based block development offers complete control and flexibility, with access to all WordPress Core controls and the ability to create custom ones. PHP-only blocks are limited to automatically generated basic controls. This restriction makes creating complex blocks nearly impossible, forcing developers to use JavaScript for anything beyond simple static content.

8Architectural Constraints

The limitations of PHP-only blocks stem from fundamental architectural decisions that aren't likely to change. While the block editor operates as a single-page JavaScript application, PHP-only blocks can't fully integrate with this architecture. This means JavaScript knowledge will remain essential for advanced block development, despite the convenience offered by the PHP-only approach for simpler use cases.

9Ideal Use Cases

PHP-only blocks work best for simple content blocks requiring minimal interaction. Static text blocks with custom CSS classes or basic HTML elements can be easily created this way. However, blocks displaying dynamic content, requiring user interaction, or needing complex editing interfaces should use traditional JavaScript-based methods. Developers should evaluate project requirements carefully when choosing between these approaches.

10Developer Experience

PHP-only blocks significantly lower the learning curve for developers familiar with WordPress's classic development model. They enable quick creation of custom blocks without React's learning curve. However, this convenience comes at the cost of important features. Developers must weigh the trade-offs between simplicity and functionality when deciding which approach to use for their projects.

11Future Enhancements

The WordPress core team is working to expand PHP-only blocks' capabilities, with plans to add more control types and basic interaction support. However, these enhancements won't match the flexibility of JavaScript-based blocks. WordPress aims to provide developers with choice, emphasizing the strengths of both approaches while acknowledging their respective limitations for different use cases.

12Conclusion and Recommendations

PHP-only blocks offer a welcome alternative in the WordPress block development landscape. While perfect for simple blocks, they fall short for complex projects. Beginners can use this feature to start block development, but professional projects will still require JavaScript knowledge. This innovation represents WordPress's commitment to accommodating developers of all skill levels while expanding the platform's capabilities.

Original article: CSS-Tricks — WordPress'te PHP ile Blok Geliştirme Dönemi