Create a synced pattern containing an image block

Oct 13, 2025 by thesweetdesigns.com 93 views

Introduction

In a synced pattern with overrides enabled, the Image Block's description popup is expected to close when clicking outside it or when another popup opens. However, the popup remains open, causing issues with the user experience. This article aims to provide a detailed explanation of the problem, step-by-step reproduction instructions, and environment information to help resolve this issue.

Problem Description

The Image Block's description popup does not close properly in a synced pattern with overrides enabled. This is a critical issue that affects the user experience, as it prevents users from accessing other popups or interacting with the Image Block.

Step-by-Step Reproduction Instructions

To reproduce this issue, follow these steps:

Create a synced pattern containing an image block: Create a new synced pattern in your WordPress site and add an image block to it.
Enable overrides for the image: Go to the image block settings and enable overrides.
Insert the synced pattern on a page and replace the image with a new one: Insert the synced pattern on a page and replace the image with a new one.
Go to a page containing an Image Block inside a synced pattern with overrides enabled: Go to a page that contains an Image Block inside a synced pattern with overrides enabled.
Click on the Image Block’s description icon to open the popup: Click on the Image Block’s description icon to open the popup.
Click outside the popup but inside the Image Block, or open another popup: Click outside the popup but inside the Image Block, or open another popup.

Screenshots, Screen Recording, Code Snippet

You can find the screenshots and screen recording of this issue at the following link:

https://github.com/user-attachments/assets/fee00157-5c03-49b7-888f-7d4406c73e03

Environment Info

The following environment information is relevant to this issue:

WordPress: 6.7.2
Gutenberg: 20.4.0
Theme: Twenty Twenty-Four
Browser: Chrome
Device: Desktop Mac OS

Pre-Existing Issue Search

Yes, I have searched existing issues in the repo and have not found a similar issue.

Plugin Deactivation Test

Yes, I have tested with all plugins deactivated except Gutenberg, and the issue still persists.

Theme Type

I used a Block theme for testing.

Conclusion

Q: What is the issue with the Image Block's description popup?

A: The Image Block's description popup does not close properly in a synced pattern with overrides enabled. This means that when you click outside the popup or open another popup, the description popup remains open.

Q: What is a synced pattern?

A: A synced pattern is a feature in WordPress that allows you to create a reusable block of content that can be inserted into multiple pages. This feature is useful for creating consistent layouts and designs across your website.

Q: What is an override?

A: An override is a feature in WordPress that allows you to customize the behavior of a block or a pattern. In the case of the Image Block's description popup, an override is used to enable the popup to stay open even when you click outside it.

Q: What are the steps to reproduce this issue?

A: To reproduce this issue, follow these steps:

Create a synced pattern containing an image block.
Enable overrides for the image.
Insert the synced pattern on a page and replace the image with a new one.
Go to a page containing an Image Block inside a synced pattern with overrides enabled.
Click on the Image Block’s description icon to open the popup.
Click outside the popup but inside the Image Block, or open another popup.

Q: What environment information is relevant to this issue?

A: The following environment information is relevant to this issue:

WordPress: 6.7.2
Gutenberg: 20.4.0
Theme: Twenty Twenty-Four
Browser: Chrome
Device: Desktop Mac OS

Q: Have you searched existing issues in the repo?

A: Yes, I have searched existing issues in the repo and have not found a similar issue.

Q: Have you tested with all plugins deactivated except Gutenberg?

A: Yes, I have tested with all plugins deactivated except Gutenberg, and the issue still persists.

Q: What theme type did you use for testing?

A: I used a Block theme for testing.

Q: What is the expected behavior of the Image Block's description popup?

A: The expected behavior of the Image Block's description popup is that it should close when you click outside it or when another popup opens.

Q: What is the current behavior of the Image Block's description popup?

A: The current behavior of the Image Block's description popup is that it remains open even when you click outside it or when another popup opens.

Q: How can this issue be resolved?

A: This issue can be resolved by investigating the cause of the problem and providing a solution to close the popup properly. This may involve updating the code for the Image Block's description popup or modifying the behavior of the synced pattern with overrides enabled.