[Summary view] [Print] [Text view]

   1  <?php
   2  /**
   3   * Background block support flag.
   4   *
   5   * @package WordPress
   6   * @since 6.4.0
   7   */
   8  
   9  /**
  10   * Registers the style block attribute for block types that support it.
  11   *
  12   * @since 6.4.0
  13   * @access private
  14   *
  15   * @param WP_Block_Type $block_type Block Type.
  16   */
  17  function wp_register_background_support( $block_type ) {
  18      // Setup attributes and styles within that if needed.
  19      if ( ! $block_type->attributes ) {
  20          $block_type->attributes = array();
  21      }
  22  
  23      // Check for existing style attribute definition e.g. from block.json.
  24      if ( array_key_exists( 'style', $block_type->attributes ) ) {
  25          return;
  26      }
  27  
  28      $has_background_support = block_has_support( $block_type, array( 'background' ), false );
  29  
  30      if ( $has_background_support ) {
  31          $block_type->attributes['style'] = array(
  32              'type' => 'object',
  33          );
  34      }
  35  }
  36  
  37  /**
  38   * Renders the background styles to the block wrapper.
  39   * This block support uses the `render_block` hook to ensure that
  40   * it is also applied to non-server-rendered blocks.
  41   *
  42   * @since 6.4.0
  43   * @since 6.5.0 Added support for `backgroundPosition` and `backgroundRepeat` output.
  44   * @access private
  45   *
  46   * @param  string $block_content Rendered block content.
  47   * @param  array  $block         Block object.
  48   * @return string Filtered block content.
  49   */
  50  function wp_render_background_support( $block_content, $block ) {
  51      $block_type                   = WP_Block_Type_Registry::get_instance()->get_registered( $block['blockName'] );
  52      $block_attributes             = ( isset( $block['attrs'] ) && is_array( $block['attrs'] ) ) ? $block['attrs'] : array();
  53      $has_background_image_support = block_has_support( $block_type, array( 'background', 'backgroundImage' ), false );
  54  
  55      if (
  56          ! $has_background_image_support ||
  57          wp_should_skip_block_supports_serialization( $block_type, 'background', 'backgroundImage' )
  58      ) {
  59          return $block_content;
  60      }
  61  
  62      $background_image_source = isset( $block_attributes['style']['background']['backgroundImage']['source'] )
  63          ? $block_attributes['style']['background']['backgroundImage']['source']
  64          : null;
  65      $background_image_url    = isset( $block_attributes['style']['background']['backgroundImage']['url'] )
  66          ? $block_attributes['style']['background']['backgroundImage']['url']
  67          : null;
  68  
  69      if ( ! $background_image_source && ! $background_image_url ) {
  70          return $block_content;
  71      }
  72  
  73      $background_size     = isset( $block_attributes['style']['background']['backgroundSize'] )
  74          ? $block_attributes['style']['background']['backgroundSize']
  75          : 'cover';
  76      $background_position = isset( $block_attributes['style']['background']['backgroundPosition'] )
  77          ? $block_attributes['style']['background']['backgroundPosition']
  78          : null;
  79      $background_repeat   = isset( $block_attributes['style']['background']['backgroundRepeat'] )
  80          ? $block_attributes['style']['background']['backgroundRepeat']
  81          : null;
  82  
  83      $background_block_styles = array();
  84  
  85      if (
  86          'file' === $background_image_source &&
  87          $background_image_url
  88      ) {
  89          // Set file based background URL.
  90          $background_block_styles['backgroundImage']['url'] = $background_image_url;
  91          // Only output the background size and repeat when an image url is set.
  92          $background_block_styles['backgroundSize']     = $background_size;
  93          $background_block_styles['backgroundRepeat']   = $background_repeat;
  94          $background_block_styles['backgroundPosition'] = $background_position;
  95  
  96          // If the background size is set to `contain` and no position is set, set the position to `center`.
  97          if ( 'contain' === $background_size && ! isset( $background_position ) ) {
  98              $background_block_styles['backgroundPosition'] = 'center';
  99          }
 100      }
 101  
 102      $styles = wp_style_engine_get_styles( array( 'background' => $background_block_styles ) );
 103  
 104      if ( ! empty( $styles['css'] ) ) {
 105          // Inject background styles to the first element, presuming it's the wrapper, if it exists.
 106          $tags = new WP_HTML_Tag_Processor( $block_content );
 107  
 108          if ( $tags->next_tag() ) {
 109              $existing_style = $tags->get_attribute( 'style' );
 110              $updated_style  = '';
 111  
 112              if ( ! empty( $existing_style ) ) {
 113                  $updated_style = $existing_style;
 114                  if ( ! str_ends_with( $existing_style, ';' ) ) {
 115                      $updated_style .= ';';
 116                  }
 117              }
 118  
 119              $updated_style .= $styles['css'];
 120              $tags->set_attribute( 'style', $updated_style );
 121              $tags->add_class( 'has-background' );
 122          }
 123  
 124          return $tags->get_updated_html();
 125      }
 126  
 127      return $block_content;
 128  }
 129  
 130  // Register the block support.
 131  WP_Block_Supports::get_instance()->register(
 132      'background',
 133      array(
 134          'register_attribute' => 'wp_register_background_support',
 135      )
 136  );
 137  
 138  add_filter( 'render_block', 'wp_render_background_support', 10, 2 );