Type – Background

'rowBackground' => [
  'label' => __( 'Site Background' ),
  'type'  => 'ct-background',
  'css' => '--site$',
],

CSS

You define only the prefix. The $ symbol will be replaced by several properties.

For example, if the CSS value is --site$, it will output these:

• --siteBackground - contains all the background values like image, repeat, position
• --siteBackgroundColor
• --siteBackgroundSize

Value Format

If Color:

'siteBackground' => blocksy_background_default_value([
  'background_type' => 'color',
  'backgroundColor' => [
    'default' => [ 'color' => '#f8f9fb' ],
  ],
]),

You need the function blocksy_background_default_value() to fill in the rest of the arguments.

If Pattern:

'siteBackground' => blocksy_background_default_value([
  'background_type' => 'pattern',
  'background_pattern' => 'type-1',
  'patternColor' => [
    'default' => [ 'color' => '#e5e7ea' ]
  ],
  'backgroundColor' => [
    'default' => [ 'color' => '#f8f9fb' ],
  ],
]),

If Image:

'siteBackground' => blocksy_background_default_value([
  'background_type' => 'image',
  'backgroundColor' => [
    'default' => [ 'color' => '#f8f9fb' ],
  ],
  'background_image' => [
    'attachment_id' => null,
    'x' => 0,
    'y' => 0
  ],
  'background_repeat' => 'no-repeat',
  'background_size' => 'auto',
  'background_attachment' => 'scroll',
]),