: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
case 'conditional_logic':
$field_custom_value = esc_html( $field_var_name );
$field_custom_value .= '.replace( /\|\|/g, "\n" ).replace( /%22/g, """ ).replace( /%92/g, "\\\" )';
$field_custom_value .= '.replace( /%91/g, "[" ).replace( /%93/g, "]" )';
$field_selects = sprintf(
'<select class="et_conditional_logic_field"></select>
<select class="et_conditional_logic_condition">
<option value="is">%1$s</option>
<option value="is not">%2$s</option>
<option value="is greater">%3$s</option>
<option value="is less">%4$s</option>
<option value="contains">%5$s</option>
<option value="does not contain">%6$s</option>
<option value="is empty">%7$s</option>
<option value="is not empty">%8$s</option>
esc_html__( 'equals', 'et_builder' ),
esc_html__( 'does not equal', 'et_builder' ),
esc_html__( 'is greater than', 'et_builder' ),
esc_html__( 'is less than', 'et_builder' ),
esc_html__( 'contains', 'et_builder' ),
esc_html__( 'does not contain', 'et_builder' ),
esc_html__( 'is empty', 'et_builder' ),
esc_html__( 'is not empty', 'et_builder' )
'<div class="et_options_list et_conditional_logic" data-checked="%6$s" data-unchecked="%7$s">
<div class="et_options_list_row">
<a href="#" class="et_options_list_remove"></a>
<textarea class="et-pb-main-setting large-text code%1$s" rows="4" cols="50" id="%2$s"><%%= typeof( %3$s ) !== \'undefined\' ? %4$s : \'\' %%></textarea>
<a href="#" class="et-pb-add-sortable-option"><span>%8$s</span></a>
esc_attr( $field['class'] ),
esc_attr( $field['id'] ),
esc_html( $field_var_name ),
et_core_esc_previously( $field_custom_value ),
esc_html__( 'checked', 'et_builder' ),
esc_html__( 'not checked', 'et_builder' ),
esc_html__( 'Add New Rule', 'et_builder' )
case 'select_with_option_groups':
$is_align = in_array( $field['type'], array( 'text_align', 'align' ) );
if ( 'font' === $field['type'] ) {
$field['id'] .= '_select';
$field_name .= '_select';
$field['class'] .= ' et-pb-helper-field';
$field['options'] = array();
$field['class'] = 'et-pb-text-align-select';
$button_options = array();
if ( 'yes_no_button' === $field['type'] ) {
$button_options = isset( $field['button_options'] ) ? $field['button_options'] : array();
$attributes .= sprintf( ' data-default="%1$s"', esc_attr( $default ) );
//If default is an array, then $default_value value is an js expression, so it doesn't need to be encoded
//In other case it needs to be encoded
$select_default = $default_is_arr ? $default_value : wp_json_encode( $default_value );
if ( 'font' === $field['type'] ) {
$group_label = isset( $field['group_label'] ) ? $field['group_label'] : '';
$select = $this->render_font_select( $field_name, $field['id'], $group_label );
} else if ( 'multiple_buttons' === $field['type'] ) {
if ( isset( $field['toggleable'] ) && $field['toggleable'] ) {
$attributes .= ' data-toggleable="yes"';
if ( isset( $field['multi_selection'] ) && $field['multi_selection'] ) {
$attributes .= ' data-multi="yes"';
$select = $this->render_multiple_buttons( $field_name, $field['options'], $field['id'], $field['class'], $attributes, $value, $default_value );
$select = $this->render_select( $field_name, $field['options'], $field['id'], $field['class'], $attributes, $field['type'], $button_options, $select_default, $only_options );
if ( 'font' === $field['type'] ) {
$font_style_button_html = sprintf(
'<%%= window.et_builder.options_template_output("font_buttons",%1$s) %%>',
wp_json_encode( array( 'italic', 'uppercase', 'capitalize', 'underline', 'line_through' ) )
'<div class="et_builder_font_styles mce-toolbar">
$field_el .= '<%= window.et_builder.options_template_output("font_line_styles") %>';
$field_el .= $hidden_field;
$text_align_options = ! empty( $field[ 'options' ] ) ? array_keys( $field[ 'options' ] ) : array( 'left', 'center', 'right', 'justified' );
$is_module_alignment = 'align' === $field['type'] || ( in_array( $field['name'], array( 'et_pb_module_alignment', 'et_pb_button_alignment' ) ) || ( isset( $field['options_icon'] ) && 'module_align' === $field['options_icon'] ) );
$text_align_style_button_html = sprintf(
'<%%= window.et_builder.options_text_align_buttons_output(%1$s, "%2$s") %%>',
wp_json_encode( $text_align_options ),
$is_module_alignment ? 'module' : 'text'
'<div class="et_builder_text_aligns mce-toolbar">
$text_align_style_button_html
$field_el .= $hidden_field;
if ( 'select_with_option_groups' === $field['type'] ) {
$field_el .= $hidden_field;
$options = $field['options'];
$animation_buttons_array = array();
foreach ( $options as $option_name => $option_title ) {
$animation_buttons_array[ $option_name ] = sanitize_text_field( $option_title );
$animation_buttons = sprintf( '<%%= window.et_builder.options_template_output("animation_buttons",%1$s) %%>', wp_json_encode( $animation_buttons_array ) );
'<div class="et_select_animation et-pb-main-setting" data-default="none">
case 'select_box_shadow':
$presets = $field['presets'];
foreach ( $presets as $preset ) {
$fields = isset( $preset['fields'] )
? htmlspecialchars( wp_json_encode( $preset['fields'] ), ENT_QUOTES, 'UTF-8' )
$presets_buttons .= sprintf(
'<div class="et-preset" data-value="%1$s" data-fields="%2$s">',
esc_attr( $preset['value'] ),
if ( isset( $preset['title'] ) && ! empty( $preset['title'] ) ) {
$presets_buttons .= sprintf(
'<span class="et-preset-title" >%1$s</span>',
if ( isset( $preset['icon'] ) && ! empty( $preset['icon'] ) ) {
$presets_buttons .= sprintf(
'<span class="et-preset-icon">%1$s</span>',
$this->get_icon( $preset['icon'] )
if ( isset( $preset['content'] ) && ! empty( $preset['content'] ) ) {
if ( is_array( $preset['content'] ) ) {
$content = isset( $preset['content']['content'] ) ? $preset['content']['content'] : '';
$class = isset( $preset['content']['class'] ) ? ' ' . $preset['content']['class'] : '';
$content = $preset['content'];
$presets_buttons .= sprintf(
'<span class="et-preset-content%2$s">%1$s</span>',
$presets_buttons .= '</div>';
'<div class="et-presets et-preset-container et-pb-main-setting %3$s" data-default="none">
esc_attr( $field['type'] )
$field['default'] = ! empty( $field['default'] ) ? $field['default'] : '';
if ( $is_custom_color && ( ! isset( $field['default'] ) || '' === $field['default'] ) ) {
$default = ! empty( $field['default'] ) ? sprintf( ' data-default-color="%1$s" data-default="%1$s"', esc_attr( $field['default'] ) ) : '';
$color_id = sprintf( ' id="%1$s"', esc_attr( $field['id'] ) );
$color_value_html = '<%%- typeof( %1$s ) !== \'undefined\' && %1$s !== \'\' ? %1$s : \'%2$s\' %%>';
$main_color_value = sprintf( $color_value_html, esc_attr( $field_var_name ), $field['default'] );
$hidden_color_value = sprintf( $color_value_html, esc_attr( $field_var_name ), '' );
$has_preview = isset( $field['has_preview'] ) && $field['has_preview'];
'<input%1$s class="et-pb-color-picker-hex%5$s%8$s%10$s" type="text"%6$s%7$s placeholder="%9$s" data-selected-value="%2$s" value="%2$s"%3$s />
( ! $is_custom_color || $has_preview ? $color_id : '' ),
( ! empty( $field['additional_code'] ) ? $field['additional_code'] : '' ),
( 'color-alpha' === $field['type'] ? ' et-pb-color-picker-hex-alpha' : '' ),
( 'color-alpha' === $field['type'] ? ' data-alpha="true"' : '' ),
( 'color' === $field['type'] ? ' maxlength="7"' : '' ),
( ! $is_custom_color ? ' et-pb-main-setting' : '' ),
esc_attr__( 'Hex Value', 'et_builder' ),
$has_preview ? esc_attr( ' et-pb-color-picker-hex-has-preview' ) : ''
if ( $is_custom_color && ! $has_preview ) {
'<span class="et-pb-custom-color-button et-pb-choose-custom-color-button"><span>%1$s</span></span>
<div class="et-pb-custom-color-container et_pb_hidden">
<input%3$s class="et-pb-main-setting et-pb-custom-color-picker" type="hidden" value="%4$s" %6$s />
esc_html__( 'Choose Custom Color', 'et_builder' ),
$field_data_type = ! empty( $field['data_type'] ) ? $field['data_type'] : 'image';
$field['upload_button_text'] = ! empty( $field['upload_button_text'] ) ? $field['upload_button_text'] : esc_attr__( 'Upload', 'et_builder' );
$field['choose_text'] = ! empty( $field['choose_text'] ) ? $field['choose_text'] : esc_attr__( 'Choose image', 'et_builder' );
$field['update_text'] = ! empty( $field['update_text'] ) ? $field['update_text'] : esc_attr__( 'Set image', 'et_builder' );
$field['class'] = ! empty( $field['class'] ) ? ' ' . $field['class'] : '';
$field_additional_button = ! empty( $field['additional_button'] ) ? "\n\t\t\t\t\t" . $field['additional_button'] : '';
'<input id="%1$s" type="text" class="et-pb-main-setting regular-text et-pb-upload-field%8$s" value="<%%- typeof( %2$s ) !== \'undefined\' ? %2$s : \'\' %%>" %9$s />
<input type="button" class="button button-upload et-pb-upload-button" value="%3$s" data-choose="%4$s" data-update="%5$s" data-type="%6$s" />%7$s',
esc_attr( $field['id'] ),
esc_attr( $field_var_name ),
esc_attr( $field['upload_button_text'] ),
esc_attr( $field['choose_text'] ),
esc_attr( $field['update_text'] ),
esc_attr( $field_data_type ),
$field_additional_button,
esc_attr( $field['class'] ),
'<input type="checkbox" name="%1$s" id="%2$s" class="et-pb-main-setting" value="on" <%%- typeof( %3$s ) !== \'undefined\' && %3$s === \'on\' ? checked="checked" : "" %%>>',
esc_attr( $field['name'] ),
esc_attr( $field['id'] ),
esc_attr( str_replace( '-', '_', $field['name'] ) )
case 'multiple_checkboxes' :
$checkboxes_set = '<div class="et_pb_checkboxes_wrapper">';
if ( ! empty( $field['options'] ) ) {
foreach( $field['options'] as $option_value => $option_label ) {
$checkboxes_set .= sprintf(
'%3$s<label><input type="checkbox" class="et_pb_checkbox_%1$s" value="%1$s"> %2$s</label><br/>',
esc_attr( $option_value ),
esc_html( $option_label ),
// additional option for disable_on option for backward compatibility
if ( isset( $field['additional_att'] ) && 'disable_on' === $field['additional_att'] ) {
$et_pb_disabled_value = sprintf(
esc_attr( 'et_pb_disabled' ),
esc_attr( 'et_pb_disabled' ),
$checkboxes_set .= sprintf(
'<input type="hidden" id="et_pb_disabled" class="et_pb_disabled_option"%1$s>',
$field_el .= $checkboxes_set . $hidden_field . '</div>';
$field_el .= $hidden_field;
$custom_margin_class = "";
// Fill the array of values for tablet and phone
if ( $need_mobile_options ) {
$mobile_values_array = array();
$has_saved_value = array();
$mobile_desktop_class = ' et_pb_setting_mobile et_pb_setting_mobile_desktop et_pb_setting_mobile_active';
$mobile_desktop_data = ' data-device="desktop"';
foreach( array( 'tablet', 'phone' ) as $device ) {
$mobile_values_array[] = sprintf(
esc_attr( $field_var_name . '_' . $device ),
esc_attr( $field_var_name . '_' . $device ),
$has_saved_value[] = sprintf( ' data-has_saved_value="<%%- typeof( %1$s ) !== \'undefined\' ? \'yes\' : \'no\' %%>" ',
esc_attr( $field_var_name . '_' . $device )
$value_last_edited = sprintf(
esc_attr( $field_var_name . '_last_edited' ),
esc_attr( $field_var_name . '_last_edited' ),
// additional field to save the last edited field which will be opened automatically
$additional_mobile_fields = sprintf( '<input id="%1$s" type="hidden" class="et_pb_mobile_last_edited_field"%2$s>',
esc_attr( $field_name . '_last_edited' ),
// Add auto_important class to field which automatically append !important tag
if ( isset( $this->advanced_fields['margin_padding']['css']['important'] ) ) {
$custom_margin_class .= " auto_important";
$has_responsive_affects = isset( $field['responsive_affects'] );
$single_fields_settings = array(
'need_mobile' => $need_mobile_options ? 'need_mobile' : '',
'class' => esc_attr( $custom_margin_class ),
'<div class="et_margin_padding">
<input type="hidden" name="%1$s" data-default="%5$s" id="%2$s" class="et_custom_margin_main et-pb-main-setting%11$s%14$s"%12$s %3$s %4$s/>
esc_attr( $field['name'] ),
esc_attr( $field['id'] ),
esc_attr( $default ), // #5
! isset( $field['sides'] ) || ( ! empty( $field['sides'] ) && in_array( 'top', $field['sides'] ) ) ?
sprintf( '<%%= window.et_builder.options_template_output("padding",%1$s) %%>',
wp_json_encode( array_merge( $single_fields_settings, array(
'label' => et_builder_i18n( 'Top' ),
! isset( $field['sides'] ) || ( ! empty( $field['sides'] ) && in_array( 'right', $field['sides'] ) ) ?
sprintf( '<%%= window.et_builder.options_template_output("padding",%1$s) %%>',
wp_json_encode( array_merge( $single_fields_settings, array(
'label' => et_builder_i18n( 'Right' ),
! isset( $field['sides'] ) || ( ! empty( $field['sides'] ) && in_array( 'bottom', $field['sides'] ) ) ?
sprintf( '<%%= window.et_builder.options_template_output("padding",%1$s) %%>',
wp_json_encode( array_merge( $single_fields_settings, array(
'label' => et_builder_i18n( 'Bottom' ),
! isset( $field['sides'] ) || ( ! empty( $field['sides'] ) && in_array( 'left', $field['sides'] ) ) ?
sprintf( '<%%= window.et_builder.options_template_output("padding",%1$s) %%>',
wp_json_encode( array_merge( $single_fields_settings, array(
'label' => et_builder_i18n( 'Left' ),
'<input type="hidden" name="%1$s_tablet" data-default="%4$s" id="%2$s_tablet" class="et-pb-main-setting et_custom_margin_main et_pb_setting_mobile et_pb_setting_mobile_tablet%9$s" data-device="tablet" %5$s %3$s %7$s/>
<input type="hidden" name="%1$s_phone" data-default="%4$s" id="%2$s_phone" class="et-pb-main-setting et_custom_margin_main et_pb_setting_mobile et_pb_setting_mobile_phone%9$s" data-device="phone" %6$s %3$s %8$s/>',
esc_attr( $field['name'] ),
esc_attr( $field['id'] ),
$has_responsive_affects ? ' et-pb-responsive-affects' : ''
$need_mobile_options ? esc_attr( $mobile_desktop_class ) : '',
$need_mobile_options ? $mobile_desktop_data : '',
$need_mobile_options ? $additional_mobile_fields : '',
$has_responsive_affects ? ' et-pb-responsive-affects' : '' // #14
$validate_number = isset( $field['number_validation'] ) && $field['number_validation'] ? true : false;
if ( 'date_picker' === $field['type'] ) {
$field['class'] .= ' et-pb-date-time-picker';
$field['class'] .= 'range' === $field['type'] ? ' et-pb-range-input' : ' et-pb-main-setting';
$type = in_array( $field['type'], array( 'text', 'number' ) ) ? $field['type'] : 'text';
$unit = isset($field['default_unit']) ? 'data-unit="' . esc_attr( $field['default_unit'] ) . '"' : '';
'<input id="%1$s" type="%11$s" class="%2$s%5$s%9$s"%6$s%3$s%8$s%10$s %4$s %12$s/>%7$s',
esc_attr( $field['id'] ),
esc_attr( $field['class'] ),
( $validate_number ? ' et-validate-number' : '' ),
( $validate_number ? ' maxlength="3"' : '' ),
( ! empty( $field['additional_button'] ) ? $field['additional_button'] : '' ),
? sprintf( ' data-default="%1$s"', esc_attr( $default ) )
$need_mobile_options ? ' et_pb_setting_mobile et_pb_setting_mobile_active et_pb_setting_mobile_desktop' : '',
$need_mobile_options ? ' data-device="desktop"' : '',
// generate additional fields for mobile settings switcher if needed
if ( $need_mobile_options ) {
foreach( array( 'tablet', 'phone' ) as $device_type ) {
esc_attr( $field_var_name . '_' . $device_type ),
esc_attr( $field_var_name . '_' . $device_type ),
// additional data attribute to handle default values for the responsive options
$has_saved_value = sprintf( ' data-has_saved_value="<%%- typeof( %1$s ) !== \'undefined\' ? \'yes\' : \'no\' %%>" ',
esc_attr( $field_var_name . '_' . $device_type )