WordPress 6.0 scheduled to release on May 24th is introducing the block lock feature. The feature is especially helpful for freelancers or agencies building sites for clients. In many cases, you wouldn’t want the site administrators to easily change the contents/blocks or accidentally change its settings/placements. The block lock features allow you to lock a specific block so that it won’t be able to be removed or change its placement.


Block Lock

It comes with two special settings.

  1. Disable Movement: To disable the movement of the block.
  2. Prevent Removal: To prevent removal of the block.

Note that the lock can be unlocked easily. It just prevents accidental movement or removal.


Block Lock Options

For the developers:

The whole Lock/Unlock feature can be disabled globally or conditionally.


Lock and lock forever

Suppose you are a freelancer and want to lock the block forever so that the site owners can’t move or delete the block. In this case, you can lock the block and apply the following code:

add_filter(
    'block_editor_settings_all',
    function( $settings, $context ) {

        $settings['canLockBlocks'] = false;

        return $settings;
    },
    10,
    2
);

Lock Conditionally

Lock the block for specific user roles, specific user accounts, or depending on post types using the code:

add_filter(
    'block_editor_settings_all',
    function( $settings, $context ) {
        // Allow for the Editor role and above - https://wordpress.org/support/article/roles-and-capabilities/.
        $settings['canLockBlocks'] = current_user_can( 'delete_others_posts' );
 
        // Only enable for specific user(s).
        $user = wp_get_current_user();
        if ( in_array( $user->user_email, [ 'user@example.com' ], true ) ) {
            $settings['canLockBlocks'] = false;
        }
 
        // Disable for posts/pages.
        if ( $context->post && $context->post->post_type === 'page' ) {
            $settings['canLockBlocks'] = false;
        }
 
        return $settings;
    },
    10,
    2
);

For the block developers:

If you want to disable the block lock feature for your specific block, you can specify the lock property on the controls level in your block.json file or index.js file. Example code below:

{
    "apiVersion": 2,
    "name": "my/my-block",
    "title": "My Block",
    "category": "widgets",
    "description": "The best block in the market.",
    "supports": {
        "html": true,
        "lock": false
    },
}

When you’re building your own blocks, you might be using wp-scripts them to build the blocks. You might be interested in src/build folder customization for @wordpress/scripts


I hope you find this helpful. Enjoy creating!

WordPress 6.0 introduces the block lock feature
Tagged on:         

Sanjeev Aryal

Don't bury your thoughts, put your vision into reality ~ Bob Marley.

Leave a Reply

Your email address will not be published.

Pin It on Pinterest