: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
// Background hover styles
$bg_color = $hover->get_value( 'background_color', $this->props );
$bg_color = empty( $bg_color ) ? $background_color : $bg_color;
if ( $hover->is_enabled( 'background', $this->props ) && ! empty( $bg_color ) ) {
ET_Builder_Element::set_style( $function_name, array(
'selector' => '%%order_class%%.et_pb_section:hover',
'declaration' => sprintf(
'background-color:%s !important;',
// Transparent is default for Builder Plugin, but not for theme
$is_transparent_background = $this->is_transparent_background( $background_color );
$is_transparent_background_tablet = $this->is_transparent_background( $background_color_tablet );
$is_transparent_background_phone = $this->is_transparent_background( $background_color_phone );
$is_background_color = ( '' !== $background_color && ! $is_transparent_background ) || ( '' !== $background_color_tablet && ! $is_transparent_background_tablet ) || ( '' !== $background_color_phone && ! $is_transparent_background_phone );
if ( ! empty( $background_video ) || $is_background_color || '' !== $background_image ) {
$this->add_classname( 'et_pb_with_background' );
if ( 'on' === $parallax ) {
$this->add_classname( 'et_pb_section_parallax' );
$this->add_classname( $this->generate_css_filters( $function_name ) );
if ( 'on' === $inner_shadow && ! ( '' !== $background_image && 'on' === $parallax && 'off' === $parallax_method ) ) {
$this->add_classname( 'et_pb_inner_shadow' );
if ( 'on' === $fullwidth ) {
$this->add_classname( 'et_pb_fullwidth_section' );
if ( 'on' === $specialty ) {
$this->add_classname( 'et_section_specialty' );
$this->add_classname( 'et_section_regular' );
if ( $is_transparent_background || $is_transparent_background_tablet || $is_transparent_background_phone ) {
$this->add_classname( 'et_section_transparent' );
$divider = ET_Builder_Module_Fields_Factory::get( 'Divider' );
// pass section number for background color usage.
$divider->count = $this->render_count();
foreach ( array( 'bottom', 'top' ) as $placement ) {
foreach ( array( 'desktop', 'tablet', 'phone' ) as $device ) {
// Ensure responsive settings for style is active on tablet and phone.
$is_desktop = 'desktop' === $device;
$is_responsive_style = et_pb_responsive_options()->is_responsive_enabled( $this->props, "{$placement}_divider_style" );
// Get all responsive values if it's exist and not empty.
$values = et_pb_responsive_options()->get_any_responsive_values( $this->props, array(
"{$placement}_divider_color" => '',
"{$placement}_divider_height" => '',
"{$placement}_divider_repeat" => '',
"{$placement}_divider_flip" => '',
"{$placement}_divider_arrangement" => '',
$divider_style = $is_desktop || ! empty( $values ) ? et_pb_responsive_options()->get_any_value( $this->props, "{$placement}_divider_style" ) : '';
if ( ! $is_desktop && $is_responsive_style ) {
$divider_style = et_pb_responsive_options()->get_any_value( $this->props, "{$placement}_divider_style", '', true, $device );
// Check if style is not default.
if ( '' !== $divider_style ) {
// get an svg for using in ::before
$breakpoint = ! $is_desktop ? $device : '';
$divider->process_svg( $placement, $this->props, $breakpoint, $values );
// Get the placeholder for the bottom/top.
if ( 'bottom' === $placement && '' === $bottom ) {
$bottom = $divider->get_svg( 'bottom' );
} else if ( 'top' === $placement && '' === $top ) {
$top = $divider->get_svg( 'top' );
// add a corresponding class
$this->add_classname( $divider->classes );
if ( $multi_view->has_value( 'positioning', 'absolute' ) ) {
$this->add_classname( 'et_pb_section--absolute' );
if ( $multi_view->has_value( 'positioning', 'fixed' ) ) {
$this->add_classname( 'et_pb_section--fixed' );
$muti_view_attributes = $multi_view->render_attrs( array(
'et_pb_section--absolute' => array(
'positioning' => 'absolute',
'et_pb_section--fixed' => array(
'positioning' => 'fixed',
// Remove automatically added classnames
$this->remove_classname( 'et_pb_module' );
// Save module classes into variable BEFORE processing the content with `do_shortcode()`
// Otherwise order classes messed up with internal sections if exist
$module_classes = $this->module_classname( $function_name );
'<div%4$s class="%3$s"%8$s %11$s>
</div> <!-- .et_pb_section -->',
do_shortcode( et_pb_fix_shortcodes( $content ) ), // 1
sprintf( '<div class="et_pb_row%1$s"%2$s>', $gutter_class, et_core_esc_previously( $gutter_hover_data ) )
( 'on' === $specialty ? '</div> <!-- .et_pb_row -->' : '' ), // 6
$this->get_module_data_attributes(), // 8
et_core_esc_previously( $top ), // 9
et_core_esc_previously( $bottom ), // 10,
et_core_esc_previously( $muti_view_attributes )
if ( 'on' === $specialty ) {
// reset the global column settings to make sure they are not affected by internal content
$et_pb_all_column_settings = $et_pb_all_column_settings_backup;
if ( $et_pb_rendering_column_content_row ) {
$et_pb_rendering_column_content_row = false;
public function process_box_shadow( $function_name ) {
* @var ET_Builder_Module_Field_BoxShadow $boxShadow
$boxShadow = ET_Builder_Module_Fields_Factory::get( 'BoxShadow' );
$style = $boxShadow->get_value( $this->props );
$hover_style = $boxShadow->get_value( $this->props, array( 'hover' => true ) );
if ( ! empty( $style ) && 'none' !== $style && false === strpos( $style, 'inset' ) ) {
// Make section z-index higher if it has outer box shadow #4762
self::set_style( $function_name, array(
'selector' => '%%order_class%%',
'declaration' => 'z-index: 10;'
if ( ! empty( $hover_style ) && 'none' !== $hover_style && false === strpos( $hover_style, 'inset' ) ) {
// Make section z-index higher if it has outer box shadow #4762
self::set_style( $function_name, array(
'selector' => '%%order_class%%:hover',
'declaration' => 'z-index: 10;'
parent::process_box_shadow( $function_name );
private function _keep_box_shadow_compatibility( $function_name ) {
* @var ET_Builder_Module_Field_BoxShadow $box_shadow
$box_shadow = ET_Builder_Module_Fields_Factory::get( 'BoxShadow' );
$utils = ET_Core_Data_Utils::instance();
$style = $box_shadow->get_value( $atts );
version_compare( $utils->array_get( $atts, '_builder_version', '3.0.93' ), '3.0.94', 'lt' )
! $box_shadow->is_inset( $box_shadow->get_value( $atts ) )
$class = '.' . self::get_module_order_class( $function_name );
'<style type="text/css">%1$s</style>',
sprintf( '%1$s { z-index: 11; %2$s }', esc_html( $class ), esc_html( $style ) )
class ET_Builder_Row extends ET_Builder_Structure_Element {
$this->name = esc_html__( 'Row', 'et_builder' );
$this->plural = esc_html__( 'Rows', 'et_builder' );
$this->slug = 'et_pb_row';
$this->vb_support = 'on';
$this->child_slug = 'et_pb_column';
$this->child_item_text = esc_html__( 'Column', 'et_builder' );
$this->advanced_fields = array(
'use_background_color' => true,
'use_background_image' => true,
'use_background_color_gradient' => true,
'use_background_video' => true,
'background_color' => array(
'allow_player_pause' => array(
'default_on_front' => 'off',
'default_on_front' => 'off',
'parallax_method' => array(
'default_on_front' => 'on',
'module_alignment' => '%%order_class%%.et_pb_row',
'range_settings' => array(
'module_alignment' => array(
'label' => esc_html__( 'Row Alignment', 'et_builder' ),
'mobile_options' => true,
'description' => esc_html__( 'Rows can be aligned to the left, right or center. By default, rows are centered within their parent section.', 'et_builder' ),
'toggle_slug' => 'width',
'toggle_title' => esc_html__( 'Alignment', 'et_builder' ),
'margin_padding' => array(
'main' => '%%order_class%%.et_pb_row',
'position_fields' => array(
$this->settings_modal_toggles = array(
'column_structure' => array(
'title' => esc_html__( 'Column Structure', 'et_builder' ),
'title' => et_builder_i18n( 'Sizing' ),
$this->help_videos = array(
'name' => esc_html__( 'An introduction to Rows', 'et_builder' ),
'column_structure' => array(
'label' => esc_html__( 'Column Structure', 'et_builder' ),
'description' => esc_html__( 'Here you can choose the Column Structure for this Row.', 'et_builder' ),
'type' => 'column-structure',
'4_4' => et_pb_get_column_svg( '4_4' ),
'1_2,1_2' => et_pb_get_column_svg( '1_2,1_2' ),
'1_3,1_3,1_3' => et_pb_get_column_svg( '1_3,1_3,1_3' ),
'1_4,1_4,1_4,1_4' => et_pb_get_column_svg( '1_4,1_4,1_4,1_4' ),
'1_4,1_4,1_4,1_4' => et_pb_get_column_svg( '1_4,1_4,1_4,1_4' ),
'1_5,1_5,1_5,1_5,1_5' => et_pb_get_column_svg( '1_5,1_5,1_5,1_5,1_5' ),
'1_6,1_6,1_6,1_6,1_6,1_6' => et_pb_get_column_svg( '1_6,1_6,1_6,1_6,1_6,1_6' ),
'2_5,3_5' => et_pb_get_column_svg( '2_5,3_5' ),
'3_5,2_5' => et_pb_get_column_svg( '3_5,2_5' ),
'1_3,2_3' => et_pb_get_column_svg( '1_3,2_3' ),
'2_3,1_3' => et_pb_get_column_svg( '2_3,1_3' ),
'1_4,3_4' => et_pb_get_column_svg( '1_4,3_4' ),
'3_4,1_4' => et_pb_get_column_svg( '3_4,1_4' ),
'1_4,1_2,1_4' => et_pb_get_column_svg( '1_4,1_2,1_4' ),
'1_5,3_5,1_5' => et_pb_get_column_svg( '1_5,3_5,1_5' ),
'1_4,1_4,1_2' => et_pb_get_column_svg( '1_4,1_4,1_2' ),
'1_2,1_4,1_4' => et_pb_get_column_svg( '1_2,1_4,1_4' ),
'1_5,1_5,3_5' => et_pb_get_column_svg( '1_5,1_5,3_5' ),
'3_5,1_5,1_5' => et_pb_get_column_svg( '3_5,1_5,1_5' ),
'1_6,1_6,1_6,1_2' => et_pb_get_column_svg( '1_6,1_6,1_6,1_2' ),
'1_2,1_6,1_6,1_6' => et_pb_get_column_svg( '1_2,1_6,1_6,1_6' ),
'toggle_slug' => 'column_structure',
'use_custom_gutter' => array(
'label' => esc_html__( 'Use Custom Gutter Width', 'et_builder' ),
'type' => 'yes_no_button',
'option_category' => 'layout',
'off' => et_builder_i18n( 'No' ),
'on' => et_builder_i18n( 'Yes' ),
'description' => esc_html__( 'Enable this option to define custom gutter width for this row.', 'et_builder' ),
'tab_slug' => 'advanced',
'toggle_slug' => 'width',
'label' => esc_html__( 'Gutter Width', 'et_builder' ),
'option_category' => 'layout',
'range_settings' => array(
'depends_show_if' => 'on',
'description' => esc_html__( 'Adjust the spacing between each column in this row.', 'et_builder' ),
'validate_unit' => false,
'tab_slug' => 'advanced',
'toggle_slug' => 'width',
'default_on_front' => (string) et_get_option( 'gutter_width', '3' ),
'padding_mobile' => array(
'label' => esc_html__( 'Keep Custom Padding on Mobile', 'et_builder' ),
'type' => 'skip', // Remaining attribute for backward compatibility
'tab_slug' => 'advanced',
'toggle_slug' => 'margin_padding',
'default_on_front' => '',
'label' => esc_html__( 'Equalize Column Heights', 'et_builder' ),
'description' => esc_html__( 'Equalizing column heights will force all columns to assume the height of the tallest column in the row. All columns will have the same height, keeping their appearance uniform.', 'et_builder' ),
'type' => 'yes_no_button',
'option_category' => 'layout',
'off' => et_builder_i18n( 'No' ),
'on' => et_builder_i18n( 'Yes' ),
'tab_slug' => 'advanced',
'toggle_slug' => 'width',
'column_padding_mobile' => array(
'label' => esc_html__( 'Keep Column Padding on Mobile', 'et_builder' ),
'tab_slug' => 'advanced',
'type' => 'skip', // Remaining attribute for backward compatibility
'default_on_front' => '',
'custom_padding_last_edited' => array(
'tab_slug' => 'advanced',
'__video_background' => array(
'computed_callback' => array( 'ET_Builder_Module_Helper_ResponsiveOptions', 'get_video_background' ),
'computed_depends_on' => array(
'background_video_width',
'background_video_height',
'computed_minimum' => array(
$column_fields = $this->get_column_fields( 6, array(
'background_color' => array(),
'padding_top_bottom_link' => array(),
'padding_left_right_link' => array(),
'default_on_front' => 'off',
'parallax_method' => array(
'default_on_front' => 'on',
'background_size' => array(),
'background_position' => array(),
'background_repeat' => array(),
'background_blend' => array(),
'use_background_color_gradient' => array(),
'background_color_gradient_start' => array(),
'background_color_gradient_end' => array(),
'background_color_gradient_type' => array(),
'background_color_gradient_direction' => array(),
'background_color_gradient_direction_radial' => array(),
'background_color_gradient_start_position' => array(),
'background_color_gradient_end_position' => array(),
'background_color_gradient_overlays_image' => array(),
'background_video_mp4' => array(
'computed_affects' => array(
'background_video_webm' => array(
'computed_affects' => array(
'background_video_width' => array(
'computed_affects' => array(
'background_video_height' => array(
'computed_affects' => array(
'allow_player_pause' => array(
'computed_affects' => array(
'background_video_pause_outside_viewport' => array(
'computed_affects' => array(
'__video_background' => array(
'computed_callback' => array(
'get_column_video_background'
'computed_depends_on' => array(