How to Hide Blocks from Specific Users in WordPress Editor

Understanding the Need to Hide Blocks

WordPress, with its block editor (Gutenberg), offers a flexible and intuitive way to create content. However, in multi-author environments or situations where users have varying levels of technical expertise, you might want to restrict access to specific blocks. This could be for several reasons:

• Prevent accidental misuse: Certain blocks, if used incorrectly, could break the layout or functionality of your website.
• Maintain brand consistency: You might want to enforce the use of specific blocks for specific content types to ensure uniformity.
• Simplify the editor interface: Hiding complex or rarely used blocks can make the editor less daunting for less experienced users.
• Restrict access based on user roles: Certain blocks might be intended only for administrators or editors and should be hidden from authors or contributors.
• Enhance security: Limiting access to blocks that could be exploited for malicious purposes.

Methods for Hiding Blocks from Users

There are several approaches you can take to hide blocks from specific users in the WordPress editor. These range from simple CSS-based solutions to more complex PHP-based methods and plugin-based options.

1. Using CSS (Limited Effectiveness)

This is the simplest method, but it’s also the least secure. It relies on hiding blocks using CSS rules based on user roles. However, a savvy user can easily bypass these rules using browser developer tools.

How it works:

* WordPress adds CSS classes to the `body` element based on the current user’s role (e.g., `administrator`, `editor`, `author`).
* You can use these classes to target specific blocks in your CSS.

Example:

To hide the “Columns” block from users with the “author” role, you could add the following CSS to your theme’s stylesheet or using a custom CSS plugin:

“`css
.author .wp-block-columns {
display: none !important;
}
“`

Pros:

• Easy to implement.
• No coding required beyond CSS.

Cons:

• Easily bypassed by users.
• Not a secure solution.
• Can become difficult to manage with many rules.

2. Using PHP and the `allowed_block_types_all` Filter

This method involves using PHP code to filter the list of allowed block types based on the current user’s role. This is a more robust approach than CSS, as it actually prevents the blocks from being loaded into the editor for specific users.

How it works:

* You use the `allowed_block_types_all` filter in WordPress. This filter allows you to modify the array of block types that are available in the editor.
* Inside the filter function, you check the current user’s role using `wp_get_current_user()`.
* Based on the user’s role, you remove the unwanted block types from the array.

Example:

To hide the “Columns” block and the “Media & Text” block from users with the “author” role, you could add the following code to your theme’s `functions.php` file or a custom plugin:

“`php
function custom_allowed_block_types( $allowed_block_types, $block_editor_context ) {
$user = wp_get_current_user();

if ( in_array( ‘author’, (array) $user->roles ) ) {
$allowed_block_types = array_diff( $allowed_block_types, array(
‘core/columns’,
‘core/media-text’,
) );
}

return $allowed_block_types;
}
add_filter( ‘allowed_block_types_all’, ‘custom_allowed_block_types’, 10, 2 );
“`

Explanation:

* `custom_allowed_block_types`: This is the name of our custom function.
* `$allowed_block_types`: This is an array containing the names of all allowed block types.
* `$block_editor_context`: This provides context information about the block editor.
* `wp_get_current_user()`: This function retrieves the current user’s information.
* `in_array( ‘author’, (array) $user->roles )`: This checks if the user has the “author” role. We cast `$user->roles` to an array in case it’s not already an array.
* `array_diff( $allowed_block_types, array( ‘core/columns’, ‘core/media-text’ ) )`: This removes the “core/columns” and “core/media-text” blocks from the `$allowed_block_types` array.
* `add_filter( ‘allowed_block_types_all’, ‘custom_allowed_block_types’, 10, 2 )`: This hooks our custom function into the `allowed_block_types_all` filter. The `10` is the priority, and `2` indicates the number of arguments the function accepts.

To find the block name:

* You can open up the web developer console on any page in the editor and inspect the HTML for the block in question. The block name is usually in the form of ‘core/paragraph’, ‘acf/custom-block’.
* Alternatively, you can temporarily add `var_dump($allowed_block_types); die();` before returning the array inside the filter function. This will output the entire array of block names, allowing you to identify the correct name for the blocks you want to hide.

Pros:

• More secure than CSS.
• Actually prevents the blocks from loading for specific users.
• Customizable and flexible.

Cons:

• Requires PHP coding knowledge.
• Can become complex to manage with many blocks and user roles.
• Requires careful testing to avoid breaking the editor.

3. Using Plugins

Several plugins are available that simplify the process of hiding blocks from specific users. These plugins often provide a user-friendly interface for managing block access based on user roles.

Examples of popular plugins:

• Block Visibility: This plugin allows you to control the visibility of blocks based on various criteria, including user roles. It provides a simple interface for hiding blocks from specific users.
• PublishPress Blocks: This plugin offers a wide range of features for managing blocks, including the ability to restrict access based on user roles. It also provides features for creating custom block templates and managing reusable blocks.
• Advanced Gutenberg: Another good plugin with many block control options.

How it works:

* Install and activate the chosen plugin.
* Configure the plugin’s settings to specify which blocks should be hidden from which user roles.
* The plugin will automatically handle the logic of hiding the blocks from the appropriate users.

Pros:

• Easy to use.
• No coding required.
• Often provides a user-friendly interface.
• Can offer additional features for managing blocks.

Cons:

• Relies on a third-party plugin.
• May introduce compatibility issues.
• Can potentially add overhead to your website’s performance.
• Can become expensive if premium features are required.

Important Considerations

* Security: Remember that CSS-based solutions are not secure and can be easily bypassed. PHP-based solutions and plugins offer better security by actually preventing the blocks from loading.
* Performance: Avoid using too many plugins, as they can impact your website’s performance. If you only need to hide a few blocks, a PHP-based solution might be more efficient.
* User Experience: Consider the impact on user experience. Make sure to clearly communicate to users why certain blocks are not available to them.
* Testing: Thoroughly test your implementation to ensure that it works as expected and doesn’t break the editor for any users.
* Maintenance: Keep your plugins updated to ensure compatibility and security. If you’re using a PHP-based solution, keep your code organized and well-documented for easy maintenance.
* Child Themes: If you modify your theme’s `functions.php`, always use a child theme. This ensures that your changes are not lost when the parent theme is updated.
* Block Naming: Accurate block naming is crucial for both PHP filtering and plugin configurations. As mentioned earlier, inspect the HTML in your browser’s developer tools or temporarily use `var_dump` to confirm the correct block names. Incorrect block names will result in the filters not working as intended.

Choosing the Right Method

The best method for hiding blocks from specific users depends on your specific needs and technical skills.

• For simple cases and minimal security requirements: Use CSS. However, be aware of its limitations.
• For more robust security and control: Use a PHP-based solution with the `allowed_block_types_all` filter. This requires coding knowledge but provides more flexibility.
• For ease of use and a user-friendly interface: Use a plugin. This is a good option if you don’t have coding experience or need additional block management features.

Remember to carefully consider the pros and cons of each method before making a decision. Test your implementation thoroughly to ensure that it works as expected and doesn’t negatively impact your website’s performance or user experience.