WordPress Version: 6.5
/**
* Renders the background styles to the block wrapper.
* This block support uses the `render_block` hook to ensure that
* it is also applied to non-server-rendered blocks.
*
* @since 6.4.0
* @since 6.5.0 Added support for `backgroundPosition` and `backgroundRepeat` output.
* @access private
*
* @param string $block_content Rendered block content.
* @param array $block Block object.
* @return string Filtered block content.
*/
function wp_render_background_support($block_content, $block)
{
$block_type = WP_Block_Type_Registry::get_instance()->get_registered($block['blockName']);
$block_attributes = (isset($block['attrs']) && is_array($block['attrs'])) ? $block['attrs'] : array();
$has_background_image_support = block_has_support($block_type, array('background', 'backgroundImage'), false);
if (!$has_background_image_support || wp_should_skip_block_supports_serialization($block_type, 'background', 'backgroundImage')) {
return $block_content;
}
$background_image_source = isset($block_attributes['style']['background']['backgroundImage']['source']) ? $block_attributes['style']['background']['backgroundImage']['source'] : null;
$background_image_url = isset($block_attributes['style']['background']['backgroundImage']['url']) ? $block_attributes['style']['background']['backgroundImage']['url'] : null;
if (!$background_image_source && !$background_image_url) {
return $block_content;
}
$background_size = isset($block_attributes['style']['background']['backgroundSize']) ? $block_attributes['style']['background']['backgroundSize'] : 'cover';
$background_position = isset($block_attributes['style']['background']['backgroundPosition']) ? $block_attributes['style']['background']['backgroundPosition'] : null;
$background_repeat = isset($block_attributes['style']['background']['backgroundRepeat']) ? $block_attributes['style']['background']['backgroundRepeat'] : null;
$background_block_styles = array();
if ('file' === $background_image_source && $background_image_url) {
// Set file based background URL.
$background_block_styles['backgroundImage']['url'] = $background_image_url;
// Only output the background size and repeat when an image url is set.
$background_block_styles['backgroundSize'] = $background_size;
$background_block_styles['backgroundRepeat'] = $background_repeat;
$background_block_styles['backgroundPosition'] = $background_position;
// If the background size is set to `contain` and no position is set, set the position to `center`.
if ('contain' === $background_size && !isset($background_position)) {
$background_block_styles['backgroundPosition'] = 'center';
}
}
$styles = wp_style_engine_get_styles(array('background' => $background_block_styles));
if (!empty($styles['css'])) {
// Inject background styles to the first element, presuming it's the wrapper, if it exists.
$tags = new WP_HTML_Tag_Processor($block_content);
if ($tags->next_tag()) {
$existing_style = $tags->get_attribute('style');
$updated_style = '';
if (!empty($existing_style)) {
$updated_style = $existing_style;
if (!str_ends_with($existing_style, ';')) {
$updated_style .= ';';
}
}
$updated_style .= $styles['css'];
$tags->set_attribute('style', $updated_style);
$tags->add_class('has-background');
}
return $tags->get_updated_html();
}
return $block_content;
}