Image Block: Hide inline caption in editor when gallery toggle is off

dan-zakirov · dan-zakirov · commit 87ca863d58aa · 2026-04-20T17:13:25.000+03:00
Addresses testing feedback that `Show in gallery: off` only affected the
published front end and left the caption visible in the block editor.

- `image.js` now reads `showCaptionInGallery` from the provided block
  context and skips rendering the `&lt;Caption&gt;` component when it is
  explicitly false.
- Added `"default": true` to the `showCaptionInGallery` and
  `showCaptionInLightbox` attributes in `gallery/block.json` so the
  context value is a stable boolean; otherwise the serialized block
  context would have coerced the missing attribute to `false`, which
  would have hidden the caption for every gallery in the editor.
diff --git a/packages/block-library/src/gallery/block.json b/packages/block-library/src/gallery/block.json
@@ -115,10 +115,12 @@
 			"default": "auto"
 		},
 		"showCaptionInGallery": {
-			"type": "boolean"
+			"type": "boolean",
+			"default": true
 		},
 		"showCaptionInLightbox": {
-			"type": "boolean"
+			"type": "boolean",
+			"default": true
 		}
 	},
 	"providesContext": {
diff --git a/packages/block-library/src/image/image.js b/packages/block-library/src/image/image.js
@@ -311,7 +311,7 @@ export default function Image( {
 		setOffsetTop( imageElement?.offsetTop ?? 0 );
 	}, [ imageElement ] );
 	const setRefs = useMergeRefs( [ setImageElement, setResizeObserved ] );
-	const { allowResize = true } = context;
+	const { allowResize = true, showCaptionInGallery } = context;
 
 	const { image, canUserEdit, attachmentResolutionError } = useSelect(
 		( select ) => {
@@ -1333,18 +1333,20 @@ export default function Image( {
 			{ img }
 			{ resizableBox }
 
-			<Caption
-				attributes={ attributes }
-				setAttributes={ setAttributes }
-				isSelected={ isSingleSelected }
-				insertBlocksAfter={ insertBlocksAfter }
-				label={ __( 'Image caption text' ) }
-				showToolbarButton={
-					isSingleSelected &&
-					( hasNonContentControls || isContentOnlyMode ) &&
-					! hideCaptionControls
-				}
-			/>
+			{ showCaptionInGallery !== false && (
+				<Caption
+					attributes={ attributes }
+					setAttributes={ setAttributes }
+					isSelected={ isSingleSelected }
+					insertBlocksAfter={ insertBlocksAfter }
+					label={ __( 'Image caption text' ) }
+					showToolbarButton={
+						isSingleSelected &&
+						( hasNonContentControls || isContentOnlyMode ) &&
+						! hideCaptionControls
+					}
+				/>
+			) }
 		</>
 	);
 }
