: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
class ET_Builder_Module_Gallery extends ET_Builder_Module {
$this->name = esc_html__( 'Gallery', 'et_builder' );
$this->plural = esc_html__( 'Galleries', 'et_builder' );
$this->slug = 'et_pb_gallery';
$this->vb_support = 'on';
$this->settings_modal_toggles = array(
'main_content' => esc_html__( 'Images', 'et_builder' ),
'elements' => et_builder_i18n( 'Elements' ),
'layout' => et_builder_i18n( 'Layout' ),
'overlay' => et_builder_i18n( 'Overlay' ),
'title' => et_builder_i18n( 'Image' ),
'title' => et_builder_i18n( 'Text' ),
'title' => esc_html__( 'Animation', 'et_builder' ),
$this->main_css_element = '%%order_class%%.et_pb_gallery';
$this->advanced_fields = array(
'label' => et_builder_i18n( 'Title' ),
'main' => "{$this->main_css_element} .et_pb_gallery_title",
'hover' => "{$this->main_css_element} .et_pb_gallery_title:hover",
'label' => esc_html__( 'Caption', 'et_builder' ),
'main' => "{$this->main_css_element} .mfp-title, {$this->main_css_element} .et_pb_gallery_caption",
'hover' => "{$this->main_css_element} .mfp-title:hover, {$this->main_css_element} .et_pb_gallery_caption:hover",
'range_settings' => array(
'depends_show_if' => 'off',
'label' => esc_html__( 'Pagination', 'et_builder' ),
'main' => "{$this->main_css_element} .et_pb_gallery_pagination a",
'hover' => "{$this->main_css_element} .et_pb_gallery_pagination a:hover",
'text_align' => "{$this->main_css_element} .et_pb_gallery_pagination ul",
'options' => et_builder_get_text_orientation_options( array( 'justified' ), array() ),
'border_radii' => "{$this->main_css_element} .et_pb_gallery_item",
'border_styles' => "{$this->main_css_element} .et_pb_gallery_item",
'border_radii' => "{$this->main_css_element} .et_pb_gallery_image",
'border_styles' => "{$this->main_css_element} .et_pb_gallery_image",
'label_prefix' => et_builder_i18n( 'Image' ),
'tab_slug' => 'advanced',
'toggle_slug' => 'image',
'depends_on' => array( 'fullwidth' ),
'depends_show_if' => 'off',
'label' => esc_html__( 'Image Box Shadow', 'et_builder' ),
'option_category' => 'layout',
'tab_slug' => 'advanced',
'toggle_slug' => 'image',
'main' => '%%order_class%% .et_pb_gallery_image',
'default_on_fronts' => array(
'margin_padding' => array(
'important' => array( 'custom_margin' ), // needed to overwrite last module margin-bottom styling
'module_alignment' => '%%order_class%%.et_pb_gallery.et_pb_module',
'use_background_layout' => true,
'main' => implode(', ', array(
"{$this->main_css_element} .et_pb_gallery_title",
"{$this->main_css_element} .mfp-title",
"{$this->main_css_element} .et_pb_gallery_caption",
"{$this->main_css_element} .et_pb_gallery_pagination a",
'text_shadow' => "{$this->main_css_element}.et_pb_gallery_grid",
'background_layout' => array(
'main' => '%%order_class%%',
'child_filters_target' => array(
'tab_slug' => 'advanced',
'toggle_slug' => 'image',
'main' => '%%order_class%% .et_pb_gallery_image img',
'scroll_effects' => array(
$this->custom_css_fields = array(
'label' => esc_html__( 'Gallery Item', 'et_builder' ),
'selector' => '.et_pb_gallery_item',
'label' => et_builder_i18n( 'Overlay' ),
'selector' => '.et_overlay',
'label' => esc_html__( 'Overlay Icon', 'et_builder' ),
'selector' => '.et_overlay:before',
'gallery_item_title' => array(
'label' => esc_html__( 'Gallery Item Title', 'et_builder' ),
'selector' => '.et_pb_gallery_title',
'gallery_item_caption' => array(
'label' => esc_html__( 'Gallery Item Caption', 'et_builder' ),
'selector' => '.et_pb_gallery_caption',
'gallery_pagination' => array(
'label' => esc_html__( 'Gallery Pagination', 'et_builder' ),
'selector' => '.et_pb_gallery_pagination',
'gallery_pagination_active' => array(
'label' => esc_html__( 'Pagination Active Page', 'et_builder' ),
'selector' => '.et_pb_gallery_pagination a.active',
$this->help_videos = array(
'name' => esc_html__( 'An introduction to the Gallery module', 'et_builder' ),
'label' => esc_html__( 'Images', 'et_builder' ),
'description' => esc_html__( 'Choose the images that you would like to appear in the image gallery.', 'et_builder' ),
'type' => 'upload-gallery',
'computed_affects' => array(
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'gallery_orderby' => array(
'label' => esc_html__( 'Image Order', 'et_builder' ),
'description' => esc_html__( 'Select an ordering method for the gallery. This controls which gallery items appear first in the list.', 'et_builder' ),
'type' => $this->is_loading_bb_data() ? 'hidden' : 'select',
'' => et_builder_i18n( 'Default' ),
'rand' => esc_html__( 'Random', 'et_builder' ),
'class' => array( 'et-pb-gallery-ids-field' ),
'computed_affects' => array(
'toggle_slug' => 'main_content',
'gallery_captions' => array(
'class' => array( 'et-pb-gallery-captions-field' ),
'computed_affects' => array(
'label' => et_builder_i18n( 'Layout' ),
'option_category' => 'layout',
'off' => esc_html__( 'Grid', 'et_builder' ),
'on' => esc_html__( 'Slider', 'et_builder' ),
'default_on_front' => 'off',
'description' => esc_html__( 'Toggle between the various blog layout types.', 'et_builder' ),
'caption_letter_spacing',
'show_title_and_caption',
'computed_affects' => array(
'tab_slug' => 'advanced',
'toggle_slug' => 'layout',
'label' => esc_html__( 'Image Count', 'et_builder' ),
'option_category' => 'configuration',
'description' => esc_html__( 'Define the number of images that should be displayed per page.', 'et_builder' ),
'depends_show_if' => 'off',
'toggle_slug' => 'main_content',
'label' => esc_html__( 'Thumbnail Orientation', 'et_builder' ),
'options_category' => 'configuration',
'landscape' => esc_html__( 'Landscape', 'et_builder' ),
'portrait' => esc_html__( 'Portrait', 'et_builder' ),
'default_on_front' => 'landscape',
'description' => sprintf(
'%1$s<br><small><em><strong>%2$s:</strong> %3$s <a href="//wordpress.org/plugins/force-regenerate-thumbnails" target="_blank">%4$s</a>.</em></small>',
esc_html__( 'Choose the orientation of the gallery thumbnails.', 'et_builder' ),
esc_html__( 'Note', 'et_builder' ),
esc_html__( 'If this option appears to have no effect, you might need to', 'et_builder' ),
esc_html__( 'regenerate your thumbnails', 'et_builder' )
'depends_show_if' => 'off',
'computed_affects' => array(
'tab_slug' => 'advanced',
'toggle_slug' => 'layout',
'show_title_and_caption' => array(
'label' => esc_html__( 'Show Title and Caption', 'et_builder' ),
'type' => 'yes_no_button',
'option_category' => 'configuration',
'on' => et_builder_i18n( 'Yes' ),
'off' => et_builder_i18n( 'No' ),
'default_on_front' => 'on',
'description' => esc_html__( 'Whether or not to show the title and caption for images (if available).', 'et_builder' ),
'depends_show_if' => 'off',
'toggle_slug' => 'elements',
'mobile_options' => true,
'show_pagination' => array(
'label' => esc_html__( 'Show Pagination', 'et_builder' ),
'type' => 'yes_no_button',
'option_category' => 'configuration',
'on' => et_builder_i18n( 'Yes' ),
'off' => et_builder_i18n( 'No' ),
'default_on_front' => 'on',
'description' => esc_html__( 'Enable or disable pagination for this feed.', 'et_builder' ),
'depends_show_if' => 'off',
'toggle_slug' => 'elements',
'computed_affects' => array(
'mobile_options' => true,
'zoom_icon_color' => array(
'label' => esc_html__( 'Overlay Icon Color', 'et_builder' ),
'description' => esc_html__( 'Here you can define a custom color for the zoom icon.', 'et_builder' ),
'depends_show_if' => 'off',
'tab_slug' => 'advanced',
'toggle_slug' => 'overlay',
'mobile_options' => true,
'hover_overlay_color' => array(
'label' => esc_html__( 'Overlay Background Color', 'et_builder' ),
'description' => esc_html__( 'Here you can define a custom color for the overlay', 'et_builder' ),
'depends_show_if' => 'off',
'tab_slug' => 'advanced',
'toggle_slug' => 'overlay',
'mobile_options' => true,
'label' => esc_html__( 'Overlay Icon', 'et_builder' ),
'description' => esc_html__( 'Here you can define a custom icon for the overlay', 'et_builder' ),
'option_category' => 'configuration',
'class' => array( 'et-pb-font-icon' ),
'tab_slug' => 'advanced',
'toggle_slug' => 'overlay',
'mobile_options' => true,
'computed_callback' => array( 'ET_Builder_Module_Gallery', 'get_gallery' ),
'computed_depends_on' => array(
* Get attachment data for gallery module
* @type array $gallery_ids Attachment Ids of images to be included in gallery.
* @type string $gallery_orderby `orderby` arg for query. Optional.
* @type string $fullwidth on|off to determine grid / slider layout
* @type string $orientation Orientation of thumbnails (landscape|portrait).
* @param array $conditional_tags
* @param array $current_page
* @return array Attachments data
static function get_gallery( $args = array(), $conditional_tags = array(), $current_page = array() ) {
'gallery_ids' => array(),
'gallery_captions' => array(),
'orientation' => 'landscape',
$args = wp_parse_args( $args, $defaults );
$attachments_args = array(
'include' => $args['gallery_ids'],
'post_status' => 'inherit',
'post_type' => 'attachment',
'post_mime_type' => 'image',
// Woo Gallery module shouldn't display placeholder image when no Gallery image is
// @see https://github.com/elegantthemes/submodule-builder/pull/6706#issuecomment-542275647
if ( isset( $args['attachment_id'] ) ) {
$attachments_args['attachment_id'] = $args['attachment_id'];
if ( 'rand' === $args['gallery_orderby'] ) {
$attachments_args['orderby'] = 'rand';
if ( 'on' === $args['fullwidth'] ) {
$height = ( 'landscape' === $args['orientation'] ) ? 284 : 516;
$width = (int) apply_filters( 'et_pb_gallery_image_width', $width );
$height = (int) apply_filters( 'et_pb_gallery_image_height', $height );
$_attachments = get_posts( $attachments_args );
foreach ( $_attachments as $key => $val ) {
$attachments[$key] = $_attachments[$key];
$attachments[$key]->image_alt_text = get_post_meta( $val->ID, '_wp_attachment_image_alt', true);
$attachments[$key]->image_src_full = wp_get_attachment_image_src( $val->ID, 'full' );
$attachments[$key]->image_src_thumb = wp_get_attachment_image_src( $val->ID, array( $width, $height ) );
* Wrapper for ET_Builder_Module_Gallery::get_gallery() which is intended to be extended by
* module which uses gallery module renderer so relevant argument for other module can be added
* @see ET_Builder_Module_Gallery::get_gallery()
* @type array $gallery_ids Attachment Ids of images to be included in gallery.
* @type string $gallery_orderby `orderby` arg for query. Optional.
* @type string $fullwidth on|off to determine grid / slider layout
* @type string $orientation Orientation of thumbnails (landscape|portrait).
public function get_attachments( $args = array() ) {
return self::get_gallery( $args );
public function get_pagination_alignment() {
$text_orientation = isset( $this->props['pagination_text_align'] ) ? $this->props['pagination_text_align'] : '';
return et_pb_get_alignment( $text_orientation );
function render( $attrs, $content = null, $render_slug ) {
$multi_view = et_pb_multi_view_options( $this );
$gallery_ids = $this->props['gallery_ids'];
$fullwidth = $this->props['fullwidth'];
$show_title_and_caption = $this->props['show_title_and_caption'];
$posts_number = $this->props['posts_number'];
$show_pagination = $this->props['show_pagination'];
$gallery_orderby = $this->props['gallery_orderby'];