How to Use WordPress Zoom Image Capability

WordPress Zoom image capability is a new feature for image block in version 6.4. It also is called a lightbox. Users can click on the image and it will expand. Then by clicking outside the image area, the box will be closed. There is no need for a plugin for this anymore. Test it with the images below. It acts better on bigger images.

Add WordPress Zoom Image Capability to a Single Image

1. Go to block editor (WordPress Dashboard > All Posts > Edit a post) or site editor (WordPress Dashboard > Appearance > Editor > Templates > Edit a template).
2. Then, click on an Image block.
3. Next, click on the Link icon, and then on the Expand on click option from the Toolbar.

Zoom capability will be enabled for that specific image. Consider this option is disabled for images that are linked.

Add WordPress Zoom Image Globally via Site Editor

1. If you want to enable a lightbox for every image block in your website, go to Site Editor > Templates > click on a template (no matter which one) > click the preview on the right (for LTR languages) to open the edit template environment.
2. Then from the right, click on the Styles icon > Blocks > search for Image block and select it. Now, down in the Settings section, toggle on Expand on click.

This will enable image zoom for every image block in your WordPress website (except the image blocks you turn this feature off individually).

Add Zoom Image Capability Globally via theme.json

Open the theme.json file in the theme or child theme root directory. In “setting” > “blocks” > “core/image” > “lightbox” > set “allowEditing” to “true” and “enabled” to “true”. Consider changing the “$schema” to 6.4 as well. See the code example below.

If your theme does not have a theme.json file, create it. If your theme.json file code does not have the below code sections, add them carefully and always have a backup from the file.

{
  "$schema": "https://schemas.wp.org/wp/6.4/theme.json",
  "settings": {
    "blocks": {
      "core/image": {
        "lightbox": {
          "allowEditing": true,
          "enabled": true
        }
      }
    }
  },
  "version": 2
}

Conclusion

Using this tutorial, you can add the zoom feature to your images in WordPress (individually or all) without installing a plugin. Keep in mind that I test this feature only on block themes. I guess you like to read this article too: How to Set a Default Featured Image in WordPress