trAvis - MANAGER
Edit File: tp_woo_single_image.php
<?php /* Widget Name: Woo Single Image Description: Woo Single Image Author: Posimyth Author URI: http://posimyth.com */ namespace TheplusAddons\Widgets; use Elementor\Widget_Base; use Elementor\Controls_Manager; use Elementor\Utils; use Elementor\Core\Schemes\Color; use Elementor\Group_Control_Typography; use Elementor\Core\Schemes\Typography; use Elementor\Group_Control_Border; use Elementor\Group_Control_Box_Shadow; use Elementor\Group_Control_Background; use Elementor\Group_Control_Css_Filter; use Elementor\Group_Control_Image_Size; use TheplusAddons\Theplus_Element_Load; if (!defined('ABSPATH')) exit; // Exit if accessed directly class ThePlus_Woo_Single_Image extends Widget_Base { public function get_name() { return 'tp-woo-single-image'; } public function get_title() { return esc_html__('Woo Product Images', 'theplus'); } public function get_icon() { return 'fa fa-file-image-o theplus_backend_icon'; } public function get_categories() { return array('plus-woo-builder'); } public function get_keywords() { return ['Single Basic, woocomerce', 'theplus','single product','product gallery','feature image','thumbnail','post','product']; } protected function _register_controls() { /*content start*/ $this->start_controls_section( 'section_woo_single_image', [ 'label' => esc_html__( 'Layout', 'theplus' ), ] ); $this->add_control( 'select', [ 'label' => esc_html__( 'Layout', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'product_gallery', 'options' => [ 'product_gallery' => esc_html__( 'Image Gallery', 'theplus' ), 'single_product' => esc_html__( 'Single Image', 'theplus' ), ], ] ); $this->add_group_control( Group_Control_Image_Size::get_type(), [ 'name' => 'single_product_thumbnail', 'default' => 'full', 'condition' => [ 'select' => 'single_product', ], ] ); $this->add_control( 'hover_image_on_off', [ 'label' => esc_html__( 'On Hover Image Change', 'theplus' ), 'type' => \Elementor\Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'return_value' => 'yes', 'default' => 'no', 'separator' => 'before', 'condition' => [ 'select' => 'single_product', ], ] ); $this->add_control( 'on_image_link', [ 'label' => esc_html__( 'Link', 'theplus' ), 'type' => \Elementor\Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'separator' => 'before', 'condition' => [ 'select' => 'single_product', ], ] ); $this->add_control( 'select_pg_style', [ 'label' => esc_html__( 'Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'style_1', 'options' => [ 'style_1' => esc_html__( 'Style 1', 'theplus' ), 'style_3' => esc_html__( 'Style 2', 'theplus' ), ], 'condition' => [ 'select' => 'product_gallery', ], ] ); $this->add_control( 'select_pg_thumb', [ 'label' => esc_html__( 'Thumbnail Position', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'tp_pg_thumb_pos_d', 'options' => [ 'tp_pg_thumb_pos_d' => esc_html__( 'Default', 'theplus' ), 'tp_pg_thumb_pos_l' => esc_html__( 'Left', 'theplus' ), 'tp_pg_thumb_pos_r' => esc_html__( 'Right', 'theplus' ), ], 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_1', ], ] ); $this->add_control( 'layout', [ 'label' => esc_html__( 'Layout', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'grid', 'options' => theplus_get_list_layout_style(), 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_3', ], ] ); $this->add_control( 'src_image_type', [ 'label' => esc_html__( 'Image Type', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'full', 'options' => [ "full" => esc_html__("Full Image", 'theplus'), "grid" => esc_html__("Grid Image", 'theplus'), ], 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_3', 'layout' => ['carousel'] ], ] ); $this->end_controls_section(); /*content end*/ /*columns*/ $this->start_controls_section( 'columns_section', [ 'label' => esc_html__( 'Columns Manage', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_3', 'layout!' => ['carousel'] ], ] ); $this->add_control( 'desktop_column', [ 'label' => esc_html__( 'Desktop Column', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '3', 'options' => theplus_get_columns_list(), 'condition' => [ 'layout!' => ['metro','carousel'] ], ] ); $this->add_control( 'tablet_column', [ 'label' => esc_html__( 'Tablet Column', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '4', 'options' => theplus_get_columns_list(), 'condition' => [ 'layout!' => ['metro','carousel'] ], ] ); $this->add_control( 'mobile_column', [ 'label' => esc_html__( 'Mobile Column', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '6', 'options' => theplus_get_columns_list(), 'condition' => [ 'layout!' => ['metro','carousel'] ], ] ); $this->add_control( 'metro_column', [ 'label' => esc_html__( 'Metro Column', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '3', 'options' => [ "3" => esc_html__("Column 3", 'theplus'), "4" => esc_html__("Column 4", 'theplus'), "5" => esc_html__("Column 5", 'theplus'), "6" => esc_html__("Column 6", 'theplus'), ], 'condition' => [ 'layout' => ['metro'] ], ] ); $this->add_control( 'metro_style_3', [ 'label' => esc_html__( 'Metro Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'style-1', 'options' => theplus_get_style_list(4), 'condition' => [ 'metro_column' => '3', 'layout' => ['metro'] ], ] ); $this->add_control( 'metro_style_4', [ 'label' => esc_html__( 'Metro Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'style-1', 'options' => theplus_get_style_list(3), 'condition' => [ 'metro_column' => '4', 'layout' => ['metro'] ], ] ); $this->add_control( 'metro_style_5', [ 'label' => esc_html__( 'Metro Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'style-1', 'options' => theplus_get_style_list(1), 'condition' => [ 'metro_column' => '5', 'layout' => ['metro'] ], ] ); $this->add_control( 'metro_style_6', [ 'label' => esc_html__( 'Metro Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'style-1', 'options' => theplus_get_style_list(1), 'condition' => [ 'metro_column' => '6', 'layout' => ['metro'] ], ] ); $this->add_control( 'responsive_tablet_metro', [ 'label' => esc_html__( 'Tablet Responsive', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Yes', 'theplus' ), 'label_off' => esc_html__( 'no', 'theplus' ), 'default' => 'yes', 'separator' => 'before', 'condition' => [ 'layout' => ['metro'] ], ] ); $this->add_control( 'tablet_metro_column', [ 'label' => esc_html__( 'Metro Column', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '3', 'options' => [ "3" => esc_html__("Column 3", 'theplus'), ], 'condition' => [ 'responsive_tablet_metro' => 'yes', 'layout' => ['metro'], ], ] ); $this->add_control( 'tablet_metro_style_3', [ 'label' => esc_html__( 'Tablet Metro Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'style-1', 'options' => theplus_get_style_list(4), 'condition' => [ 'responsive_tablet_metro' => 'yes', 'tablet_metro_column' => '3', 'layout' => ['metro'] ], ] ); $this->add_responsive_control( 'columns_gap', [ 'label' => esc_html__( 'Columns Gap/Space Between', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%', 'em' ], 'default' =>[ 'top' => "15", 'right' => "15", 'bottom' => "15", 'left' => "15", ], 'separator' => 'before', 'condition' => [ 'layout!' => ['carousel'] ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->end_controls_section(); /*columns*/ /*extra option*/ $this->start_controls_section( 'extra_opt_section', [ 'label' => esc_html__( 'Extra Options', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_3', ], ] ); $this->add_control( 'tp_enable_video', [ 'label' => esc_html__( 'Video', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'separator' => 'before', 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_3', ], ] ); $this->add_control( 'tp_enable_video_pos', [ 'label' => esc_html__( 'Video Location', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'first', 'options' => [ "first" => esc_html__("First", 'theplus'), "last" => esc_html__("Last", 'theplus'), ], 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_3', 'tp_enable_video' => 'yes', ], ] ); $this->end_controls_section(); /*columns*/ /*image box option*/ $this->start_controls_section( 'section_box_image_styling', [ 'label' => esc_html__('Image Box', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_3', ], ] ); $this->start_controls_tabs( 'tabs_mm_image' ); $this->start_controls_tab( 'tab_image_box_normal', [ 'label' => esc_html__( 'Normal', 'theplus' ), ] ); $this->add_group_control( Group_Control_Css_Filter::get_type(), [ 'name' => 'image_box_filters', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item img, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery.list-isotope-metro .post-inner-loop .grid-item .woo-gallery-bg-image-metro', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'image_box_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item img, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery.list-isotope-metro .post-inner-loop .grid-item .woo-gallery-bg-image-metro', ] ); $this->add_responsive_control( 'image_box_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item img, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery.list-isotope-metro .post-inner-loop .grid-item .woo-gallery-bg-image-metro' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'image_box_shadow', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item img, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery.list-isotope-metro .post-inner-loop .grid-item .woo-gallery-bg-image-metro', ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_image_box_hover', [ 'label' => esc_html__( 'Hover', 'theplus' ), ] ); $this->add_group_control( Group_Control_Css_Filter::get_type(), [ 'name' => 'image_box_filters_h', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item img:hover, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery.list-isotope-metro .post-inner-loop .grid-item .woo-gallery-bg-image-metro:hover', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'image_box_border_h', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item img:hover, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery.list-isotope-metro .post-inner-loop .grid-item .woo-gallery-bg-image-metro:hover', ] ); $this->add_responsive_control( 'image_box_radius_h', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item img:hover, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery.list-isotope-metro .post-inner-loop .grid-item .woo-gallery-bg-image-metro:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'image_box_shadow_h', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item img:hover, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery.list-isotope-metro .post-inner-loop .grid-item .woo-gallery-bg-image-metro:hover', ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); /*image box option*/ /*video option*/ $this->start_controls_section( 'section_box_video_styling', [ 'label' => esc_html__('Video', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_3', 'tp_enable_video' => 'yes', ], ] ); $this->start_controls_tabs( 'tabs_mm_video' ); $this->start_controls_tab( 'tab_video_normal', [ 'label' => esc_html__( 'Normal', 'theplus' ), ] ); $this->add_group_control( Group_Control_Css_Filter::get_type(), [ 'name' => 'video_filters', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item .tp-wc-video_wrapper', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'video_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item .tp-wc-video_wrapper', ] ); $this->add_responsive_control( 'video_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item .tp-wc-video_wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'video_shadow', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item .tp-wc-video_wrapper', ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_video_hover', [ 'label' => esc_html__( 'Hover', 'theplus' ), ] ); $this->add_group_control( Group_Control_Css_Filter::get_type(), [ 'name' => 'video_filters_h', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item .tp-wc-video_wrapper:hover', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'video_border_h', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item .tp-wc-video_wrapper:hover', ] ); $this->add_responsive_control( 'video_radius_h', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item .tp-wc-video_wrapper:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'video_shadow_h', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_3 .tp-woo-gallery .post-inner-loop .grid-item .tp-wc-video_wrapper:hover', ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); /*videooption*/ /*carousel option*/ $this->start_controls_section( 'section_carousel_options_styling', [ 'label' => esc_html__('Carousel', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_3', 'layout' => 'carousel', ], ] ); $this->add_control( 'carousel_unique_id', [ 'label' => esc_html__( 'Unique Carousel ID', 'theplus' ), 'type' => Controls_Manager::TEXT, 'default' => '', 'separator' => 'after', 'description' => esc_html__('Keep this blank or Setup Unique id for carousel which you can use with "Carousel Remote" widget.','theplus'), ] ); $this->add_control( 'slider_direction', [ 'label' => esc_html__( 'Slider Mode', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'horizontal', 'options' => [ 'horizontal' => esc_html__( 'Horizontal', 'theplus' ), 'vertical' => esc_html__( 'Vertical', 'theplus' ), ], ] ); $this->add_control( 'slide_speed', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Slide Speed', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => 0, 'max' => 10000, 'step' => 100, ], ], 'default' => [ 'unit' => '', 'size' => 1500, ], ] ); $this->start_controls_tabs( 'tabs_carousel_style' ); $this->start_controls_tab( 'tab_carousel_desktop', [ 'label' => esc_html__( 'Desktop', 'theplus' ), ] ); $this->add_control( 'slider_desktop_column', [ 'label' => esc_html__( 'Desktop Columns', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '4', 'options' => theplus_carousel_desktop_columns(), ] ); $this->add_control( 'steps_slide', [ 'label' => esc_html__( 'Next Previous', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '1', 'description' => esc_html__( 'Select option of column scroll on previous or next in carousel.','theplus' ), 'options' => [ '1' => esc_html__( 'One Column', 'theplus' ), '2' => esc_html__( 'All Visible Columns', 'theplus' ), ], ] ); $this->add_responsive_control( 'slider_padding', [ 'label' => esc_html__( 'Slide Padding', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%', 'em' ], 'default' => [ 'px' => [ 'top' => '', 'right' => '10', 'bottom' => '', 'left' => '10', ], ], 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-initialized .slick-slide' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_control( 'slider_draggable', [ 'label' => esc_html__( 'Draggable', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', ] ); $this->add_control( 'slider_infinite', [ 'label' => esc_html__( 'Infinite Mode', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', ] ); $this->add_control( 'slider_pause_hover', [ 'label' => esc_html__( 'Pause On Hover', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', ] ); $this->add_control( 'slider_adaptive_height', [ 'label' => esc_html__( 'Adaptive Height', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', ] ); $this->add_control( 'slider_autoplay', [ 'label' => esc_html__( 'Autoplay', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', ] ); $this->add_control( 'autoplay_speed', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Autoplay Speed', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => 500, 'max' => 10000, 'step' => 200, ], ], 'default' => [ 'unit' => '', 'size' => 3000, ], 'condition' => [ 'slider_autoplay' => 'yes', ], ] ); $this->add_control( 'slider_dots', [ 'label' => esc_html__( 'Show Dots', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', 'separator' => 'before', ] ); $this->add_control( 'slider_dots_style', [ 'label' => esc_html__( 'Dots Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'style-1', 'options' => [ 'style-1' => esc_html__( 'Style 1', 'theplus' ), 'style-2' => esc_html__( 'Style 2', 'theplus' ), 'style-3' => esc_html__( 'Style 3', 'theplus' ), 'style-4' => esc_html__( 'Style 4', 'theplus' ), 'style-5' => esc_html__( 'Style 5', 'theplus' ), 'style-6' => esc_html__( 'Style 6', 'theplus' ), 'style-7' => esc_html__( 'Style 7', 'theplus' ), ], 'condition' => [ 'slider_dots' => ['yes'], ], ] ); $this->add_control( 'dots_border_color', [ 'label' => esc_html__( 'Dots Border Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#252525', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-dots.style-1 li button,{{WRAPPER}} .list-carousel-slick .slick-dots.style-6 li button' => '-webkit-box-shadow:inset 0 0 0 8px {{VALUE}};-moz-box-shadow: inset 0 0 0 8px {{VALUE}};box-shadow: inset 0 0 0 8px {{VALUE}};', '{{WRAPPER}} .list-carousel-slick .slick-dots.style-1 li.slick-active button' => '-webkit-box-shadow:inset 0 0 0 1px {{VALUE}};-moz-box-shadow: inset 0 0 0 1px {{VALUE}};box-shadow: inset 0 0 0 1px {{VALUE}};', '{{WRAPPER}} .list-carousel-slick .slick-dots.style-2 li button' => 'border-color:{{VALUE}};', '{{WRAPPER}} .list-carousel-slick ul.slick-dots.style-3 li button' => '-webkit-box-shadow: inset 0 0 0 1px {{VALUE}};-moz-box-shadow: inset 0 0 0 1px {{VALUE}};box-shadow: inset 0 0 0 1px {{VALUE}};', '{{WRAPPER}} .list-carousel-slick .slick-dots.style-3 li.slick-active button' => '-webkit-box-shadow: inset 0 0 0 8px {{VALUE}};-moz-box-shadow: inset 0 0 0 8px {{VALUE}};box-shadow: inset 0 0 0 8px {{VALUE}};', '{{WRAPPER}} .list-carousel-slick ul.slick-dots.style-4 li button' => '-webkit-box-shadow: inset 0 0 0 0px {{VALUE}};-moz-box-shadow: inset 0 0 0 0px {{VALUE}};box-shadow: inset 0 0 0 0px {{VALUE}};', '{{WRAPPER}} .list-carousel-slick .slick-dots.style-1 li button:before' => 'color: {{VALUE}};', ], 'condition' => [ 'slider_dots_style' => ['style-1','style-2','style-3','style-5'], 'slider_dots' => 'yes', ], ] ); $this->add_control( 'dots_bg_color', [ 'label' => esc_html__( 'Dots Background Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#fff', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-dots.style-2 li button,{{WRAPPER}} .list-carousel-slick ul.slick-dots.style-3 li button,{{WRAPPER}} .list-carousel-slick .slick-dots.style-4 li button:before,{{WRAPPER}} .list-carousel-slick .slick-dots.style-5 button,{{WRAPPER}} .list-carousel-slick .slick-dots.style-7 button' => 'background: {{VALUE}};', ], 'condition' => [ 'slider_dots_style' => ['style-2','style-3','style-4','style-5','style-7'], 'slider_dots' => 'yes', ], ] ); $this->add_control( 'dots_active_border_color', [ 'label' => esc_html__( 'Dots Active Border Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#000', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-dots.style-2 li::after' => 'border-color: {{VALUE}};', '{{WRAPPER}} .list-carousel-slick .slick-dots.style-4 li.slick-active button' => '-webkit-box-shadow: inset 0 0 0 1px {{VALUE}};-moz-box-shadow: inset 0 0 0 1px {{VALUE}};box-shadow: inset 0 0 0 1px {{VALUE}};', '{{WRAPPER}} .list-carousel-slick .slick-dots.style-6 .slick-active button:after' => 'color: {{VALUE}};', ], 'condition' => [ 'slider_dots_style' => ['style-2','style-4','style-6'], 'slider_dots' => 'yes', ], ] ); $this->add_control( 'dots_active_bg_color', [ 'label' => esc_html__( 'Dots Active Background Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#000', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-dots.style-2 li::after,{{WRAPPER}} .list-carousel-slick .slick-dots.style-4 li.slick-active button:before,{{WRAPPER}} .list-carousel-slick .slick-dots.style-5 .slick-active button,{{WRAPPER}} .list-carousel-slick .slick-dots.style-7 .slick-active button' => 'background: {{VALUE}};', ], 'condition' => [ 'slider_dots_style' => ['style-2','style-4','style-5','style-7'], 'slider_dots' => 'yes', ], ] ); $this->add_control( 'dots_top_padding', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Dots Top Padding', 'theplus'), 'size_units' => ['px'], 'range' => [ 'px' => [ 'min' => 0, 'max' => 500, 'step' => 2, ], ], 'default' => [ 'unit' => 'px', 'size' => 0, ], 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-slider.slick-dotted' => 'padding-bottom: {{SIZE}}{{UNIT}};', ], 'condition' => [ 'slider_dots' => 'yes', ], ] ); $this->add_control( 'hover_show_dots', [ 'label' => esc_html__( 'On Hover Dots', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', 'condition' => [ 'slider_dots' => 'yes', ], ] ); $this->add_control( 'slider_arrows', [ 'label' => esc_html__( 'Show Arrows', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', 'separator' => 'before', ] ); $this->add_control( 'slider_arrows_style', [ 'label' => esc_html__( 'Arrows Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'style-1', 'options' => [ 'style-1' => esc_html__( 'Style 1', 'theplus' ), 'style-2' => esc_html__( 'Style 2', 'theplus' ), 'style-3' => esc_html__( 'Style 3', 'theplus' ), 'style-4' => esc_html__( 'Style 4', 'theplus' ), 'style-5' => esc_html__( 'Style 5', 'theplus' ), 'style-6' => esc_html__( 'Style 6', 'theplus' ), ], 'condition' => [ 'slider_arrows' => ['yes'], ], ] ); $this->add_control( 'arrows_position', [ 'label' => esc_html__( 'Arrows Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'top-right', 'options' => [ 'top-right' => esc_html__( 'Top-Right', 'theplus' ), 'bottm-left' => esc_html__( 'Bottom-Left', 'theplus' ), 'bottom-center' => esc_html__( 'Bottom-Center', 'theplus' ), 'bottom-right' => esc_html__( 'Bottom-Right', 'theplus' ), ], 'condition' => [ 'slider_arrows' => ['yes'], 'slider_arrows_style' => ['style-3','style-4'], ], ] ); $this->add_control( 'arrow_bg_color', [ 'label' => esc_html__( 'Arrow Background Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#c44d48', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-nav.slick-prev.style-1,{{WRAPPER}} .list-carousel-slick .slick-nav.slick-next.style-1,{{WRAPPER}} .list-carousel-slick .slick-nav.style-3:before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-3:before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-6:before,{{WRAPPER}} .list-carousel-slick .slick-next.style-6:before' => 'background: {{VALUE}};', '{{WRAPPER}} .list-carousel-slick .slick-prev.style-4:before,{{WRAPPER}} .list-carousel-slick .slick-nav.style-4:before' => 'border-color: {{VALUE}};', ], 'condition' => [ 'slider_arrows_style' => ['style-1','style-3','style-4','style-6'], 'slider_arrows' => 'yes', ], ] ); $this->add_control( 'arrow_icon_color', [ 'label' => esc_html__( 'Arrow Icon Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#fff', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-nav.slick-prev.style-1:before,{{WRAPPER}} .list-carousel-slick .slick-nav.slick-next.style-1:before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-3:before,{{WRAPPER}} .list-carousel-slick .slick-nav.style-3:before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-4:before,{{WRAPPER}} .list-carousel-slick .slick-nav.style-4:before,{{WRAPPER}} .list-carousel-slick .slick-nav.style-6 .icon-wrap' => 'color: {{VALUE}};', '{{WRAPPER}} .list-carousel-slick .slick-prev.style-2 .icon-wrap:before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-2 .icon-wrap:after,{{WRAPPER}} .list-carousel-slick .slick-next.style-2 .icon-wrap:before,{{WRAPPER}} .list-carousel-slick .slick-next.style-2 .icon-wrap:after,{{WRAPPER}} .list-carousel-slick .slick-prev.style-5 .icon-wrap:before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-5 .icon-wrap:after,{{WRAPPER}} .list-carousel-slick .slick-next.style-5 .icon-wrap:before,{{WRAPPER}} .list-carousel-slick .slick-next.style-5 .icon-wrap:after' => 'background: {{VALUE}};', ], 'condition' => [ 'slider_arrows_style' => ['style-1','style-2','style-3','style-4','style-5','style-6'], 'slider_arrows' => 'yes', ], ] ); $this->add_control( 'arrow_hover_bg_color', [ 'label' => esc_html__( 'Arrow Hover Background Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#fff', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-nav.slick-prev.style-1:hover,{{WRAPPER}} .list-carousel-slick .slick-nav.slick-next.style-1:hover,{{WRAPPER}} .list-carousel-slick .slick-prev.style-2:hover::before,{{WRAPPER}} .list-carousel-slick .slick-next.style-2:hover::before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-3:hover:before,{{WRAPPER}} .list-carousel-slick .slick-nav.style-3:hover:before' => 'background: {{VALUE}};', '{{WRAPPER}} .list-carousel-slick .slick-prev.style-4:hover:before,{{WRAPPER}} .list-carousel-slick .slick-nav.style-4:hover:before' => 'border-color: {{VALUE}};', ], 'condition' => [ 'slider_arrows_style' => ['style-1','style-2','style-3','style-4'], 'slider_arrows' => 'yes', ], ] ); $this->add_control( 'arrow_hover_icon_color', [ 'label' => esc_html__( 'Arrow Hover Icon Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#c44d48', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-nav.slick-prev.style-1:hover:before,{{WRAPPER}} .list-carousel-slick .slick-nav.slick-next.style-1:hover:before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-3:hover:before,{{WRAPPER}} .list-carousel-slick .slick-nav.style-3:hover:before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-4:hover:before,{{WRAPPER}} .list-carousel-slick .slick-nav.style-4:hover:before,{{WRAPPER}} .list-carousel-slick .slick-nav.style-6:hover .icon-wrap' => 'color: {{VALUE}};', '{{WRAPPER}} .list-carousel-slick .slick-prev.style-2:hover .icon-wrap::before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-2:hover .icon-wrap::after,{{WRAPPER}} .list-carousel-slick .slick-next.style-2:hover .icon-wrap::before,{{WRAPPER}} .list-carousel-slick .slick-next.style-2:hover .icon-wrap::after,{{WRAPPER}} .list-carousel-slick .slick-prev.style-5:hover .icon-wrap::before,{{WRAPPER}} .list-carousel-slick .slick-prev.style-5:hover .icon-wrap::after,{{WRAPPER}} .list-carousel-slick .slick-next.style-5:hover .icon-wrap::before,{{WRAPPER}} .list-carousel-slick .slick-next.style-5:hover .icon-wrap::after' => 'background: {{VALUE}};', ], 'condition' => [ 'slider_arrows_style' => ['style-1','style-2','style-3','style-4','style-5','style-6'], 'slider_arrows' => 'yes', ], ] ); $this->add_control( 'outer_section_arrow', [ 'label' => esc_html__( 'Outer Content Arrow', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', 'condition' => [ 'slider_arrows' => 'yes', 'slider_arrows_style' => ['style-1','style-2','style-5','style-6'], ], ] ); $this->add_control( 'hover_show_arrow', [ 'label' => esc_html__( 'On Hover Arrow', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', 'condition' => [ 'slider_arrows' => 'yes', ], ] ); $this->add_control( 'slider_center_mode', [ 'label' => esc_html__( 'Center Mode', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', 'separator' => 'before', ] ); $this->add_control( 'center_padding', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Center Padding', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => -200, 'max' => 500, 'step' => 2, ], ], 'default' => [ 'unit' => '', 'size' => 0, ], 'condition' => [ 'slider_center_mode' => ['yes'], ], ] ); $this->add_control( 'slider_center_effects', [ 'label' => esc_html__( 'Center Slide Effects', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'none', 'options' => theplus_carousel_center_effects(), 'condition' => [ 'slider_center_mode' => ['yes'], ], ] ); $this->add_control( 'scale_center_slide', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Center Slide Scale', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => 0.3, 'max' => 2, 'step' => 0.02, ], ], 'default' => [ 'unit' => '', 'size' => 1, ], 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-slide.slick-current.slick-active.slick-center' => '-webkit-transform: scale({{SIZE}});-moz-transform: scale({{SIZE}});-ms-transform: scale({{SIZE}});-o-transform: scale({{SIZE}});transform:scale({{SIZE}});', ], 'condition' => [ 'slider_center_mode' => 'yes', 'slider_center_effects' => 'scale', ], ] ); $this->add_control( 'scale_normal_slide', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Normal Slide Scale', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => 0.3, 'max' => 2, 'step' => 0.02, ], ], 'default' => [ 'unit' => '', 'size' => 0.8, ], 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-slide' => '-webkit-transform: scale({{SIZE}});-moz-transform: scale({{SIZE}});-ms-transform: scale({{SIZE}});-o-transform: scale({{SIZE}});transform:scale({{SIZE}});transition: .3s all linear;', ], 'condition' => [ 'slider_center_mode' => 'yes', 'slider_center_effects' => 'scale', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'shadow_active_slide', 'selector' => '{{WRAPPER}} .list-carousel-slick .slick-slide.slick-current.slick-active.slick-center .blog-list-content', 'condition' => [ 'slider_center_mode' => 'yes', 'slider_center_effects' => 'shadow', ], ] ); $this->add_control( 'opacity_normal_slide', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Normal Slide Opacity', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => 0.1, 'max' => 1, 'step' => 0.1, ], ], 'default' => [ 'unit' => '', 'size' => 0.7, ], 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .list-carousel-slick .slick-slide:not(.slick-center)' => 'opacity:{{SIZE}}', ], 'condition' => [ 'slider_center_mode' => 'yes', 'slider_center_effects!' => 'none', ], ] ); $this->add_control( 'slider_rows', [ 'label' => esc_html__( 'Number Of Rows', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '1', 'options' => [ "1" => esc_html__("1 Row", 'theplus'), "2" => esc_html__("2 Rows", 'theplus'), "3" => esc_html__("3 Rows", 'theplus'), ], 'separator' => 'before', ] ); $this->add_control( 'slide_row_top_space', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Row Top Space', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => 0, 'max' => 500, 'step' => 2, ], ], 'default' => [ 'unit' => '', 'size' => 15, ], 'selectors' => [ '{{WRAPPER}} .list-carousel-slick[data-slider_rows="2"] .slick-slide > div:last-child,{{WRAPPER}} .list-carousel-slick[data-slider_rows="3"] .slick-slide > div:nth-last-child(-n+2)' => 'padding-top:{{SIZE}}px', ], 'condition' => [ 'slider_rows' => ['2','3'], ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_carousel_tablet', [ 'label' => esc_html__( 'Tablet', 'theplus' ), ] ); $this->add_control( 'slider_tablet_column', [ 'label' => esc_html__( 'Tablet Columns', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '3', 'options' => theplus_carousel_tablet_columns(), ] ); $this->add_control( 'tablet_steps_slide', [ 'label' => esc_html__( 'Next Previous', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '1', 'description' => esc_html__( 'Select option of column scroll on previous or next in carousel.','theplus' ), 'options' => [ '1' => esc_html__( 'One Column', 'theplus' ), '2' => esc_html__( 'All Visible Columns', 'theplus' ), ], ] ); $this->add_control( 'slider_responsive_tablet', [ 'label' => esc_html__( 'Responsive Tablet', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', ] ); $this->add_control( 'tablet_slider_draggable', [ 'label' => esc_html__( 'Draggable', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', 'condition' => [ 'slider_responsive_tablet' => 'yes', ], ] ); $this->add_control( 'tablet_slider_infinite', [ 'label' => esc_html__( 'Infinite Mode', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', 'condition' => [ 'slider_responsive_tablet' => 'yes', ], ] ); $this->add_control( 'tablet_slider_autoplay', [ 'label' => esc_html__( 'Autoplay', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', 'condition' => [ 'slider_responsive_tablet' => 'yes', ], ] ); $this->add_control( 'tablet_autoplay_speed', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Autoplay Speed', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => 500, 'max' => 10000, 'step' => 200, ], ], 'default' => [ 'unit' => '', 'size' => 1500, ], 'condition' => [ 'slider_responsive_tablet' => 'yes', 'tablet_slider_autoplay' => 'yes', ], ] ); $this->add_control( 'tablet_slider_dots', [ 'label' => esc_html__( 'Show Dots', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', 'condition' => [ 'slider_responsive_tablet' => 'yes', ], ] ); $this->add_control( 'tablet_slider_arrows', [ 'label' => esc_html__( 'Show Arrows', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', 'condition' => [ 'slider_responsive_tablet' => 'yes', ], ] ); $this->add_control( 'tablet_slider_rows', [ 'label' => esc_html__( 'Number Of Rows', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '1', 'options' => [ "1" => esc_html__("1 Row", 'theplus'), "2" => esc_html__("2 Rows", 'theplus'), "3" => esc_html__("3 Rows", 'theplus'), ], 'condition' => [ 'slider_responsive_tablet' => 'yes', ], ] ); $this->add_control( 'tablet_center_mode', [ 'label' => esc_html__( 'Center Mode', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', 'separator' => 'before', 'condition' => [ 'slider_responsive_tablet' => 'yes', ], ] ); $this->add_control( 'tablet_center_padding', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Center Padding', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => 0, 'max' => 500, 'step' => 2, ], ], 'default' => [ 'unit' => '', 'size' => 0, ], 'condition' => [ 'slider_responsive_tablet' => 'yes', 'tablet_center_mode' => ['yes'], ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_carousel_mobile', [ 'label' => esc_html__( 'Mobile', 'theplus' ), ] ); $this->add_control( 'slider_mobile_column', [ 'label' => esc_html__( 'Mobile Columns', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '2', 'options' => theplus_carousel_mobile_columns(), ] ); $this->add_control( 'mobile_steps_slide', [ 'label' => esc_html__( 'Next Previous', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '1', 'description' => esc_html__( 'Select option of column scroll on previous or next in carousel.','theplus' ), 'options' => [ '1' => esc_html__( 'One Column', 'theplus' ), '2' => esc_html__( 'All Visible Columns', 'theplus' ), ], ] ); $this->add_control( 'slider_responsive_mobile', [ 'label' => esc_html__( 'Responsive Mobile', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', ] ); $this->add_control( 'mobile_slider_draggable', [ 'label' => esc_html__( 'Draggable', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', 'condition' => [ 'slider_responsive_mobile' => 'yes', ], ] ); $this->add_control( 'mobile_slider_infinite', [ 'label' => esc_html__( 'Infinite Mode', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', 'condition' => [ 'slider_responsive_mobile' => 'yes', ], ] ); $this->add_control( 'mobile_slider_autoplay', [ 'label' => esc_html__( 'Autoplay', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', 'condition' => [ 'slider_responsive_mobile' => 'yes', ], ] ); $this->add_control( 'mobile_autoplay_speed', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Autoplay Speed', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => 500, 'max' => 10000, 'step' => 200, ], ], 'default' => [ 'unit' => '', 'size' => 1500, ], 'condition' => [ 'slider_responsive_mobile' => 'yes', 'mobile_slider_autoplay' => 'yes', ], ] ); $this->add_control( 'mobile_slider_dots', [ 'label' => esc_html__( 'Show Dots', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'yes', 'condition' => [ 'slider_responsive_mobile' => 'yes', ], ] ); $this->add_control( 'mobile_slider_arrows', [ 'label' => esc_html__( 'Show Arrows', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', 'condition' => [ 'slider_responsive_mobile' => 'yes', ], ] ); $this->add_control( 'mobile_slider_rows', [ 'label' => esc_html__( 'Number Of Rows', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '1', 'options' => [ "1" => esc_html__("1 Row", 'theplus'), "2" => esc_html__("2 Rows", 'theplus'), "3" => esc_html__("3 Rows", 'theplus'), ], 'condition' => [ 'slider_responsive_mobile' => 'yes', ], ] ); $this->add_control( 'mobile_center_mode', [ 'label' => esc_html__( 'Center Mode', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', 'separator' => 'before', 'condition' => [ 'slider_responsive_mobile' => 'yes', ], ] ); $this->add_control( 'mobile_center_padding', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Center Padding', 'theplus'), 'size_units' => '', 'range' => [ '' => [ 'min' => 0, 'max' => 500, 'step' => 2, ], ], 'default' => [ 'unit' => '', 'size' => 0, ], 'condition' => [ 'slider_responsive_mobile' => 'yes', 'mobile_center_mode' => ['yes'], ], ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); /*carousel option*/ /*Single Image options*/ $this->start_controls_section( 'section_single_image_styling', [ 'label' => esc_html__('Image', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'select' => 'single_product', ], ] ); $this->start_controls_tabs( 'tabs_s_image' ); $this->start_controls_tab( 'tab_s_image_n', [ 'label' => esc_html__( 'Normal', 'theplus' ), ] ); $this->add_group_control( Group_Control_Css_Filter::get_type(), [ 'name' => 's_image_css', 'selector' => '{{WRAPPER}} .tp-woo-single-image img', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 's_image_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image', ] ); $this->add_responsive_control( 's_image_br', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 's_image_shadow', 'selector' => '{{WRAPPER}} .tp-woo-single-image', ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_s_image_h', [ 'label' => esc_html__( 'Hover', 'theplus' ), ] ); $this->add_group_control( Group_Control_Css_Filter::get_type(), [ 'name' => 's_image_css_h', 'selector' => '{{WRAPPER}} .tp-woo-single-image:hover img', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 's_image_border_h', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image:hover', ] ); $this->add_responsive_control( 's_image_br_h', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 's_image_shadow_h', 'selector' => '{{WRAPPER}} .tp-woo-single-image:hover', ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); /*Single Image option*/ /*Main Gallery Image option start*/ $this->start_controls_section( 'section_m_gal_img_styling', [ 'label' => esc_html__('Main Image', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_1', ], ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'm_gal_img_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-viewport', ] ); $this->add_responsive_control( 'm_gal_img_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-viewport' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'm_gal_img_shadow', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-viewport', ] ); $this->add_control( 'm_gal_img_zoom_heading', [ 'label' => esc_html__( 'Zoom Icon Option', 'theplus' ), 'type' => Controls_Manager::HEADING, 'separator' => 'before', ] ); $this->add_control( 'm_gal_img_zoom_color', [ 'label' => esc_html__( 'Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .woocommerce-product-gallery__trigger::before' => 'border:2px solid {{VALUE}}', '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .woocommerce-product-gallery__trigger::after' => 'background:{{VALUE}}', ], ] ); $this->add_group_control( Group_Control_Background::get_type(), [ 'name' => 'm_gal_img_zoom_background', 'label' => esc_html__( 'Background', 'theplus' ), 'types' => [ 'classic', 'gradient'], 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .woocommerce-product-gallery__trigger', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'm_gal_img_zoom_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .woocommerce-product-gallery__trigger', ] ); $this->add_responsive_control( 'm_gal_img_zoom_br', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .woocommerce-product-gallery__trigger' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'm_gal_img_zoom_shadow', 'label' => esc_html__( 'Box Shadow', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .woocommerce-product-gallery__trigger', ] ); $this->end_controls_section(); /*Main Gallery Image option end*/ /*Gallery Thumbnail Image option start*/ $this->start_controls_section( 'section_thumb_gal_img_styling', [ 'label' => esc_html__('Thumbnail', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_1', ], ] ); $this->add_responsive_control( 'tgi_space_d', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Space', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 60, 'step' => 1, ], ], 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs li' => 'padding-right: calc({{SIZE}}{{UNIT}} / 2); padding-left: calc({{SIZE}}{{UNIT}} / 2);padding-bottom: {{SIZE}}{{UNIT}};', ], ] ); $this->start_controls_tabs( 'tabs_tgi_style' ); $this->start_controls_tab( 'tab_tgi_normal', [ 'label' => esc_html__( 'Normal', 'theplus' ), ] ); $this->add_control( 't_gal_img_opacity', [ 'label' => esc_html__( 'Opacity', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 1, 'step' => 0.01, ], ], 'default' => [ 'unit' => 'px', 'size' => '', ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img' => 'opacity: {{SIZE}};', ], ] ); $this->add_group_control( Group_Control_Css_Filter::get_type(), [ 'label' => esc_html__( 'CSS Filter', 'theplus' ), 'name' => 't_gal_img_css_filters', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 't_gal_img_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img', ] ); $this->add_responsive_control( 't_gal_img_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 't_gal_img_shadow', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img', ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_tgi_active', [ 'label' => esc_html__( 'Active', 'theplus' ), ] ); $this->add_control( 't_gal_img_opacity_act', [ 'label' => esc_html__( 'Opacity', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 1, 'step' => 0.01, ], ], 'default' => [ 'unit' => 'px', 'size' => '', ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img.flex-active, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img:hover' => 'opacity: {{SIZE}};', ], ] ); $this->add_group_control( Group_Control_Css_Filter::get_type(), [ 'label' => esc_html__( 'CSS Filter', 'theplus' ), 'name' => 't_gal_img_css_filters_act', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img.flex-active, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img:hover', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 't_gal_img_border_act', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img.flex-active, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img:hover', ] ); $this->add_responsive_control( 't_gal_img_radius_act', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img.flex-active, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 't_gal_img_shadow_act', 'selector' => '{{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img.flex-active, {{WRAPPER}} .tp-woo-single-image.tp-pg-style_1 .flex-control-thumbs img:hover', ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); /*Gallery Thumbnail Image option end*/ /*Extra options*/ $this->start_controls_section( 'section_extra_options_styling', [ 'label' => esc_html__('Extra Options', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'select' => 'product_gallery', 'select_pg_style' => 'style_3', ], ] ); $this->add_control( 'messy_column', [ 'label' => esc_html__( 'Messy Columns', 'theplus' ), 'type' => \Elementor\Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'On', 'theplus' ), 'label_off' => esc_html__( 'Off', 'theplus' ), 'default' => 'no', 'separator' => 'before', ] ); $this->start_controls_tabs( 'tabs_extra_option_style' ); $this->start_controls_tab( 'tab_column_1', [ 'label' => esc_html__( '1', 'theplus' ), 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->add_responsive_control( 'desktop_column_1', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Column 1', 'theplus'), 'size_units' => ['px'], 'range' => [ 'px' => [ 'min' => -250, 'max' => 250, 'step' => 2, ], '%' => [ 'min' => 70, 'max' => 70, 'step' => 1, ], ], 'default' => [ 'unit' => 'px', 'size' => 0, ], 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_column_2', [ 'label' => esc_html__( '2', 'theplus' ), 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->add_responsive_control( 'desktop_column_2', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Column 2', 'theplus'), 'size_units' => ['px'], 'range' => [ 'px' => [ 'min' => -250, 'max' => 250, 'step' => 2, ], '%' => [ 'min' => 70, 'max' => 70, 'step' => 1, ], ], 'default' => [ 'unit' => 'px', 'size' => 0, ], 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_column_3', [ 'label' => esc_html__( '3', 'theplus' ), 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->add_responsive_control( 'desktop_column_3', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Column 3', 'theplus'), 'size_units' => ['px'], 'range' => [ 'px' => [ 'min' => -250, 'max' => 250, 'step' => 2, ], '%' => [ 'min' => 70, 'max' => 70, 'step' => 1, ], ], 'default' => [ 'unit' => 'px', 'size' => 0, ], 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_column_4', [ 'label' => esc_html__( '4', 'theplus' ), 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->add_responsive_control( 'desktop_column_4', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Column 4', 'theplus'), 'size_units' => ['px'], 'range' => [ 'px' => [ 'min' => -250, 'max' => 250, 'step' => 2, ], '%' => [ 'min' => 70, 'max' => 70, 'step' => 1, ], ], 'default' => [ 'unit' => 'px', 'size' => 0, ], 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_column_5', [ 'label' => esc_html__( '5', 'theplus' ), 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->add_responsive_control( 'desktop_column_5', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Column 5', 'theplus'), 'size_units' => ['px'], 'range' => [ 'px' => [ 'min' => -250, 'max' => 250, 'step' => 2, ], '%' => [ 'min' => 70, 'max' => 70, 'step' => 1, ], ], 'default' => [ 'unit' => 'px', 'size' => 0, ], 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_column_6', [ 'label' => esc_html__( '6', 'theplus' ), 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->add_responsive_control( 'desktop_column_6', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Column 6', 'theplus'), 'size_units' => ['px'], 'range' => [ 'px' => [ 'min' => -250, 'max' => 250, 'step' => 2, ], '%' => [ 'min' => 70, 'max' => 70, 'step' => 1, ], ], 'default' => [ 'unit' => 'px', 'size' => 0, ], 'condition' => [ 'messy_column' => ['yes'], ], ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); /*Extra options*/ } public function render() { $settings = $this->get_settings_for_display(); if ( class_exists('woocommerce') ) { $select = $settings['select']; $select_pg_style = $settings['select_pg_style']; $select_pg_thumb = $settings['select_pg_thumb']; $sp_thumbnail = $settings['single_product_thumbnail_size']; $hover_image_on_off = !empty($settings['hover_image_on_off']) ? $settings['hover_image_on_off'] : 'no'; $hover_image_class=''; if((!empty($select) && $select=='single_product') && (!empty($hover_image_on_off) && $hover_image_on_off=='yes')){ $hover_image_class="tp-on-hover-image"; } $uid=uniqid("tp"); global $product; $product = wc_get_product(); if ( empty( $product ) ) { return; } $product_id = $product->get_image_id(); $attachment_ids = $product->get_gallery_image_ids(); $select_pg_style_o=$select_pg_thumb_pos=''; if(!empty($select) && $select=='product_gallery'){ if(!empty($select_pg_style)){ $select_pg_style_o = 'tp-pg-'.$select_pg_style; if(!empty($select_pg_thumb)){ $select_pg_thumb_pos = $select_pg_thumb; } } } echo '<div class="tp-woo-single-image '.$select_pg_style_o.' '.$select_pg_thumb_pos.' '.$hover_image_class.'">'; /*single product start*/ if(!empty($select) && $select=='single_product'){ $attachment_ids = $product->get_gallery_image_ids(); //if ($attachment_ids) { if(isset($settings['on_image_link']) && $settings['on_image_link']=='yes'){ echo '<a href="'.esc_url(get_the_permalink()).'">'; } if(!empty($hover_image_on_off) && $hover_image_on_off=='yes' && !empty($attachment_ids)){ echo '<span class="product-image hover-image">'.wp_get_attachment_image( $attachment_ids[0], $sp_thumbnail ).'</span>'; } echo wp_get_attachment_image( get_post_thumbnail_id(), $sp_thumbnail ); if(isset($settings['on_image_link']) && $settings['on_image_link']=='yes'){ echo '</a>'; } //} } /*single product end*/ /*single product gallery start*/ if(!empty($select) && $select=='product_gallery'){ /*single product gallery style 1 start*/ if(!empty($select_pg_style) && $select_pg_style=='style_1'){ wc_get_template( 'single-product/product-image.php' ); } /*single product gallery style 1 end*/ /*single product gallery style 3 start*/ /*st3*/ if((!empty($select) && $select=='product_gallery') && (!empty($select_pg_style) && $select_pg_style=='style_3')){ $layout=$settings["layout"]; //columns $desktop_class=$tablet_class=$mobile_class=''; if($layout!='carousel' && $layout!='metro'){ $desktop_class='tp-col-lg-'.esc_attr($settings['desktop_column']); $tablet_class='tp-col-md-'.esc_attr($settings['tablet_column']); $mobile_class='tp-col-sm-'.esc_attr($settings['mobile_column']); $mobile_class .=' tp-col-'.esc_attr($settings['mobile_column']); } //layout $layout_attr=$data_class=''; if($layout!=''){ $data_class .=theplus_get_layout_list_class($layout); $layout_attr=theplus_get_layout_list_attr($layout); }else{ $data_class .=' list-isotope'; } if($layout=='metro'){ $metro_columns=$settings['metro_column']; $layout_attr .=' data-metro-columns="'.esc_attr($metro_columns).'" '; if(isset($settings["metro_style_".$metro_columns]) && !empty($settings["metro_style_".$metro_columns])){ $layout_attr .=' data-metro-style="'.esc_attr($settings["metro_style_".$metro_columns]).'" '; } if(!empty($settings["responsive_tablet_metro"]) && $settings["responsive_tablet_metro"]=='yes'){ $tablet_metro_column=$settings["tablet_metro_column"]; $layout_attr .=' data-tablet-metro-columns="'.esc_attr($tablet_metro_column).'" '; if(isset($settings["tablet_metro_style_".$tablet_metro_column]) && !empty($settings["tablet_metro_style_".$tablet_metro_column])){ $layout_attr .=' data-tablet-metro-style="'.esc_attr($settings["tablet_metro_style_".$tablet_metro_column]).'" '; } } } $output=$data_attr=$outputvideo=''; //carousel if($layout=='carousel'){ if(!empty($settings["hover_show_dots"]) && $settings["hover_show_dots"]=='yes'){ $data_class .=' hover-slider-dots'; } if(!empty($settings["hover_show_arrow"]) && $settings["hover_show_arrow"]=='yes'){ $data_class .=' hover-slider-arrow'; } if(!empty($settings["outer_section_arrow"]) && $settings["outer_section_arrow"]=='yes' && ($settings["slider_arrows_style"]=='style-1' || $settings["slider_arrows_style"]=='style-2' || $settings["slider_arrows_style"]=='style-5' || $settings["slider_arrows_style"]=='style-6')){ $data_class .=' outer-slider-arrow'; } $data_attr .=$this->get_carousel_options(); if($settings["slider_arrows_style"]=='style-3' || $settings["slider_arrows_style"]=='style-4'){ $data_class .=' '.$settings["arrows_position"]; } if(($settings["slider_rows"] > 1) || ($settings["tablet_slider_rows"] > 1) || ($settings["mobile_slider_rows"] > 1)){ $data_class .= ' multi-row'; } } $ji=1;$ij=''; $uid=uniqid("post"); if(!empty($settings["carousel_unique_id"])){ $uid="tpca_".$settings["carousel_unique_id"]; } $data_attr .=' data-id="'.esc_attr($uid).'"'; $tablet_metro_class=$tablet_ij=''; $output .= '<div id="tp-woo-gallery" class="tp-woo-gallery '.esc_attr($uid).' '.esc_attr($data_class).' " '.$layout_attr.' '.$data_attr.' data-enable-isotope="1">'; $output .= '<div id="'.esc_attr($uid).'" class="tp-row post-inner-loop '.esc_attr($uid).' ">'; /*video*/ $dyna_cat_check=theplus_get_option('general','check_elements'); $check_category= get_option( 'theplus_api_connection_data' ); if(isset($dyna_cat_check) && !empty($dyna_cat_check) && in_array("tp_woo_single_image", $dyna_cat_check) && !empty($check_category['theplus_custom_field_video_switch'])){ if(!empty($settings['tp_enable_video']) && $settings['tp_enable_video']=='yes'){ if(!empty($layout) && $layout=='metro'){ $metro_columns=$settings['metro_column']; if(!empty($settings["metro_style_".$metro_columns])){ $ij=theplus_metro_style_layout($ji,$settings['metro_column'],$settings["metro_style_".$metro_columns]); } if(!empty($settings["responsive_tablet_metro"]) && $settings["responsive_tablet_metro"]=='yes'){ $tablet_metro_column=$settings["tablet_metro_column"]; if(!empty($settings["tablet_metro_style_".$tablet_metro_column])){ $tablet_ij=theplus_metro_style_layout($ji++,$settings['tablet_metro_column'],$settings["tablet_metro_style_".$tablet_metro_column]); $tablet_metro_class ='tb-metro-item'.esc_attr($tablet_ij); } } } $outputvideo .= '<div class="grid-item metro-item'.esc_attr($ij).' '.esc_attr($tablet_metro_class).' '.$desktop_class.' '.$tablet_class.' '.$mobile_class.' ">'; $outputvideo .= '<div class="tp-wc-video_wrapper"> <iframe frameborder="0" width="100%" height="100%" src="'.get_post_meta(get_the_id(), 'theplus_custom_field_video', true).'" autoplay="0" webkitAllowFullScreen mozallowfullscreen allowfullscreen > </iframe></div>'; $outputvideo .= '</div>'; } } if(isset($dyna_cat_check) && !empty($dyna_cat_check) && in_array("tp_woo_single_image", $dyna_cat_check) && !empty($check_category['theplus_custom_field_video_switch'])){ if(!empty($settings['tp_enable_video']) && $settings['tp_enable_video']=='yes'){ if(!empty($settings['tp_enable_video_pos']) && $settings['tp_enable_video_pos']=='first'){ $output .= $outputvideo; } } } /*video*/ $featured_image=''; if(!empty($attachment_ids)){ foreach( $attachment_ids as $attachment_id ){ if(!empty($layout) && $layout=='metro'){ $metro_columns=$settings['metro_column']; if(!empty($settings["metro_style_".$metro_columns])){ $ij=theplus_metro_style_layout($ji,$settings['metro_column'],$settings["metro_style_".$metro_columns]); } if(!empty($settings["responsive_tablet_metro"]) && $settings["responsive_tablet_metro"]=='yes'){ $tablet_metro_column=$settings["tablet_metro_column"]; if(!empty($settings["tablet_metro_style_".$tablet_metro_column])){ $tablet_ij=theplus_metro_style_layout($ji++,$settings['tablet_metro_column'],$settings["tablet_metro_style_".$tablet_metro_column]); $tablet_metro_class ='tb-metro-item'.esc_attr($tablet_ij); } } } $output .= '<div class="grid-item metro-item'.esc_attr($ij).' '.esc_attr($tablet_metro_class).' '.$desktop_class.' '.$tablet_class.' '.$mobile_class.' ">'; $featured_image = wp_get_attachment_image_src( $attachment_id ); if(!empty($layout) && $layout=='metro'){ $featured_image=wp_get_attachment_image_src($attachment_id,'full'); $featured_image = 'style="background:url('.esc_url($featured_image[0]).') #f7f7f7;" '; $featured_image = '<div class="woo-gallery-bg-image-metro" '.$featured_image.'></div>'; } if(!empty($layout) && $layout=='grid'){ $featured_image=wp_get_attachment_image_src($attachment_id,'tp-image-grid'); $featured_image='<img src="'.esc_url($featured_image[0]).'">'; }else if(!empty($layout) && $layout=='masonry'){ $featured_image=wp_get_attachment_image_src($attachment_id,'full'); $featured_image='<img src="'.esc_url($featured_image[0]).'" >'; }else if(!empty($layout) && $layout=='carousel'){ if(!empty($settings['src_image_type']) && $settings['src_image_type']=='grid'){ $featured_image=wp_get_attachment_image_src($attachment_id,'tp-image-grid'); }else if(!empty($settings['src_image_type']) && $settings['src_image_type']=='full'){ $featured_image=wp_get_attachment_image_src($attachment_id,'full'); } $featured_image='<img src="'.esc_url($featured_image[0]).'">'; } $output .=$featured_image; $output .='</div>'; $ij++; } }else{ echo '<div id="tp-woo-gallery" class="tp-woo-gallery '.esc_attr($uid).' '.esc_attr($data_class).' " '.$layout_attr.' '.$data_attr.' data-enable-isotope="1">'; echo '<div id="'.esc_attr($uid).'" class="tp-row post-inner-loop '.esc_attr($uid).' ">'; echo '<div class="grid-item metro-item'.esc_attr($ij).' '.esc_attr($tablet_metro_class).' '.$desktop_class.' '.$tablet_class.' '.$mobile_class.' ">'; $attachment_ids = $product->get_gallery_image_ids(); if(!empty($layout) && $layout=='grid'){ echo wp_get_attachment_image( get_post_thumbnail_id(), 'tp-image-grid' ); }else if(!empty($layout) && $layout=='masonry'){ echo wp_get_attachment_image( get_post_thumbnail_id(), 'full' ); }else if(!empty($layout) && $layout=='carousel'){ echo wp_get_attachment_image( get_post_thumbnail_id(), 'full' ); } echo '</div>'; echo '</div>'; echo '</div>'; } $ji++; /*video*/ if(isset($dyna_cat_check) && !empty($dyna_cat_check) && in_array("tp_woo_single_image", $dyna_cat_check) && !empty($check_category['theplus_custom_field_video_switch'])){ if(!empty($settings['tp_enable_video']) && $settings['tp_enable_video']=='yes'){ if(!empty($settings['tp_enable_video_pos']) && $settings['tp_enable_video_pos']=='last'){ $output .= $outputvideo; } } } /*video*/ $output .='</div>'; $output .='</div>'; $css_rule =$css_messy=''; if($settings['messy_column']=='yes'){ if($layout=='grid' || $layout=='masonry'){ $desktop_column=$settings['desktop_column']; $tablet_column=$settings['tablet_column']; $mobile_column=$settings['mobile_column']; }else if($layout=='carousel'){ $desktop_column=$settings['slider_desktop_column']; $tablet_column=$settings['slider_tablet_column']; $mobile_column=$settings['slider_mobile_column']; } if($layout!='metro'){ for($x = 1; $x <= 6; $x++){ if(!empty($settings["desktop_column_".$x])){ $desktop=!empty($settings["desktop_column_".$x]["size"]) ? $settings["desktop_column_".$x]["size"].$settings["desktop_column_".$x]["unit"] : ''; $tablet=!empty($settings["desktop_column_".$x."_tablet"]["size"]) ? $settings["desktop_column_".$x."_tablet"]["size"].$settings["desktop_column_".$x."_tablet"]["unit"] : ''; $mobile=!empty($settings["desktop_column_".$x."_mobile"]["size"]) ? $settings["desktop_column_".$x."_mobile"]["size"].$settings["desktop_column_".$x."_mobile"]["unit"] : ''; $css_messy .= theplus_messy_columns($x,$layout,$uid,$desktop,$tablet,$mobile,$desktop_column,$tablet_column,$mobile_column); } } $css_rule ='<style>'.$css_messy.'</style>'; } } echo $output.$css_rule; wp_reset_postdata(); } /*st3*/ /*single product gallery style 3 end*/ if ( wp_doing_ajax() ) { ?> <script type='text/javascript'> jQuery( '.woocommerce-product-gallery' ).each( function() { jQuery( this ).wc_product_gallery(); } ); </script> <?php } } /*single product gallery end*/ echo '</div>'; } } protected function get_carousel_options() { $settings = $this->get_settings_for_display(); $data_slider =''; $slider_direction = ($settings['slider_direction']=='vertical') ? 'true' : 'false'; $data_slider .=' data-slider_direction="'.esc_attr($slider_direction).'"'; $data_slider .=' data-slide_speed="'.esc_attr($settings["slide_speed"]["size"]).'"'; $data_slider .=' data-slider_desktop_column="'.esc_attr($settings['slider_desktop_column']).'"'; $data_slider .=' data-steps_slide="'.esc_attr($settings['steps_slide']).'"'; $slider_draggable= ($settings["slider_draggable"]=='yes') ? 'true' : 'false'; $data_slider .=' data-slider_draggable="'.esc_attr($slider_draggable).'"'; $slider_infinite= ($settings["slider_infinite"]=='yes') ? 'true' : 'false'; $data_slider .=' data-slider_infinite="'.esc_attr($slider_infinite).'"'; $slider_pause_hover= ($settings["slider_pause_hover"]=='yes') ? 'true' : 'false'; $data_slider .=' data-slider_pause_hover="'.esc_attr($slider_pause_hover).'"'; $slider_adaptive_height= ($settings["slider_adaptive_height"]=='yes') ? 'true' : 'false'; $data_slider .=' data-slider_adaptive_height="'.esc_attr($slider_adaptive_height).'"'; $slider_autoplay= ($settings["slider_autoplay"]=='yes') ? 'true' : 'false'; $data_slider .=' data-slider_autoplay="'.esc_attr($slider_autoplay).'"'; $data_slider .=' data-autoplay_speed="'.esc_attr($settings["autoplay_speed"]["size"]).'"'; //tablet $data_slider .=' data-slider_tablet_column="'.esc_attr($settings['slider_tablet_column']).'"'; $data_slider .=' data-tablet_steps_slide="'.esc_attr($settings['tablet_steps_slide']).'"'; $slider_responsive_tablet=$settings['slider_responsive_tablet']; $data_slider .=' data-slider_responsive_tablet="'.esc_attr($slider_responsive_tablet).'"'; if(!empty($settings['slider_responsive_tablet']) && $settings['slider_responsive_tablet']=='yes'){ $tablet_slider_draggable= ($settings["tablet_slider_draggable"]=='yes') ? 'true' : 'false'; $data_slider .=' data-tablet_slider_draggable="'.esc_attr($tablet_slider_draggable).'"'; $tablet_slider_infinite= ($settings["tablet_slider_infinite"]=='yes') ? 'true' : 'false'; $data_slider .=' data-tablet_slider_infinite="'.esc_attr($tablet_slider_infinite).'"'; $tablet_slider_autoplay= ($settings["tablet_slider_autoplay"]=='yes') ? 'true' : 'false'; $data_slider .=' data-tablet_slider_autoplay="'.esc_attr($tablet_slider_autoplay).'"'; $data_slider .=' data-tablet_autoplay_speed="'.esc_attr($settings["tablet_autoplay_speed"]["size"]).'"'; $tablet_slider_dots= ($settings["tablet_slider_dots"]=='yes') ? 'true' : 'false'; $data_slider .=' data-tablet_slider_dots="'.esc_attr($tablet_slider_dots).'"'; $tablet_slider_arrows= ($settings["tablet_slider_arrows"]=='yes') ? 'true' : 'false'; $data_slider .=' data-tablet_slider_arrows="'.esc_attr($tablet_slider_arrows).'"'; $data_slider .=' data-tablet_slider_rows="'.esc_attr($settings["tablet_slider_rows"]).'"'; $tablet_center_mode= ($settings["tablet_center_mode"]=='yes') ? 'true' : 'false'; $data_slider .=' data-tablet_center_mode="'.esc_attr($tablet_center_mode).'" '; $data_slider .=' data-tablet_center_padding="'.esc_attr(!empty($settings["tablet_center_padding"]["size"]) ? $settings["tablet_center_padding"]["size"] : 0).'" '; } //mobile $data_slider .=' data-slider_mobile_column="'.esc_attr($settings['slider_mobile_column']).'"'; $data_slider .=' data-mobile_steps_slide="'.esc_attr($settings['mobile_steps_slide']).'"'; $slider_responsive_mobile=$settings['slider_responsive_mobile']; $data_slider .=' data-slider_responsive_mobile="'.esc_attr($slider_responsive_mobile).'"'; if(!empty($settings['slider_responsive_mobile']) && $settings['slider_responsive_mobile']=='yes'){ $mobile_slider_draggable= ($settings["mobile_slider_draggable"]=='yes') ? 'true' : 'false'; $data_slider .=' data-mobile_slider_draggable="'.esc_attr($mobile_slider_draggable).'"'; $mobile_slider_infinite= ($settings["mobile_slider_infinite"]=='yes') ? 'true' : 'false'; $data_slider .=' data-mobile_slider_infinite="'.esc_attr($mobile_slider_infinite).'"'; $mobile_slider_autoplay= ($settings["mobile_slider_autoplay"]=='yes') ? 'true' : 'false'; $data_slider .=' data-mobile_slider_autoplay="'.esc_attr($mobile_slider_autoplay).'"'; $data_slider .=' data-mobile_autoplay_speed="'.esc_attr($settings["mobile_autoplay_speed"]["size"]).'"'; $mobile_slider_dots= ($settings["mobile_slider_dots"]=='yes') ? 'true' : 'false'; $data_slider .=' data-mobile_slider_dots="'.esc_attr($mobile_slider_dots).'"'; $mobile_slider_arrows= ($settings["mobile_slider_arrows"]=='yes') ? 'true' : 'false'; $data_slider .=' data-mobile_slider_arrows="'.esc_attr($mobile_slider_arrows).'"'; $data_slider .=' data-mobile_slider_rows="'.esc_attr($settings["mobile_slider_rows"]).'"'; $mobile_center_mode= ($settings["mobile_center_mode"]=='yes') ? 'true' : 'false'; $data_slider .=' data-mobile_center_mode="'.esc_attr($mobile_center_mode).'" '; $data_slider .=' data-mobile_center_padding="'.esc_attr($settings["mobile_center_padding"]["size"]).'" '; } $slider_dots= ($settings["slider_dots"]=='yes') ? 'true' : 'false'; $data_slider .=' data-slider_dots="'.esc_attr($slider_dots).'"'; $data_slider .=' data-slider_dots_style="slick-dots '.esc_attr($settings["slider_dots_style"]).'"'; $slider_arrows= ($settings["slider_arrows"]=='yes') ? 'true' : 'false'; $data_slider .=' data-slider_arrows="'.esc_attr($slider_arrows).'"'; $data_slider .=' data-slider_arrows_style="'.esc_attr($settings["slider_arrows_style"]).'" '; $data_slider .=' data-arrows_position="'.esc_attr($settings["arrows_position"]).'" '; $data_slider .=' data-arrow_bg_color="'.esc_attr($settings["arrow_bg_color"]).'" '; $data_slider .=' data-arrow_icon_color="'.esc_attr($settings["arrow_icon_color"]).'" '; $data_slider .=' data-arrow_hover_bg_color="'.esc_attr($settings["arrow_hover_bg_color"]).'" '; $data_slider .=' data-arrow_hover_icon_color="'.esc_attr($settings["arrow_hover_icon_color"]).'" '; $slider_center_mode= ($settings["slider_center_mode"]=='yes') ? 'true' : 'false'; $data_slider .=' data-slider_center_mode="'.esc_attr($slider_center_mode).'" '; $data_slider .=' data-center_padding="'.esc_attr((!empty($settings["center_padding"]["size"])) ? $settings["center_padding"]["size"] : 0).'" '; $data_slider .=' data-scale_center_slide="'.esc_attr((!empty($settings["scale_center_slide"]["size"])) ? $settings["scale_center_slide"]["size"] : 1).'" '; $data_slider .=' data-scale_normal_slide="'.esc_attr((!empty($settings["scale_normal_slide"]["size"])) ? $settings["scale_normal_slide"]["size"] : 0.8).'" '; $data_slider .=' data-opacity_normal_slide="'.esc_attr((!empty($settings["opacity_normal_slide"]["size"])) ? $settings["opacity_normal_slide"]["size"] : 0.7).'" '; $data_slider .=' data-slider_rows="'.esc_attr($settings["slider_rows"]).'" '; return $data_slider; } }