name = esc_html__( 'Slide', 'et_builder' ); $this->slug = 'et_pb_slide'; $this->fb_support = true; $this->type = 'child'; $this->child_title_var = 'admin_title'; $this->child_title_fallback_var = 'heading'; $this->whitelisted_fields = array( 'heading', 'admin_title', 'button_text', 'button_link', 'image', 'alignment', 'video_url', 'image_alt', 'background_layout', 'content_new', 'arrows_custom_color', 'dot_nav_custom_color', 'use_bg_overlay', 'use_text_overlay', 'bg_overlay_color', 'text_overlay_color', 'text_border_radius', ); $this->fields_defaults = array( 'button_link' => array( '#' ), 'background_position' => array( 'center' ), 'background_size' => array( 'cover' ), 'background_color' => array( '#ffffff', 'only_default_setting' ), 'alignment' => array( 'center' ), 'background_layout' => array( 'dark' ), 'allow_player_pause' => array( 'off' ), ); $this->advanced_setting_title_text = esc_html__( 'New Slide', 'et_builder' ); $this->settings_text = esc_html__( 'Slide Settings', 'et_builder' ); $this->main_css_element = '%%order_class%%'; $this->options_toggles = array( 'general' => array( 'toggles' => array( 'main_content' => esc_html__( 'Text', 'et_builder' ), 'link' => esc_html__( 'Link', 'et_builder' ), 'image_video' => esc_html__( 'Image & Video', 'et_builder' ), 'player_pause' => esc_html__( 'Player Pause', 'et_builder' ), 'background' => esc_html__( 'Background', 'et_builder' ), 'admin_label' => esc_html__( 'Admin Label', 'et_builder' ), ), ), 'advanced' => array( 'toggles' => array( 'overlay' => esc_html__( 'Overlay', 'et_builder' ), 'navigation' => esc_html__( 'Navigation', 'et_builder' ), 'alignment' => esc_html__( 'Alignment', 'et_builder' ), 'image' => array( 'title' => esc_html__( 'Image', 'et_builder' ), ), 'text' => array( 'title' => esc_html__( 'Text', 'et_builder' ), 'priority' => 49, ), ), ), 'custom_css' => array( 'toggles' => array( 'attributes' => array( 'title' => esc_html__( 'Attributes', 'et_builder' ), 'priority' => 95, ), ), ), ); $this->advanced_options = array( 'fonts' => array( 'header' => array( 'label' => esc_html__( 'Title', 'et_builder' ), 'css' => array( 'main' => ".et_pb_slider {$this->main_css_element}.et_pb_slide .et_pb_slide_description .et_pb_slide_title", 'plugin_main' => ".et_pb_slider {$this->main_css_element}.et_pb_slide .et_pb_slide_description .et_pb_slide_title, .et_pb_slider {$this->main_css_element}.et_pb_slide .et_pb_slide_description .et_pb_slide_title a", 'important' => 'all', ), 'line_height' => array( 'range_settings' => array( 'min' => '1', 'max' => '100', 'step' => '0.1', ), ), 'header_level' => array( 'default' => 'h2', ), ), 'body' => array( 'label' => esc_html__( 'Body', 'et_builder' ), 'css' => array( 'main' => ".et_pb_slider.et_pb_module {$this->main_css_element}.et_pb_slide .et_pb_slide_description .et_pb_slide_content", 'line_height' => "{$this->main_css_element} p", 'important' => 'all', ), 'line_height' => array( 'range_settings' => array( 'min' => '1', 'max' => '100', 'step' => '0.1', ), ), ), ), 'button' => array( 'button' => array( 'label' => esc_html__( 'Button', 'et_builder' ), 'css' => array( 'main' => ".et_pb_slider {$this->main_css_element}.et_pb_slide .et_pb_button", 'plugin_main' => ".et_pb_slider {$this->main_css_element}.et_pb_slide .et_pb_more_button.et_pb_button", 'alignment' => ".et_pb_slider {$this->main_css_element} .et_pb_slide_description .et_pb_button_wrapper", ), 'use_alignment' => true, ), ), 'background' => array( 'css' => array( 'main' => ".et_pb_slider %%order_class%%", ), ), 'custom_margin_padding' => array( 'use_margin' => false, 'css' => array( 'padding' => '.et_pb_slider %%order_class%% .et_pb_slide_description, .et_pb_slider_fullwidth_off %%order_class%% .et_pb_slide_description', 'important' => array( 'custom_padding' ), // Important is needed to overwrite parent and column-specific padding specificity ), ), 'text' => array( 'css' => array( 'text_orientation' => '.et_pb_slides %%order_class%%.et_pb_slide .et_pb_slide_description', 'text_shadow' => '.et_pb_slides %%order_class%%.et_pb_slide .et_pb_slide_description', ), ), 'filters' => array( 'child_filters_target' => array( 'tab_slug' => 'advanced', 'toggle_slug' => 'image', ), ), 'image' => array( 'css' => array( 'main' => array( '%%order_class%% .et_pb_slide_image', '%%order_class%% .et_pb_section_video_bg', ), ), ), ); $this->custom_css_options = array( 'slide_title' => array( 'label' => esc_html__( 'Slide Title', 'et_builder' ), 'selector' => '.et_pb_slide_description h2', ), 'slide_container' => array( 'label' => esc_html__( 'Slide Description Container', 'et_builder' ), 'selector' => '.et_pb_container', ), 'slide_description' => array( 'label' => esc_html__( 'Slide Description', 'et_builder' ), 'selector' => '.et_pb_slide_description', ), 'slide_button' => array( 'label' => esc_html__( 'Slide Button', 'et_builder' ), 'selector' => '.et_pb_slide .et_pb_container a.et_pb_more_button.et_pb_button', 'no_space_before_selector' => true, ), 'slide_image' => array( 'label' => esc_html__( 'Slide Image', 'et_builder' ), 'selector' => '.et_pb_slide_image', ), ); } function get_fields() { $fields = array( 'heading' => array( 'label' => esc_html__( 'Heading', 'et_builder' ), 'type' => 'text', 'option_category' => 'basic_option', 'description' => esc_html__( 'Define the title text for your slide.', 'et_builder' ), 'toggle_slug' => 'main_content', ), 'button_text' => array( 'label' => esc_html__( 'Button Text', 'et_builder' ), 'type' => 'text', 'option_category' => 'basic_option', 'description' => esc_html__( 'Define the text for the slide button', 'et_builder' ), 'toggle_slug' => 'main_content', ), 'button_link' => array( 'label' => esc_html__( 'Button URL', 'et_builder' ), 'type' => 'text', 'option_category' => 'basic_option', 'description' => esc_html__( 'Input a destination URL for the slide button.', 'et_builder' ), 'toggle_slug' => 'link', ), 'image' => array( 'label' => esc_html__( 'Slide Image', 'et_builder' ), 'type' => 'upload', 'option_category' => 'configuration', 'upload_button_text' => esc_attr__( 'Upload an image', 'et_builder' ), 'choose_text' => esc_attr__( 'Choose a Slide Image', 'et_builder' ), 'update_text' => esc_attr__( 'Set As Slide Image', 'et_builder' ), 'affects' => array( 'image_alt', ), 'description' => esc_html__( 'If defined, this slide image will appear to the left of your slide text. Upload an image, or leave blank for a text-only slide.', 'et_builder' ), 'toggle_slug' => 'image_video', ), 'use_bg_overlay' => array( 'label' => esc_html__( 'Use Background Overlay', 'et_builder' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'off' => esc_html__( 'No', 'et_builder' ), 'on' => esc_html__( 'yes', 'et_builder' ), ), 'affects' => array( 'bg_overlay_color', ), 'tab_slug' => 'advanced', 'toggle_slug' => 'overlay', 'description' => esc_html__( 'When enabled, a custom overlay color will be added above your background image and behind your slider content.', 'et_builder' ), ), 'bg_overlay_color' => array( 'label' => esc_html__( 'Background Overlay Color', 'et_builder' ), 'type' => 'color-alpha', 'custom_color' => true, 'depends_show_if' => 'on', 'description' => esc_html__( 'Use the color picker to choose a color for the background overlay.', 'et_builder' ), 'tab_slug' => 'advanced', 'toggle_slug' => 'overlay', ), 'use_text_overlay' => array( 'label' => esc_html__( 'Use Text Overlay', 'et_builder' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'off' => esc_html__( 'No', 'et_builder' ), 'on' => esc_html__( 'yes', 'et_builder' ), ), 'affects' => array( 'text_overlay_color', 'text_border_radius', ), 'tab_slug' => 'advanced', 'toggle_slug' => 'overlay', 'description' => esc_html__( 'When enabled, a background color is added behind the slider text to make it more readable atop background images.', 'et_builder' ), ), 'text_overlay_color' => array( 'label' => esc_html__( 'Text Overlay Color', 'et_builder' ), 'type' => 'color-alpha', 'custom_color' => true, 'depends_show_if' => 'on', 'tab_slug' => 'advanced', 'toggle_slug' => 'overlay', 'description' => esc_html__( 'Use the color picker to choose a color for the text overlay.', 'et_builder' ), ), 'alignment' => array( 'label' => esc_html__( 'Slide Image Vertical Alignment', 'et_builder' ), 'type' => 'select', 'option_category' => 'layout', 'options' => array( 'center' => esc_html__( 'Center', 'et_builder' ), 'bottom' => esc_html__( 'Bottom', 'et_builder' ), ), 'tab_slug' => 'advanced', 'toggle_slug' => 'alignment', 'description' => esc_html__( 'This setting determines the vertical alignment of your slide image. Your image can either be vertically centered, or aligned to the bottom of your slide.', 'et_builder' ), ), 'video_url' => array( 'label' => esc_html__( 'Slide Video', 'et_builder' ), 'type' => 'text', 'option_category' => 'basic_option', 'description' => esc_html__( 'If defined, this video will appear to the left of your slide text. Enter youtube or vimeo page url, or leave blank for a text-only slide.', 'et_builder' ), 'toggle_slug' => 'image_video', 'computed_affects' => array( '__video_embed', ), ), 'image_alt' => array( 'label' => esc_html__( 'Image Alternative Text', 'et_builder' ), 'type' => 'text', 'option_category' => 'basic_option', 'depends_default' => true, 'depends_to' => array( 'image', ), 'description' => esc_html__( 'If you have a slide image defined, input your HTML ALT text for the image here.', 'et_builder' ), 'tab_slug' => 'custom_css', 'toggle_slug' => 'attributes', ), 'background_layout' => array( 'label' => esc_html__( 'Text Color', 'et_builder' ), 'type' => 'select', 'option_category' => 'color_option', 'options' => array( 'dark' => esc_html__( 'Light', 'et_builder' ), 'light' => esc_html__( 'Dark', 'et_builder' ), ), 'tab_slug' => 'advanced', 'toggle_slug' => 'text', 'description' => esc_html__( 'Here you can choose whether your text is light or dark. If you have a slide with a dark background, then choose light text. If you have a light background, then use dark text.' , 'et_builder' ), ), 'allow_player_pause' => array( 'label' => esc_html__( 'Pause Video When Another Video Plays', 'et_builder' ), 'type' => 'yes_no_button', 'option_category' => 'configuration', 'options' => array( 'off' => esc_html__( 'No', 'et_builder' ), 'on' => esc_html__( 'Yes', 'et_builder' ), ), 'toggle_slug' => 'player_pause', 'description' => esc_html__( 'Allow video to be paused by other players when they begin playing' ,'et_builder' ), ), 'content_new' => array( 'label' => esc_html__( 'Content', 'et_builder' ), 'type' => 'tiny_mce', 'option_category' => 'basic_option', 'description' => esc_html__( 'Input your main slide text content here.', 'et_builder' ), 'toggle_slug' => 'main_content', ), 'arrows_custom_color' => array( 'label' => esc_html__( 'Arrows Custom Color', 'et_builder' ), 'type' => 'color-alpha', 'custom_color' => true, 'tab_slug' => 'advanced', 'toggle_slug' => 'navigation', ), 'dot_nav_custom_color' => array( 'label' => esc_html__( 'Dot Nav Custom Color', 'et_builder' ), 'type' => 'color-alpha', 'custom_color' => true, 'tab_slug' => 'advanced', 'toggle_slug' => 'navigation', ), 'admin_title' => array( 'label' => esc_html__( 'Admin Label', 'et_builder' ), 'type' => 'text', 'description' => esc_html__( 'This will change the label of the slide in the builder for easy identification.', 'et_builder' ), 'toggle_slug' => 'admin_label', ), 'text_border_radius' => array( 'label' => esc_html__( 'Text Overlay Border Radius', 'et_builder' ), 'type' => 'range', 'option_category' => 'layout', 'default' => '3', 'range_settings' => array( 'min' => '0', 'max' => '100', 'step' => '1', ), 'depends_show_if' => 'on', 'tab_slug' => 'advanced', 'toggle_slug' => 'overlay', ), '__video_embed' => array( 'type' => 'computed', 'computed_callback' => array( 'ET_Builder_Module_Slider_Item', 'get_video_embed' ), 'computed_depends_on' => array( 'video_url', ), 'computed_minimum' => array( 'video_url', ), ), ); return $fields; } static function get_video_embed( $args = array(), $conditonal_args = array(), $current_page = array() ) { global $wp_embed; $video_url = esc_url( $args['video_url'] ); $autoembed = $wp_embed->autoembed( $video_url ); $is_local_video = has_shortcode( $autoembed, 'video' ); $video_embed = ''; if ( $is_local_video ) { $video_embed = wp_video_shortcode( array( 'src' => $video_url ) ); } else { $video_embed = wp_oembed_get( $video_url ); $video_embed = preg_replace( '//','', $video_embed ); } return $video_embed; } function maybe_inherit_values() { // Inheriting slider attribute global $et_pb_slider; // Attribute inheritance should be done on front-end / published page only. // Don't run attribute inheritance in VB and Backend to avoid attribute inheritance accidentally being saved on VB / BB if ( ! empty( $et_pb_slider ) && ! is_admin() && ! et_fb_is_enabled() ) { foreach ( $et_pb_slider as $slider_attr => $slider_attr_value ) { // Get default value $default = isset( $this->fields_unprocessed[ $slider_attr ][ 'default' ] ) ? $this->fields_unprocessed[ $slider_attr ][ 'default' ] : ''; if ( isset( $this->fields_defaults[ $slider_attr ] ) && isset( $this->fields_defaults[ $slider_attr ][0] ) ) { $default = $this->fields_defaults[ $slider_attr ][0]; } // Slide item isn't empty nor default if ( ! in_array( $this->shortcode_atts[ $slider_attr ], array( '', $default ) ) ) { continue; } // Slider value is equal to empty or slide item's default if ( in_array( $slider_attr_value, array( '', $default ) ) ) { continue; } // Overwrite slider item's empty / default value $this->shortcode_atts[ $slider_attr ] = $slider_attr_value; } } } function shortcode_callback( $atts, $content = null, $function_name ) { $alignment = $this->shortcode_atts['alignment']; $heading = $this->shortcode_atts['heading']; $button_text = $this->shortcode_atts['button_text']; $button_link = $this->shortcode_atts['button_link']; $image = $this->shortcode_atts['image']; $image_alt = $this->shortcode_atts['image_alt']; $background_layout = $this->shortcode_atts['background_layout']; $video_url = $this->shortcode_atts['video_url']; $dot_nav_custom_color = $this->shortcode_atts['dot_nav_custom_color']; $arrows_custom_color = $this->shortcode_atts['arrows_custom_color']; $custom_icon = $this->shortcode_atts['button_icon']; $button_custom = $this->shortcode_atts['custom_button']; $button_rel = $this->shortcode_atts['button_rel']; $use_bg_overlay = $this->shortcode_atts['use_bg_overlay']; $bg_overlay_color = $this->shortcode_atts['bg_overlay_color']; $use_text_overlay = $this->shortcode_atts['use_text_overlay']; $text_overlay_color = $this->shortcode_atts['text_overlay_color']; $text_border_radius = $this->shortcode_atts['text_border_radius']; $header_level = $this->shortcode_atts['header_level']; $video_background = $this->video_background(); $parallax_image_background = $this->get_parallax_image_background(); global $et_pb_slider_has_video, $et_pb_slider_parallax, $et_pb_slider_parallax_method, $et_pb_slider_show_mobile, $et_pb_slider_custom_icon, $et_pb_slider_item_num, $et_pb_slider_button_rel; $et_pb_slider_item_num++; $hide_on_mobile_class = self::HIDE_ON_MOBILE; $is_text_overlay_applied = 'on' === $use_text_overlay; $custom_slide_icon = 'on' === $button_custom && '' !== $custom_icon ? $custom_icon : $et_pb_slider_custom_icon; if ( '' !== $heading ) { if ( '#' !== $button_link ) { $heading = sprintf( '%2$s', esc_url( $button_link ), $heading ); } $heading = sprintf( '<%1$s class="et_pb_slide_title">%2$s', et_pb_process_header_level( $header_level, 'h2' ), $heading ); } // Overwrite button rel with pricin tables' button_rel if needed if ( in_array( $button_rel, array( '', 'off|off|off|off|off' ) ) && '' !== $et_pb_slider_button_rel ) { $button_rel = $et_pb_slider_button_rel; } $button = ''; if ( '' !== $button_text ) { $button = sprintf( '
%2$s
', esc_url( $button_link ), esc_html( $button_text ), ( 'on' !== $et_pb_slider_show_mobile['show_cta_on_mobile'] ? esc_attr( " {$hide_on_mobile_class}" ) : '' ), '' !== $custom_slide_icon ? sprintf( ' data-icon="%1$s"', esc_attr( et_pb_process_font_icon( $custom_slide_icon ) ) ) : '', '' !== $custom_slide_icon ? ' et_pb_custom_button_icon' : '', $this->get_rel_attributes( $button_rel ) ); } $style = $class = ''; if ( 'on' === $use_bg_overlay && '' !== $bg_overlay_color ) { ET_Builder_Element::set_style( $function_name, array( 'selector' => '%%order_class%%.et_pb_slide .et_pb_slide_overlay_container', 'declaration' => sprintf( 'background-color: %1$s;', esc_html( $bg_overlay_color ) ), ) ); } if ( $is_text_overlay_applied && '' !== $text_overlay_color ) { ET_Builder_Element::set_style( $function_name, array( 'selector' => '%%order_class%%.et_pb_slide .et_pb_text_overlay_wrapper', 'declaration' => sprintf( 'background-color: %1$s;', esc_html( $text_overlay_color ) ), ) ); } if ( '' !== $text_border_radius ) { $border_radius_value = et_builder_process_range_value( $text_border_radius ); ET_Builder_Element::set_style( $function_name, array( 'selector' => '%%order_class%%.et_pb_slider_with_text_overlay .et_pb_text_overlay_wrapper', 'declaration' => sprintf( 'border-radius: %1$s;', esc_html( $border_radius_value ) ), ) ); } $style = '' !== $style ? " style='{$style}'" : ''; $image = '' !== $image ? sprintf( '
%2$s
', esc_url( $image ), esc_attr( $image_alt ) ) : ''; if ( '' !== $video_url ) { $video_embed = self::get_video_embed(array( 'video_url' => $video_url, )); $image = sprintf( '
%1$s
', $video_embed ); } if ( '' !== $image ) $class = ' et_pb_slide_with_image'; if ( '' !== $video_url ) $class .= ' et_pb_slide_with_video'; $class .= " et_pb_bg_layout_{$background_layout}"; $class .= 'on' === $use_bg_overlay ? ' et_pb_slider_with_overlay' : ''; $class .= 'on' === $use_text_overlay ? ' et_pb_slider_with_text_overlay' : ''; if ( 'bottom' !== $alignment ) { $class .= " et_pb_media_alignment_{$alignment}"; } $data_dot_nav_custom_color = '' !== $dot_nav_custom_color ? sprintf( ' data-dots_color="%1$s"', esc_attr( $dot_nav_custom_color ) ) : ''; $data_arrows_custom_color = '' !== $arrows_custom_color ? sprintf( ' data-arrows_color="%1$s"', esc_attr( $arrows_custom_color ) ) : ''; $class = ET_Builder_Element::add_module_order_class( $class, $function_name ); // Images: Add CSS Filters and Mix Blend Mode rules (if set) if ( array_key_exists( 'image', $this->advanced_options ) && array_key_exists( 'css', $this->advanced_options['image'] ) ) { $class .= $this->generate_css_filters( $function_name, 'child_', self::$data_utils->array_get( $this->advanced_options['image']['css'], 'main', '%%order_class%%' ) ); } if ( 1 === $et_pb_slider_item_num ) { $class .= " et-pb-active-slide"; } $slide_content = sprintf( '%1$s
%2$s
', $heading, $this->shortcode_content, ( 'on' !== $et_pb_slider_show_mobile['show_content_on_mobile'] ? esc_attr( " {$hide_on_mobile_class}" ) : '' ) ); //apply text overlay wrapper if ( $is_text_overlay_applied ) { $slide_content = sprintf( '
%1$s
', $slide_content ); } $output = sprintf( '
%7$s %10$s
%4$s
%1$s %2$s
%6$s
', $slide_content, $button, $style, $image, esc_attr( $class ), $video_background, $parallax_image_background, $data_dot_nav_custom_color, $data_arrows_custom_color, 'on' === $use_bg_overlay ? '
' : '', '' !== $parallax_image_background ? ' et_pb_section_parallax' : '', '' !== $video_background ? ' et_pb_section_video et_pb_preload' : '' ); return $output; } public function _add_additional_shadow_fields() { } public function process_box_shadow( $function_name ) { $boxShadow = ET_Builder_Module_Fields_Factory::get( 'BoxShadow' ); $selector = sprintf( '.%1$s .et_pb_button', self::get_module_order_class( $function_name ) ); if ( isset( $this->shortcode_atts['custom_button'] ) && 'on' === $this->shortcode_atts['custom_button'] ) { self::set_style( $function_name, array( 'selector' => $selector, 'declaration' => $boxShadow->get_value( $this->shortcode_atts, array( 'suffix' => '_button', 'important' => true, ) ) ) ); } } protected function _add_additional_border_fields() { return false; } function process_advanced_border_options( $function_name ) { return false; } } new ET_Builder_Module_Slider_Item;