Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <?php
- namespace Elementor;
- use \Elementor\ElementsKit_Widget_Image_Accordion_Handler as Handler;
- use \ElementsKit_Lite\Modules\Controls\Controls_Manager as ElementsKit_Controls_Manager;
- if ( ! defined( 'ABSPATH' ) ) exit;
- class ElementsKit_Widget_Image_Accordion extends Widget_Base {
- use \ElementsKit_Lite\Widgets\Widget_Notice;
- public $base;
- public function get_name() {
- return Handler::get_name();
- }
- public function get_title() {
- return Handler::get_title();
- }
- public function get_icon() {
- return Handler::get_icon();
- }
- public function get_categories() {
- return Handler::get_categories();
- }
- public function get_keywords() {
- return Handler::get_keywords();
- }
- public function get_help_url() {
- return 'https://wpmet.com/doc/image-accordion/';
- }
- protected function register_controls() {
- $this->start_controls_section(
- 'ekit_img_accordion_content_tab',
- [
- 'label' => esc_html__('Content', 'elementskit-lite'),
- 'tab' => Controls_Manager::TAB_CONTENT,
- ]
- );
- $repeater = new \Elementor\Repeater();
- $repeater->add_control(
- 'ekit_img_accordion_active',
- [
- 'label' => esc_html__('Active ? ', 'elementskit-lite'),
- 'type' => Controls_Manager::SWITCHER,
- 'default' => 'no',
- 'label_on' => esc_html__( 'Yes', 'elementskit-lite' ),
- 'label_off' => esc_html__( 'No', 'elementskit-lite' ),
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_bg',
- [
- 'label' => esc_html__( 'Background Image', 'elementskit-lite' ),
- 'type' => Controls_Manager::MEDIA,
- 'dynamic' => [
- 'active' => true,
- ],
- 'default' => [
- 'url' => Utils::get_placeholder_image_src(),
- 'id' => -1
- ],
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_title',
- [
- 'label' => esc_html__('Title', 'elementskit-lite'),
- 'type' => Controls_Manager::TEXT,
- 'dynamic' => [
- 'active' => true,
- ],
- 'label_block' => true,
- 'default' => esc_html__('Image accordion Title', 'elementskit-lite'),
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_subtitle',
- [
- 'label' => esc_html__('Subtitle', 'elementskit-lite'),
- 'type' => Controls_Manager::TEXT,
- 'dynamic' => [
- 'active' => true,
- ],
- 'label_block' => true,
- 'default' => esc_html__('Image accordion Subtitle', 'elementskit-lite'),
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_enable_icon',
- [
- 'label' => esc_html__( 'Enable Icon', 'elementskit-lite' ),
- 'type' => Controls_Manager::SWITCHER,
- 'label_on' => esc_html__( 'Yes', 'elementskit-lite' ),
- 'label_off' => esc_html__( 'No', 'elementskit-lite' ),
- 'return_value' => 'yes',
- 'default' => '',
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_title_icons',
- [
- 'label' => esc_html__('Icon for title', 'elementskit-lite'),
- 'type' => Controls_Manager::ICONS,
- 'fa4compatibility' => 'ekit_img_accordion_title_icon',
- 'default' => [
- 'value' => '',
- ],
- 'condition' => [
- 'ekit_img_accordion_enable_icon' => 'yes',
- ]
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_title_icon_position',
- [
- 'label' => esc_html__( 'Icon Position', 'elementskit-lite' ),
- 'type' => Controls_Manager::SELECT,
- 'default' => 'left',
- 'options' => [
- 'left' => esc_html__( 'Before', 'elementskit-lite' ),
- 'right' => esc_html__( 'After', 'elementskit-lite' ),
- ],
- 'condition' => [
- 'ekit_img_accordion_title_icons!' => '',
- 'ekit_img_accordion_enable_icon' => 'yes',
- ],
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_enable_wrap_link',
- [
- 'label' => esc_html__( 'Enable Wrap Link', 'elementskit-lite' ),
- 'type' => Controls_Manager::SWITCHER,
- 'label_on' => esc_html__( 'Yes', 'elementskit-lite' ),
- 'label_off' => esc_html__( 'No', 'elementskit-lite' ),
- 'return_value' => 'yes',
- 'default' => 'no',
- 'separator' => 'before',
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_wrap_link_url',
- [
- 'label' => esc_html__('Wrap URL', 'elementskit-lite'),
- 'type' => Controls_Manager::URL,
- 'dynamic' => [
- 'active' => true,
- ],
- 'condition' => [
- 'ekit_img_accordion_enable_wrap_link' => 'yes',
- ],
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_enable_button',
- [
- 'label' => esc_html__( 'Enable Button', 'elementskit-lite' ),
- 'type' => Controls_Manager::SWITCHER,
- 'label_on' => esc_html__( 'Yes', 'elementskit-lite' ),
- 'label_off' => esc_html__( 'No', 'elementskit-lite' ),
- 'return_value' => 'yes',
- 'default' => 'yes',
- 'separator' => 'before',
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_button_icon',
- [
- 'label' => esc_html__( 'Button Icon', 'elementskit-lit' ),
- 'type' => \Elementor\Controls_Manager::ICONS,
- 'condition' => [
- 'ekit_img_accordion_enable_button' => 'yes',
- ],
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_button_label',
- [
- 'label' => esc_html__('Button Label', 'elementskit-lite'),
- 'type' => Controls_Manager::TEXT,
- 'dynamic' => [
- 'active' => true,
- ],
- 'label_block' => true,
- 'default' => esc_html__('Read More','elementskit-lite'),
- 'condition' => [
- 'ekit_img_accordion_enable_button' => 'yes',
- ],
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_button_url',
- [
- 'label' => esc_html__('Button URL', 'elementskit-lite'),
- 'type' => Controls_Manager::URL,
- 'dynamic' => [
- 'active' => true,
- ],
- 'condition' => [
- 'ekit_img_accordion_enable_button' => 'yes',
- ],
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_enable_pupup',
- [
- 'label' => esc_html__( 'Enable Popup', 'elementskit-lite' ),
- 'type' => Controls_Manager::SWITCHER,
- 'label_on' => esc_html__( 'Yes', 'elementskit-lite' ),
- 'label_off' => esc_html__( 'No', 'elementskit-lite' ),
- 'return_value' => 'yes',
- 'default' => '',
- 'separator' => 'before',
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_pup_up_icons',
- [
- 'label' => esc_html__('Pupup Icon', 'elementskit-lite'),
- 'type' => Controls_Manager::ICONS,
- 'fa4compatibility' => 'ekit_img_accordion_pup_up_icon',
- 'default' => [
- 'value' => 'icon icon-plus',
- 'library' => 'ekiticons'
- ],
- 'label_block' => true,
- 'condition' => [
- 'ekit_img_accordion_enable_pupup' => 'yes'
- ]
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_enable_project_link',
- [
- 'label' => esc_html__( 'Enable Project Link', 'elementskit-lite' ),
- 'type' => Controls_Manager::SWITCHER,
- 'label_on' => esc_html__( 'Yes', 'elementskit-lite' ),
- 'label_off' => esc_html__( 'No', 'elementskit-lite' ),
- 'return_value' => 'yes',
- 'separator' => 'before',
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_project_link',
- [
- 'label' => esc_html__( 'Project Link', 'elementskit-lite' ),
- 'type' => Controls_Manager::URL,
- 'dynamic' => [
- 'active' => true,
- ],
- 'placeholder' => esc_html__( 'https://wpmet.com', 'elementskit-lite' ),
- 'condition' => [
- 'ekit_img_accordion_enable_project_link' => 'yes'
- ],
- ]
- );
- $repeater->add_control(
- 'ekit_img_accordion_project_link_icons',
- [
- 'label' => esc_html__('Project Link Icon', 'elementskit-lite'),
- 'type' => Controls_Manager::ICONS,
- 'fa4compatibility' => 'ekit_img_accordion_project_link_icon',
- 'default' => [
- 'value' => 'icon icon icon-link',
- 'library' => 'ekiticons'
- ],
- 'label_block' => true,
- 'condition' => [
- 'ekit_img_accordion_enable_project_link' => 'yes'
- ],
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_items',
- [
- 'label' => esc_html__('Accordion Items', 'elementskit-lite'),
- 'type' => Controls_Manager::REPEATER,
- 'default' => [
- [ 'ekit_img_accordion_title' => esc_html__('This is title','elementskit-lite') ],
- [ 'ekit_img_accordion_icon' => esc_attr('icon icon-minus') ],
- [ 'ekit_img_accordion_link' => esc_url('#') ],
- [ 'ekit_img_accordion_button_label' => esc_html__('Read More','elementskit-lite') ],
- ],
- 'fields' => $repeater->get_controls(),
- 'title_field' => '{{ ekit_img_accordion_title }}',
- ]
- );
- $this->add_responsive_control(
- 'items_style',
- [
- 'label' => esc_html__('Style', 'elementskit-lite'),
- 'type' => Controls_Manager::SELECT,
- 'options' => [
- '' => esc_html__('Default', 'elementskit-lite'),
- 'horizontal' => esc_html__('Horizontal', 'elementskit-lite'),
- 'vertical' => esc_html__('Vertical', 'elementskit-lite'),
- ],
- 'default' => 'horizontal',
- 'prefix_class' => 'ekit-image-accordion%s-',
- ]
- );
- $this->add_control(
- 'active_behavior',
- [
- 'label' => esc_html__('Active Behaivor', 'elementskit-lite'),
- 'type' => Controls_Manager::SELECT,
- 'options' => [
- 'click' => esc_html__('Click', 'elementskit-lite'),
- 'hover' => esc_html__('Hover', 'elementskit-lite'),
- ],
- 'default' => 'click',
- 'prefix_class' => 'ekit-image-accordion-',
- ]
- );
- $this->end_controls_section();
- /** Tab Style (Image accordion General Style) */
- $this->start_controls_section(
- 'ekit_img_accordion_general_settings',
- [
- 'label' => esc_html__( 'General', 'elementskit-lite' ),
- 'tab' => Controls_Manager::TAB_STYLE
- ]
- );
- $this->add_responsive_control(
- 'ekit_img_accordion_min_height',
- [
- 'label' => esc_html__( 'Min Height', 'elementskit-lite' ),
- 'type' => Controls_Manager::SLIDER,
- 'size_units' => [ 'px' ],
- 'range' => [
- 'px' => [
- 'min' => 0,
- 'max' => 1000,
- ],
- ],
- 'default' => [
- 'unit' => 'px',
- 'size' => 460,
- ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-single-image-accordion' => 'min-height: {{SIZE}}{{UNIT}};',
- '{{WRAPPER}} .elementskit-image-accordion-wraper' => 'height: {{SIZE}}{{UNIT}};',
- ],
- ]
- );
- $this->add_responsive_control(
- 'ekit_img_accordion_gutter',
- [
- 'label' => esc_html__( 'Gutter', 'elementskit-lite' ),
- 'type' => Controls_Manager::SLIDER,
- 'range' => [
- 'px' => [
- 'min' => 0,
- 'max' => 100,
- ],
- ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-image-accordion-wraper .elementskit-single-image-accordion' => 'margin-left: {{SIZE}}{{UNIT}}; margin-right: {{SIZE}}{{UNIT}};',
- '{{WRAPPER}} .elementskit-image-accordion-wraper' => 'margin-left: -{{SIZE}}{{UNIT}}; margin-right: -{{SIZE}}{{UNIT}};',
- ],
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_active_background_text',
- [
- 'label' => esc_html__( 'Active Item Background', 'elementskit-lite' ),
- 'type' => Controls_Manager::HEADING,
- 'separator' => 'before'
- ]
- );
- $this->add_group_control(
- Group_Control_Background::get_type(),
- array(
- 'name' => 'ekit_img_accordion_bg_active_color',
- 'selector' => '{{WRAPPER}} .elementskit-single-image-accordion:before',
- )
- );
- $this->add_responsive_control(
- 'ekit_img_accordion_container_padding',
- [
- 'label' => esc_html__( 'Padding', 'elementskit-lite' ),
- 'type' => Controls_Manager::DIMENSIONS,
- 'size_units' => [ 'px', 'em', '%' ],
- 'separator' => 'before',
- 'selectors' => [
- '{{WRAPPER}} .elementskit-image-accordion-wraper' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
- ],
- ]
- );
- $this->add_responsive_control(
- 'ekit_img_accordion_container_margin',
- [
- 'label' => esc_html__( 'Margin', 'elementskit-lite' ),
- 'type' => Controls_Manager::DIMENSIONS,
- 'size_units' => [ 'px', 'em', '%' ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-image-accordion-wraper' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
- ],
- ]
- );
- $this->add_group_control(
- Group_Control_Border::get_type(),
- [
- 'name' => 'ekit_img_accordion_border_group',
- 'label' => esc_html__( 'Border', 'elementskit-lite' ),
- 'selector' => '{{WRAPPER}} .elementskit-image-accordion-wraper',
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_border_radius',
- [
- 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
- 'type' => Controls_Manager::SLIDER,
- 'range' => [
- 'px' => [
- 'max' => 500,
- ],
- ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-image-accordion-wraper' => 'border-radius: {{SIZE}}px;',
- ],
- ]
- );
- $this->add_group_control(
- Group_Control_Box_Shadow::get_type(),
- [
- 'name' => 'ekit_img_accordion_shadow',
- 'selector' => '{{WRAPPER}} .elementskit-image-accordion-wraper',
- ]
- );
- $this->end_controls_section();
- /** Tab Style (Image accordion Content Style) */
- $this->start_controls_section(
- 'ekit_img_accordion_section_img_accordion_title_settings',
- [
- 'label' => esc_html__( 'Title', 'elementskit-lite' ),
- 'tab' => Controls_Manager::TAB_STYLE
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_section_img_accordion_icon_title',
- [
- 'label' => esc_html_x( 'Margin', 'Border Control', 'elementskit-lite' ),
- 'type' => Controls_Manager::DIMENSIONS,
- 'default' => [
- 'top' => '0',
- 'bottom' => '20',
- 'left' => '0',
- 'right' => '0',
- 'unit' => 'px',
- ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-single-image-accordion .elementskit-accordion-title-wraper' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
- ],
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_section_img_accordion_title_icon_spacing',
- [
- 'label' => esc_html_x( 'Title Icon Spacing', 'Border Control', 'elementskit-lite' ),
- 'type' => Controls_Manager::DIMENSIONS,
- 'selectors' => [
- '{{WRAPPER}} .elementskit-single-image-accordion .elementskit-accordion-title-wraper .icon-title > i, {{WRAPPER}} .elementskit-single-image-accordion .elementskit-accordion-title-wraper .icon-title > svg' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
- ],
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_title_color',
- [
- 'label' => esc_html__( 'Color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'default' => '#fff',
- 'selectors' => [
- '{{WRAPPER}} .elementskit-image-accordion-wraper .elementskit-accordion-title-wraper .elementskit-accordion-title ' => 'color: {{VALUE}};',
- '{{WRAPPER}} .elementskit-image-accordion-wraper .elementskit-accordion-title-wraper .elementskit-accordion-title svg path' => 'stroke: {{VALUE}}; fill: {{VALUE}};',
- ],
- ]
- );
- $this->add_responsive_control(
- 'ekit_img_accordion_title_icon_size',
- [
- 'label' => esc_html__( 'Icon Size', 'elementskit-lite' ),
- 'type' => Controls_Manager::SLIDER,
- 'size_units' => [ 'px', '%' ],
- 'range' => [
- 'px' => [
- 'min' => 1,
- 'max' => 100,
- 'step' => 5,
- ],
- '%' => [
- 'min' => 1,
- 'max' => 100,
- ],
- ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-image-accordion-wraper .elementskit-accordion-title-wraper .elementskit-accordion-title i' => 'font-size: {{SIZE}}{{UNIT}};',
- '{{WRAPPER}} .elementskit-image-accordion-wraper .elementskit-accordion-title-wraper .elementskit-accordion-title svg' => 'max-width: {{SIZE}}{{UNIT}}; height: auto',
- ],
- ]
- );
- $this->add_group_control(
- Group_Control_Typography::get_type(),
- [
- 'name' => 'ekit_img_accordion_title_typography_group',
- 'selector' => '{{WRAPPER}} .elementskit-image-accordion-wraper .elementskit-accordion-title-wraper .elementskit-accordion-title',
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_sub_title_color',
- [
- 'label' => esc_html__( 'Subtitle Color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'selectors' => [
- '{{WRAPPER}} #bashar-elementskit-accordion-title.elementskit-accordion-title.bashar-elementskit-accordion-title' => 'color: {{VALUE}};',
- ],
- ]
- );
- $this->add_group_control(
- Group_Control_Typography::get_type(),
- [
- 'name' => 'ekit_img_accordion_sub_title_typography_group',
- 'label' => esc_html__( 'Subtitle Typography', 'elementskit-lite' ),
- 'selector' => '{{WRAPPER}} #bashar-elementskit-accordion-title.elementskit-accordion-title.bashar-elementskit-accordion-title',
- ]
- );
- $this->end_controls_section();
- /** Tab Style (Image accordion Content Style) */
- $this->start_controls_section(
- 'ekit_img_accordion_section_img_accordion_content_settings',
- [
- 'label' => esc_html__( 'Content', 'elementskit-lite' ),
- 'tab' => Controls_Manager::TAB_STYLE
- ]
- );
- $this->add_responsive_control(
- 'ekit_img_accordion_section_img_accordion_content_align',
- [
- 'label' =>esc_html__( 'Alignment', 'elementskit-lite' ),
- 'type' => Controls_Manager::CHOOSE,
- 'options' => [
- 'left' => [
- 'title' =>esc_html__( 'Left', 'elementskit-lite' ),
- 'icon' => 'eicon-text-align-left',
- ],
- 'center' => [
- 'title' =>esc_html__( 'Center', 'elementskit-lite' ),
- 'icon' => 'eicon-text-align-center',
- ],
- 'right' => [
- 'title' =>esc_html__( 'Right', 'elementskit-lite' ),
- 'icon' => 'eicon-text-align-right',
- ],
- ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-single-image-accordion .elementskit-accordion-content' => 'text-align: {{VALUE}};'
- ],
- 'default' => 'center',
- ]
- );
- $this->add_responsive_control(
- 'ekit_img_accordion_section_img_accordion_content_padding',
- [
- 'label' =>esc_html__( 'Padding', 'elementskit-lite' ),
- 'type' => Controls_Manager::DIMENSIONS,
- 'size_units' => [ 'px', 'em', '%' ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-single-image-accordion .elementskit-accordion-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
- ],
- ]
- );
- $this->add_responsive_control(
- 'ekit_img_accordion_section_img_accordion_content_position',
- [
- 'label' => esc_html__( 'Vertical Position', 'elementskit-lite' ),
- 'type' => Controls_Manager::CHOOSE,
- 'label_block' => false,
- 'options' => [
- 'flex-start' => [
- 'title' => esc_html__( 'Top', 'elementskit-lite' ),
- 'icon' => 'eicon-v-align-top',
- ],
- 'center' => [
- 'title' => esc_html__( 'Center', 'elementskit-lite' ),
- 'icon' => 'eicon-v-align-middle',
- ],
- 'flex-end' => [
- 'title' => esc_html__( 'Bottom', 'elementskit-lite' ),
- 'icon' => 'eicon-v-align-bottom',
- ],
- ],
- 'default' => 'center',
- 'selectors' => [
- '{{WRAPPER}} .elementskit-image-accordion-wraper .elementskit-single-image-accordion' => 'align-items: {{VALUE}}',
- ],
- ]
- );
- $this->end_controls_section();
- // Button
- $this->start_controls_section(
- 'ekit_img_accordion_button_style_settings',
- [
- 'label' => esc_html__( 'Button', 'elementskit-lite' ),
- 'tab' => Controls_Manager::TAB_STYLE,
- ]
- );
- $this->add_responsive_control(
- 'ekit_img_accordion_button_icon_size',
- [
- 'label' => esc_html__( 'Icon Size', 'elementskit-lite' ),
- 'type' => Controls_Manager::SLIDER,
- 'size_units' => ['px'],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-accordion-content a.bashar-elements-kits-btn-icon svg' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};',
- '{{WRAPPER}} .elementskit-accordion-content a.bashar-elements-kits-btn-icon i' => 'font-size: {{SIZE}}{{UNIT}}',
- ],
- ]
- );
- $this->add_responsive_control(
- 'ekit_img_accordion_text_padding',
- [
- 'label' =>esc_html__( 'Padding', 'elementskit-lite' ),
- 'type' => Controls_Manager::DIMENSIONS,
- 'size_units' => [ 'px', 'em', '%' ],
- 'default' => [
- 'top' => 15,
- 'right' => 20,
- 'bottom' => 15,
- 'left' => 20,
- 'unit' => 'px',
- 'isLinked' => true,
- ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-accordion-content .elementskit-btn' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
- ],
- ]
- );
- $this->add_group_control(
- Group_Control_Typography::get_type(),
- [
- 'name' => 'ekit_img_accordion_btn_typography',
- 'label' =>esc_html__( 'Typography', 'elementskit-lite' ),
- 'selector' => '{{WRAPPER}} .elementskit-accordion-content .elementskit-btn',
- ]
- );
- $this->start_controls_tabs( 'ekit_img_accordion_tabs_button_style' );
- $this->start_controls_tab(
- 'ekit_img_accordion_tab_button_normal',
- [
- 'label' =>esc_html__( 'Normal', 'elementskit-lite' ),
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_button_icon_color',
- [
- 'label' => esc_html__( 'Icon Color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'default' => '',
- 'selectors' => [
- '{{WRAPPER}} .elementskit-accordion-content a.bashar-elements-kits-btn-icon svg *' => 'stroke: {{VALUE}}; fill: {{VALUE}};',
- '{{WRAPPER}} .elementskit-accordion-content a.bashar-elements-kits-btn-icon i' => 'color: {{VALUE}}',
- ],
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_btn_text_color',
- [
- 'label' =>esc_html__( 'Text Color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'default' => '#ffffff',
- 'selectors' => [
- '{{WRAPPER}} .elementskit-accordion-content .elementskit-btn' => 'color: {{VALUE}};',
- ],
- ]
- );
- $this->add_group_control(
- Group_Control_Background::get_type(),
- array(
- 'name' => 'ekit_img_accordion_btn_bg_color_group',
- 'label' => esc_html__( 'Background', 'elementskit-lite' ),
- 'selector' => '{{WRAPPER}} .elementskit-accordion-content .elementskit-btn',
- 'fields_options' => [
- 'background' => [
- 'color' => [
- 'default' => '#fff'
- ],
- ],
- ],
- )
- );
- $this->add_control(
- 'ekit_img_accordion_btn_border_color',
- [
- 'label' => esc_html__( 'Border', 'elementskit-lite' ),
- 'type' => Controls_Manager::HEADING,
- 'separator' => 'before',
- ]
- );
- $this->add_group_control(
- Group_Control_Border::get_type(),
- [
- 'name' => 'ekit_img_accordion_btn_border_group',
- 'label' => esc_html__( 'Border', 'elementskit-lite' ),
- 'selector' => '{{WRAPPER}} .elementskit-accordion-content .elementskit-btn',
- 'fields_options' => [
- 'border' => [
- 'default' => 'solid',
- ],
- 'width' => [
- 'default' => [
- 'top' => '1',
- 'right' => '1',
- 'bottom' => '1',
- 'left' => '1',
- 'unit' => 'px'
- ],
- ],
- 'color' => [
- 'default' => '#ffffff',
- ],
- ],
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_btn_border_radius',
- [
- 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
- 'type' => Controls_Manager::DIMENSIONS,
- 'size_units' => [ 'px', '%' ],
- 'default' => ['top' => '5', 'bottom' => '5', 'left' => '5', 'right' => '5', 'unit' => 'px'],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-accordion-content .elementskit-btn' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
- ],
- ]
- );
- $this->end_controls_tab();
- $this->start_controls_tab(
- 'ekit_img_accordion_btn_tab_button_hover',
- [
- 'label' =>esc_html__( 'Hover', 'elementskit-lite' ),
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_button_icon_hover_color',
- [
- 'label' => esc_html__( 'Icon Color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'default' => '',
- 'selectors' => [
- '{{WRAPPER}} .elementskit-accordion-content:hover a.bashar-elements-kits-btn-icon svg *' => 'stroke: {{VALUE}}; fill: {{VALUE}};',
- '{{WRAPPER}} .elementskit-accordion-content:hover a.bashar-elements-kits-btn-icon i' => 'color: {{VALUE}}',
- ],
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_btn_hover_color',
- [
- 'label' =>esc_html__( 'Text Color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'default' => '#fff',
- 'selectors' => [
- '{{WRAPPER}} .elementskit-accordion-content .elementskit-btn:hover' => 'color: {{VALUE}};',
- ],
- ]
- );
- $this->add_group_control(
- Group_Control_Background::get_type(),
- array(
- 'name' => 'ekit_img_accordion_btn_bg_hover_color_group',
- 'selector' => '{{WRAPPER}} .elementskit-accordion-content .elementskit-btn:hover',
- )
- );
- $this->add_control(
- 'ekit_img_accordion_btn_border_color_hover',
- [
- 'label' => esc_html__( 'Border', 'elementskit-lite' ),
- 'type' => Controls_Manager::HEADING,
- 'separator' => 'before',
- ]
- );
- $this->add_group_control(
- Group_Control_Border::get_type(),
- [
- 'name' => 'ekit_img_accordion_btn_border_hover_group',
- 'label' => esc_html__( 'Border', 'elementskit-lite' ),
- 'selector' => '{{WRAPPER}} .elementskit-accordion-content .elementskit-btn:hover',
- ]
- );
- $this->add_control(
- 'btn_border_radius_hover',
- [
- 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
- 'type' => Controls_Manager::DIMENSIONS,
- 'size_units' => [ 'px', '%' ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-accordion-content .elementskit-btn:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
- ],
- ]
- );
- $this->end_controls_tab();
- $this->end_controls_tabs();
- $this->end_controls_section();
- // PopUp
- $this->start_controls_section(
- 'ekit_img_accordion_style_section',
- [
- 'label' => esc_html__( 'Action Icon', 'elementskit-lite' ),
- 'tab' => Controls_Manager::TAB_STYLE,
- ]
- );
- $this->add_control(
- 'actions_width',
- [
- 'label' => esc_html__( 'Width', 'elementskit-lite' ),
- 'type' => Controls_Manager::SLIDER,
- 'selectors' => [
- '{{WRAPPER}} .ekit-image-accordion-actions > a' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
- ]
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_section_img_accordion_icon_left_spacing',
- [
- 'label' => esc_html__( 'Icon Left Spacing', 'elementskit-lite' ),
- 'type' => Controls_Manager::SLIDER,
- 'range' => [
- 'px' => [
- 'min' => 0,
- 'max' => 100,
- ],
- ],
- 'selectors' => [
- '{{WRAPPER}} .elementskit-single-image-accordion .elementskit-icon-wraper > a:not(:last-child)' => 'margin-right: {{SIZE}}px',
- ],
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_section_img_accordion_icon_spacing',
- [
- 'label' => esc_html_x( 'Icon Container Spacing', 'Border Control', 'elementskit-lite' ),
- 'type' => Controls_Manager::DIMENSIONS,
- 'selectors' => [
- '{{WRAPPER}} .elementskit-single-image-accordion .elementskit-icon-wraper' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
- ],
- ]
- );
- $this->add_control(
- 'actions_border_width',
- [
- 'label' => esc_html__( 'Border Width', 'elementskit-lite' ),
- 'type' => Controls_Manager::NUMBER,
- 'placeholder' => '1',
- 'selectors' => [
- '{{WRAPPER}} .ekit-image-accordion-actions > a' => 'border-width: {{VALUE}}px;',
- ],
- ]
- );
- $this->start_controls_tabs('ekit_img_accordion_pup_up_style_tabs');
- $this->start_controls_tab(
- 'ekit_img_accordion_pupup_normal_tab',
- [
- 'label' => esc_html__( 'Normal', 'elementskit-lite' ),
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_pup_up_icon_color',
- [
- 'label' => esc_html__( 'Popup Icon Color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'selectors' => [
- '{{WRAPPER}} .elementskit-icon-wraper a:first-child' => 'color: {{VALUE}};',
- '{{WRAPPER}} .elementskit-icon-wraper a:first-child svg path' => 'fill: {{VALUE}};',
- ],
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_pup_up_project_color',
- [
- 'label' => esc_html__( 'Link Icon Color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'selectors' => [
- '{{WRAPPER}} .elementskit-icon-wraper a:last-child' => 'color: {{VALUE}};',
- '{{WRAPPER}} .elementskit-icon-wraper a:last-child svg path' => 'fill: {{VALUE}};',
- ],
- ]
- );
- $this->add_control(
- 'action_btn_bg',
- [
- 'label' => esc_html__( 'Background Color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'selectors' => [
- '{{WRAPPER}} .ekit-image-accordion-actions > a' => 'background-color: {{VALUE}}; border-color: {{VALUE}};',
- ],
- ]
- );
- $this->end_controls_tab();
- $this->start_controls_tab(
- 'ekit_img_accordion_pup_up_hover_tab',
- [
- 'label' => esc_html__( 'Hover', 'elementskit-lite' ),
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_pup_up_icon_color_hover',
- [
- 'label' => esc_html__( 'Popup Icon color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'selectors' => [
- '{{WRAPPER}} .elementskit-icon-wraper a:first-child:hover' => 'color: {{VALUE}}',
- '{{WRAPPER}} .elementskit-icon-wraper a:first-child:hover svg path' => 'fill: {{VALUE}};',
- ],
- ]
- );
- $this->add_control(
- 'ekit_img_accordion_pup_up_project_color_hover',
- [
- 'label' => esc_html__( 'Link Icon color', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'selectors' => [
- '{{WRAPPER}} .elementskit-icon-wraper a:last-child:hover' => 'color: {{VALUE}};',
- '{{WRAPPER}} .elementskit-icon-wraper a:last-child:hover svg path' => 'fill: {{VALUE}};',
- ],
- ]
- );
- $this->add_control(
- 'action_btn_bg_hover',
- [
- 'label' => esc_html__( 'Background Color (Hover)', 'elementskit-lite' ),
- 'type' => Controls_Manager::COLOR,
- 'selectors' => [
- '{{WRAPPER}} .ekit-image-accordion-actions > a:hover' => 'background-color: {{VALUE}}; border-color: {{VALUE}};',
- ],
- ]
- );
- $this->end_controls_tab();
- $this->end_controls_tabs();
- $this->end_controls_section();
- $this->insert_pro_message();
- }
- protected function render( ) {
- echo '<div class="ekit-wid-con" >';
- $this->render_raw();
- echo '</div>';
- }
- protected function render_raw( ) {
- $settings = $this->get_settings_for_display();
- extract($settings);
- ?>
- <div class="ekit-image-accordion elementskit-image-accordion-wraper">
- <?php foreach ( $ekit_img_accordion_items as $key => $item ) :
- $this->add_render_attribute( 'wrap-input-' . $key,[
- 'type' => 'radio',
- 'name' => 'ekit_ia_' . $this->get_id(),
- 'id' => 'ekit_ia_' . $this->get_id() .'_'. $key,
- 'class' => 'elementskit-single-image-accordion--input',
- ] );
- if($item['ekit_img_accordion_active'] == 'yes') {
- $this->add_render_attribute( 'wrap-input-' . $key, 'checked', 'checked' );
- }
- $this->add_render_attribute( 'wrap-link-' . $key, [
- 'for' => 'ekit_ia_' . $this->get_id() .'_'. $key,
- 'class' => 'elementskit-single-image-accordion ekit-image-accordion-item',
- 'style' => 'background-image: url('.esc_url($item['ekit_img_accordion_bg']['url']).')',
- ] );
- // enabling wrap link
- if(isset($item['ekit_img_accordion_enable_wrap_link']) && $item['ekit_img_accordion_enable_wrap_link'] == 'yes') {
- $wrap_link = $item['ekit_img_accordion_wrap_link_url'] ?? [];
- $wrap_link['url'] = !empty($wrap_link['url']) ? esc_url($wrap_link['url']) : '';
- $this->add_render_attribute( 'wrap-link-' . $key, 'data-link', wp_json_encode($wrap_link) );
- $this->add_render_attribute( 'wrap-link-' . $key, 'data-behavior', $active_behavior );
- $this->add_render_attribute( 'wrap-link-' . $key, 'data-active', $item['ekit_img_accordion_active'] );
- }
- ?>
- <input <?php $this->print_render_attribute_string( 'wrap-input-' . $key ); ?> hidden>
- <label <?php $this->print_render_attribute_string( 'wrap-link-' . $key ); ?>>
- <span class="elementskit-accordion-content">
- <?php if($item['ekit_img_accordion_enable_pupup'] == 'yes' || $item['ekit_img_accordion_enable_project_link'] == 'yes') {
- if (!empty($item['ekit_img_accordion_project_link']['url'])) {
- $this->add_link_attributes( 'projectlink', $item['ekit_img_accordion_project_link'] );
- }
- ?>
- <span class="elementskit-icon-wraper ekit-image-accordion-actions">
- <?php if($item['ekit_img_accordion_enable_pupup'] == 'yes') {
- $this->add_lightbox_data_attributes( 'link' . $key,
- $item['ekit_img_accordion_bg']['id'],
- $item['ekit_img_accordion_enable_pupup'],
- $this->get_id()
- );
- $this->add_render_attribute( 'link' . $key,
- [
- 'href' => esc_url($item['ekit_img_accordion_bg']['url']),
- 'aria-label' => "pupup-button",
- 'class' => "icon-outline circle",
- ]
- );
- ?>
- <a <?php $this->print_render_attribute_string( 'link' . $key ); ?>>
- <?php
- $migrated = isset( $item['__fa4_migrated']['ekit_img_accordion_pup_up_icons'] );
- // Check if its a new widget without previously selected icon using the old Icon control
- $is_new = empty( $item['ekit_img_accordion_pup_up_icon'] );
- if ( $is_new || $migrated ) {
- // new icon
- Icons_Manager::render_icon( $item['ekit_img_accordion_pup_up_icons'], [ 'aria-hidden' => 'true'] );
- } else {
- ?>
- <i class="<?php echo esc_attr($item['ekit_img_accordion_pup_up_icon']); ?>" aria-hidden="true"></i>
- <?php
- }
- ?>
- </a>
- <?php } ?>
- <?php if($item['ekit_img_accordion_enable_project_link'] == 'yes') {
- if ( ! empty( $item['ekit_img_accordion_project_link']['url'] ) ) {
- $this->add_link_attributes( 'button-2' . $key, $item['ekit_img_accordion_project_link'] );
- $this->add_render_attribute( 'button-2' . $key, ['role' => "link", 'aria-label' => "button-link"] );
- }
- ?>
- <a <?php $this->print_render_attribute_string( 'button-2' . esc_attr($key) ); ?> class="icon-outline circle">
- <?php
- $migrated = isset( $item['__fa4_migrated']['ekit_img_accordion_project_link_icons'] );
- // Check if its a new widget without previously selected icon using the old Icon control
- $is_new = empty( $item['ekit_img_accordion_project_link_icon'] );
- if ( $is_new || $migrated ) {
- // new icon
- Icons_Manager::render_icon( $item['ekit_img_accordion_project_link_icons'], [ 'aria-hidden' => 'true'] );
- } else {
- ?>
- <i class="<?php echo esc_attr($item['ekit_img_accordion_project_link_icon']); ?>" aria-hidden="true"></i>
- <?php
- }
- ?>
- </a>
- <?php } ?>
- </span>
- <?php } ?>
- <span class="elementskit-accordion-title-wraper">
- <span class="elementskit-accordion-title <?php echo esc_attr($item['ekit_img_accordion_title_icons'] != '') ? 'icon-title' : ''?>">
- <?php if($item['ekit_img_accordion_enable_icon'] == 'yes'): ?>
- <?php if($item['ekit_img_accordion_title_icon_position'] == 'left'): ?>
- <!-- same-1 -->
- <?php
- $migrated = isset( $item['__fa4_migrated']['ekit_img_accordion_title_icons'] );
- // Check if its a new widget without previously selected icon using the old Icon control
- $is_new = empty( $item['ekit_img_accordion_title_icon'] );
- if ( $is_new || $migrated ) {
- // new icon
- Icons_Manager::render_icon( $item['ekit_img_accordion_title_icons'], [ 'aria-hidden' => 'true'] );
- } else {
- ?>
- <i class="<?php echo esc_attr($item['ekit_img_accordion_title_icon']); ?>" aria-hidden="true"></i>
- <?php
- }
- ?>
- <?php endif; ?>
- <?php endif; ?>
- <?php echo esc_html($item['ekit_img_accordion_title']); ?>
- <?php if($item['ekit_img_accordion_enable_icon'] == 'yes'): ?>
- <?php if($item['ekit_img_accordion_title_icon_position'] == 'right'): ?>
- <!-- same-1 -->
- <?php
- $migrated = isset( $item['__fa4_migrated']['ekit_img_accordion_title_icons'] );
- // Check if its a new widget without previously selected icon using the old Icon control
- $is_new = empty( $item['ekit_img_accordion_title_icon'] );
- if ( $is_new || $migrated ) {
- // new icon
- Icons_Manager::render_icon( $item['ekit_img_accordion_title_icons'], [ 'aria-hidden' => 'true'] );
- } else {
- ?>
- <i class="<?php echo esc_attr($item['ekit_img_accordion_title_icon']); ?>" aria-hidden="true"></i>
- <?php
- }
- ?>
- <?php endif; ?>
- <?php endif; ?>
- </span>
- <span class="elementskit-accordion-title bashar-elementskit-accordion-title" id="bashar-elementskit-accordion-title">
- <?php echo esc_html($item['ekit_img_accordion_subtitle']); ?>
- </span>
- </span>
- <?php if($item['ekit_img_accordion_enable_button'] == 'yes') :
- if ( ! empty( $item['ekit_img_accordion_button_url']['url'] ) ) {
- $this->add_link_attributes( 'button-' . $key, $item['ekit_img_accordion_button_url'] );
- }
- ?>
- <span class="elementskit-btn-wraper">
- <a class="ekit-image-accordion--btn elementskit-btn whitespace--normal bashar-elements-kits-btn-icon" <?php $this->print_render_attribute_string( 'button-' . esc_attr($key) ); ?>>
- <?php \Elementor\Icons_Manager::render_icon( $item['ekit_img_accordion_button_icon'], [ 'aria-hidden' => 'true' ] ); ?>
- <?php echo esc_html($item['ekit_img_accordion_button_label']); ?>
- </a>
- </span>
- <?php endif; ?>
- </span>
- </label>
- <?php endforeach; ?>
- </div>
- <?php }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement