diff --git a/lib/compat/wordpress-6.9/block-bindings.php b/lib/compat/wordpress-6.9/block-bindings.php index a54ddf45809766..fe41cd9ab72357 100644 --- a/lib/compat/wordpress-6.9/block-bindings.php +++ b/lib/compat/wordpress-6.9/block-bindings.php @@ -19,7 +19,7 @@ function ( $attributes, $block_type ) { $attributes[] = 'datetime'; } if ( - in_array( $block_type, array( 'core/navigation-link', 'core/navigation-submenu' ), true ) && + in_array( $block_type, array( 'core/navigation-link', 'core/navigation-submenu', 'core/cover' ), true ) && ! in_array( 'url', $attributes, true ) ) { $attributes[] = 'url'; diff --git a/packages/block-library/src/cover/block.json b/packages/block-library/src/cover/block.json index 97095ab4b95152..e70d9b339f1f4d 100644 --- a/packages/block-library/src/cover/block.json +++ b/packages/block-library/src/cover/block.json @@ -9,6 +9,9 @@ "attributes": { "url": { "type": "string", + "source": "attribute", + "selector": "img", + "attribute": "src", "role": "content" }, "useFeaturedImage": { diff --git a/packages/block-library/src/cover/edit/block-controls.js b/packages/block-library/src/cover/edit/block-controls.js index 450819d353e541..499c96cbc4b84b 100644 --- a/packages/block-library/src/cover/edit/block-controls.js +++ b/packages/block-library/src/cover/edit/block-controls.js @@ -3,6 +3,7 @@ */ import { useState } from '@wordpress/element'; +import { getBlockBindingsSource } from '@wordpress/blocks'; import { BlockControls, MediaReplaceFlow, @@ -10,6 +11,7 @@ import { __experimentalBlockFullHeightAligmentControl as FullHeightAlignmentControl, privateApis as blockEditorPrivateApis, } from '@wordpress/block-editor'; +import { useSelect } from '@wordpress/data'; import { __ } from '@wordpress/i18n'; import { MenuItem } from '@wordpress/components'; import { link } from '@wordpress/icons'; @@ -28,13 +30,20 @@ export default function CoverBlockControls( { setAttributes, onSelectMedia, currentSettings, + context, toggleUseFeaturedImage, onClearMedia, onSelectEmbedUrl, blockEditingMode, } ) { - const { contentPosition, id, useFeaturedImage, minHeight, minHeightUnit } = - attributes; + const { + contentPosition, + id, + useFeaturedImage, + minHeight, + minHeightUnit, + metadata, + } = attributes; const { hasInnerBlocks, url } = currentSettings; const [ prevMinHeightValue, setPrevMinHeightValue ] = useState( minHeight ); @@ -81,6 +90,25 @@ export default function CoverBlockControls( { } ); }; + const { lockUrlControls = false } = useSelect( + ( select ) => { + const blockBindingsSource = getBlockBindingsSource( + metadata?.bindings?.url?.source + ); + + return { + lockUrlControls: + !! metadata?.bindings?.url && + ! blockBindingsSource?.canUserEditValue?.( { + select, + context, + args: metadata?.bindings?.url?.args, + } ), + }; + }, + [ context, metadata?.bindings?.url ] + ); + return ( <> { ! isContentOnlyMode && ( diff --git a/packages/block-library/src/cover/edit/index.js b/packages/block-library/src/cover/edit/index.js index 869d5538d37126..44cbfa426d66ca 100644 --- a/packages/block-library/src/cover/edit/index.js +++ b/packages/block-library/src/cover/edit/index.js @@ -87,7 +87,7 @@ function CoverEdit( { setAttributes, setOverlayColor, toggleSelection, - context: { postId, postType }, + context, } ) { const { contentPosition, @@ -110,6 +110,7 @@ function CoverEdit( { sizeSlug, poster, } = attributes; + const { postId, postType } = context; const [ featuredImage ] = useEntityProp( 'postType', @@ -521,6 +522,7 @@ function CoverEdit( { toggleUseFeaturedImage={ toggleUseFeaturedImage } onClearMedia={ onClearMedia } blockEditingMode={ blockEditingMode } + context={ context } /> ); diff --git a/packages/block-library/src/cover/index.php b/packages/block-library/src/cover/index.php index 1d8643f6c9b877..195d3b84728d38 100644 --- a/packages/block-library/src/cover/index.php +++ b/packages/block-library/src/cover/index.php @@ -16,6 +16,9 @@ * @return string Returns the cover block markup, if useFeaturedImage is true. */ function render_block_core_cover( $attributes, $content ) { + $has_bindings_url = isset( $attributes['metadata']['bindings']['url'] ) && ! empty( $attributes['metadata']['bindings']['url'] ); + $uses_featured_image = false === $attributes['useFeaturedImage'] ? false : true; + // Handle embed video background. if ( isset( $attributes['backgroundType'] ) && @@ -131,6 +134,9 @@ function render_block_core_cover( $attributes, $content ) { : null; if ( ! ( $attributes['hasParallax'] || $attributes['isRepeated'] ) ) { + if ( $has_bindings_url && ! $uses_featured_image ) { + return $content; + } $attr = array( 'class' => 'wp-block-cover__image-background', 'data-object-fit' => 'cover', @@ -146,7 +152,7 @@ function render_block_core_cover( $attributes, $content ) { if ( in_the_loop() ) { update_post_thumbnail_cache(); } - $current_featured_image = get_the_post_thumbnail_url( null, $attributes['sizeSlug'] ?? null ); + $current_featured_image = $has_bindings_url ? $attributes['url'] : get_the_post_thumbnail_url( null, $attributes['sizeSlug'] ?? null ); if ( ! $current_featured_image ) { return $content; } diff --git a/packages/block-library/src/cover/save.js b/packages/block-library/src/cover/save.js index f4fce991630678..5abd4a010097f7 100644 --- a/packages/block-library/src/cover/save.js +++ b/packages/block-library/src/cover/save.js @@ -48,6 +48,7 @@ export default function save( { attributes } ) { tagName: Tag, sizeSlug, poster, + metadata: { bindings = {} } = {}, } = attributes; const overlayColorClass = getColorClassName( 'background-color', @@ -112,7 +113,7 @@ export default function save( { attributes } ) { { ! useFeaturedImage && isImageBackground && - url && + ( url || bindings?.url ) && ( isImgElement ? ( ) ) } - { isVideoBackground && url && ( + { isVideoBackground && ( url || bindings?.url ) && (