Ubuntu

start_controls_section( 'section_buton', [ 'label' => __( 'Divider', 'essential-addons-elementor' ), ] ); $this->add_control( 'divider_type', [ 'label' => esc_html__( 'Type', 'essential-addons-elementor' ), 'type' => Controls_Manager::CHOOSE, 'label_block' => false, 'options' => [ 'plain' => [ 'title' => esc_html__( 'Plain', 'essential-addons-elementor' ), 'icon' => 'fa fa-ellipsis-h', ], 'text' => [ 'title' => esc_html__( 'Text', 'essential-addons-elementor' ), 'icon' => 'fa fa-file-text-o', ], 'icon' => [ 'title' => esc_html__( 'Icon', 'essential-addons-elementor' ), 'icon' => 'fa fa-certificate', ], 'image' => [ 'title' => esc_html__( 'Image', 'essential-addons-elementor' ), 'icon' => 'fa fa-picture-o', ], ], 'default' => 'plain', ] ); $this->add_control( 'divider_direction', [ 'label' => __( 'Direction', 'essential-addons-elementor' ), 'type' => Controls_Manager::SELECT, 'default' => 'horizontal', 'options' => [ 'horizontal' => __( 'Horizontal', 'essential-addons-elementor' ), 'vertical' => __( 'Vertical', 'essential-addons-elementor' ), ], 'condition' => [ // 'divider_type' => 'plain', ], ] ); $this->add_control( 'divider_text', [ 'label' => __( 'Text', 'essential-addons-elementor' ), 'type' => Controls_Manager::TEXT, 'default' => __( 'Divider Text', 'essential-addons-elementor' ), 'condition' => [ 'divider_type' => 'text', ], ] ); $this->add_control( 'divider_icon_new', [ 'label' => __( 'Icon', 'essential-addons-elementor' ), 'type' => Controls_Manager::ICONS, 'fa4compatibility' => 'divider_icon', 'default' => [ 'value' => 'fas fa-circle', 'library' => 'fa-solid', ], 'condition' => [ 'divider_type' => 'icon', ], ] ); $this->add_control( 'text_html_tag', [ 'label' => __( 'HTML Tag', 'essential-addons-elementor' ), 'type' => Controls_Manager::SELECT, 'default' => 'span', 'options' => [ 'h1' => __( 'H1', 'essential-addons-elementor' ), 'h2' => __( 'H2', 'essential-addons-elementor' ), 'h3' => __( 'H3', 'essential-addons-elementor' ), 'h4' => __( 'H4', 'essential-addons-elementor' ), 'h5' => __( 'H5', 'essential-addons-elementor' ), 'h6' => __( 'H6', 'essential-addons-elementor' ), 'div' => __( 'div', 'essential-addons-elementor' ), 'span' => __( 'span', 'essential-addons-elementor' ), 'p' => __( 'p', 'essential-addons-elementor' ), ], 'condition' => [ 'divider_type' => 'text', ], ] ); $this->add_control( 'divider_image', [ 'label' => __( 'Image', 'essential-addons-elementor' ), 'type' => Controls_Manager::MEDIA, 'default' => [ 'url' => Utils::get_placeholder_image_src(), ], 'condition' => [ 'divider_type' => 'image', ], ] ); $this->add_responsive_control( 'align', [ 'label' => __( 'Alignment', 'essential-addons-elementor' ), 'type' => Controls_Manager::CHOOSE, 'default' => 'center', 'options' => [ 'left' => [ 'title' => __( 'Left', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-left', ], 'center' => [ 'title' => __( 'Center', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-center', ], 'right' => [ 'title' => __( 'Right', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-right', ], ], 'selectors' => [ '{{WRAPPER}}' => 'text-align: {{VALUE}};', ], ] ); $this->end_controls_section(); /*-----------------------------------------------------------------------------------*/ /* STYLE TAB /*-----------------------------------------------------------------------------------*/ /** * Style Tab: Divider */ $this->start_controls_section( 'section_divider_style', [ 'label' => __( 'Divider', 'essential-addons-elementor' ), 'tab' => Controls_Manager::TAB_STYLE, ] ); $this->add_control( 'divider_vertical_align', [ 'label' => __( 'Vertical Alignment', 'essential-addons-elementor' ), 'type' => Controls_Manager::CHOOSE, 'label_block' => false, 'default' => 'middle', 'options' => [ 'top' => [ 'title' => __( 'Top', 'essential-addons-elementor' ), 'icon' => 'eicon-v-align-top', ], 'middle' => [ 'title' => __( 'Center', 'essential-addons-elementor' ), 'icon' => 'eicon-v-align-middle', ], 'bottom' => [ 'title' => __( 'Bottom', 'essential-addons-elementor' ), 'icon' => 'eicon-v-align-bottom', ], ], 'selectors' => [ '{{WRAPPER}} .divider-text-wrap' => 'align-items: {{VALUE}};', ], 'selectors_dictionary' => [ 'top' => 'flex-start', 'middle' => 'center', 'bottom' => 'flex-end', ], 'condition' => [ 'divider_direction' => 'horizontal', 'divider_type!' => 'plain' ], ] ); $this->add_control( 'divider_style', [ 'label' => __( 'Style', 'essential-addons-elementor' ), 'type' => Controls_Manager::SELECT, 'default' => 'dashed', 'options' => [ 'solid' => __( 'Solid', 'essential-addons-elementor' ), 'dashed' => __( 'Dashed', 'essential-addons-elementor' ), 'dotted' => __( 'Dotted', 'essential-addons-elementor' ), 'double' => __( 'Double', 'essential-addons-elementor' ), ], 'selectors' => [ '{{WRAPPER}} .eael-divider, {{WRAPPER}} .divider-border' => 'border-style: {{VALUE}};', ], ] ); $this->add_responsive_control( 'horizontal_height', [ 'label' => __( 'Height', 'essential-addons-elementor' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%', 'px' ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 60, ], ], 'default' => [ 'size' => 3, 'unit' => 'px', ], 'tablet_default' => [ 'unit' => 'px', ], 'mobile_default' => [ 'unit' => 'px', ], 'selectors' => [ '{{WRAPPER}} .eael-divider.horizontal' => 'border-bottom-width: {{SIZE}}{{UNIT}};', '{{WRAPPER}} .divider-border' => 'border-top-width: {{SIZE}}{{UNIT}};', ], 'condition' => [ 'divider_direction' => 'horizontal', ], ] ); $this->add_responsive_control( 'vertical_height', [ 'label' => __( 'Height', 'essential-addons-elementor' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%', 'px' ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 500, ], ], 'default' => [ 'size' => 80, 'unit' => 'px', ], 'tablet_default' => [ 'unit' => 'px', ], 'mobile_default' => [ 'unit' => 'px', ], 'selectors' => [ '{{WRAPPER}} .eael-divider-wrap.divider-direction-vertical .divider-border' => 'height: {{SIZE}}{{UNIT}};', '{{WRAPPER}} .eael-divider-wrap.divider-direction-vertical .eael-divider.vertical' => 'height: {{SIZE}}{{UNIT}};' ], 'condition' => [ 'divider_direction' => 'vertical', ], ] ); $this->add_responsive_control( 'horizontal_width', [ 'label' => __( 'Width', 'essential-addons-elementor' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%', 'px' ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 1200, ], ], 'default' => [ 'size' => 300, 'unit' => 'px', ], 'tablet_default' => [ 'unit' => 'px', ], 'mobile_default' => [ 'unit' => 'px', ], 'selectors' => [ '{{WRAPPER}} .eael-divider.horizontal' => 'width: {{SIZE}}{{UNIT}};', '{{WRAPPER}} .divider-text-container' => 'width: {{SIZE}}{{UNIT}};', ], 'condition' => [ 'divider_direction' => 'horizontal', ], ] ); $this->add_responsive_control( 'vertical_width', [ 'label' => __( 'Width', 'essential-addons-elementor' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%', 'px' ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 100, ], ], 'default' => [ 'size' => 3, 'unit' => 'px', ], 'tablet_default' => [ 'unit' => 'px', ], 'mobile_default' => [ 'unit' => 'px', ], 'selectors' => [ '{{WRAPPER}} .eael-divider-wrap.divider-direction-vertical .divider-border' => 'border-width: {{SIZE}}{{UNIT}};', '{{WRAPPER}} .eael-divider-wrap.divider-direction-vertical .eael-divider.vertical' => 'border-width: {{SIZE}}{{UNIT}};', ], 'condition' => [ 'divider_direction' => 'vertical', ], ] ); $this->add_control( 'divider_border_color', [ 'label' => __( 'Divider Color', 'essential-addons-elementor' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .eael-divider, {{WRAPPER}} .divider-border' => 'border-color: {{VALUE}};', ], 'condition' => [ 'divider_type' => 'plain', ], ] ); $this->start_controls_tabs( 'tabs_before_after_style' ); $this->start_controls_tab( 'tab_before_style', [ 'label' => __( 'Before', 'essential-addons-elementor' ), 'condition' => [ 'divider_type!' => 'plain', ], ] ); $this->add_control( 'divider_before_color', [ 'label' => __( 'Divider Color', 'essential-addons-elementor' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'condition' => [ 'divider_type!' => 'plain', ], 'selectors' => [ '{{WRAPPER}} .divider-border-left .divider-border' => 'border-color: {{VALUE}};', ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_after_style', [ 'label' => __( 'After', 'essential-addons-elementor' ), 'condition' => [ 'divider_type!' => 'plain', ], ] ); $this->add_control( 'divider_after_color', [ 'label' => __( 'Divider Color', 'essential-addons-elementor' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'condition' => [ 'divider_type!' => 'plain', ], 'selectors' => [ '{{WRAPPER}} .divider-border-right .divider-border' => 'border-color: {{VALUE}};', ], ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); /** * Style Tab: Text */ $this->start_controls_section( 'section_text_style', [ 'label' => __( 'Text', 'essential-addons-elementor' ), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'divider_type' => 'text', ], ] ); $this->add_control( 'text_position', [ 'label' => __( 'Position', 'essential-addons-elementor' ), 'type' => Controls_Manager::CHOOSE, 'options' => [ 'left' => [ 'title' => __( 'Left', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-left', ], 'center' => [ 'title' => __( 'Center', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-center', ], 'right' => [ 'title' => __( 'Right', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-right', ], ], 'default' => 'center', 'prefix_class' => 'eael-divider-' ] ); $this->add_control( 'divider_text_color', [ 'label' => __( 'Color', 'essential-addons-elementor' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'condition' => [ 'divider_type' => 'text', ], 'selectors' => [ '{{WRAPPER}} .eael-divider-text' => 'color: {{VALUE}};', ], ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'typography', 'label' => __( 'Typography', 'essential-addons-elementor' ), 'scheme' => Scheme_Typography::TYPOGRAPHY_4, 'selector' => '{{WRAPPER}} .eael-divider-text', 'condition' => [ 'divider_type' => 'text', ], ] ); $this->add_group_control( Group_Control_Text_Shadow::get_type(), [ 'name' => 'divider_text_shadow', 'selector' => '{{WRAPPER}} .eael-divider-text', ] ); $this->add_responsive_control( 'text_spacing', [ 'label' => __( 'Spacing', 'essential-addons-elementor' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%', 'px' ], 'range' => [ 'px' => [ 'max' => 200, ], ], 'condition' => [ 'divider_type' => 'text', ], 'selectors' => [ '{{WRAPPER}}.eael-divider-center .eael-divider-wrap.divider-direction-horizontal .eael-divider-content' => 'margin-left: {{SIZE}}{{UNIT}}; margin-right: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-left .eael-divider-wrap.divider-direction-horizontal .eael-divider-content' => 'margin-right: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-right .eael-divider-wrap.divider-direction-horizontal .eael-divider-content' => 'margin-left: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-center .eael-divider-wrap.divider-direction-vertical .eael-divider-content' => 'margin-top: {{SIZE}}{{UNIT}}; margin-bottom: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-left .eael-divider-wrap.divider-direction-vertical .eael-divider-content' => 'margin-bottom: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-right .eael-divider-wrap.divider-direction-vertical .eael-divider-content' => 'margin-top: {{SIZE}}{{UNIT}};', ], ] ); $this->end_controls_section(); /** * Style Tab: Icon */ $this->start_controls_section( 'section_icon_style', [ 'label' => __( 'Icon', 'essential-addons-elementor' ), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'divider_type' => 'icon', ], ] ); $this->add_control( 'icon_position', [ 'label' => __( 'Position', 'essential-addons-elementor' ), 'type' => Controls_Manager::CHOOSE, 'options' => [ 'left' => [ 'title' => __( 'Left', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-left', ], 'center' => [ 'title' => __( 'Center', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-center', ], 'right' => [ 'title' => __( 'Right', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-right', ], ], 'default' => 'center', 'prefix_class' => 'eael-divider-' ] ); $this->add_control( 'divider_icon_color', [ 'label' => __( 'Color', 'essential-addons-elementor' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'condition' => [ 'divider_type' => 'icon', ], 'selectors' => [ '{{WRAPPER}} .eael-divider-icon' => 'color: {{VALUE}};', ], ] ); $this->add_responsive_control( 'icon_size', [ 'label' => __( 'Size', 'essential-addons-elementor' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%', 'px' ], 'range' => [ 'px' => [ 'max' => 100, ], ], 'default' => [ 'size' => 16, 'unit' => 'px', ], 'condition' => [ 'divider_type' => 'icon', ], 'selectors' => [ '{{WRAPPER}} .eael-divider-icon' => 'font-size: {{SIZE}}{{UNIT}};', '{{WRAPPER}} .eael-divider-svg-icon' => 'height: {{SIZE}}{{UNIT}};' ], ] ); $this->add_responsive_control( 'icon_rotation', [ 'label' => __( 'Icon Rotation', 'essential-addons-elementor' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%', 'px' ], 'range' => [ 'px' => [ 'max' => 360, ], ], 'default' => [ 'unit' => 'px', ], 'tablet_default' => [ 'unit' => 'px', ], 'mobile_default' => [ 'unit' => 'px', ], 'selectors' => [ '{{WRAPPER}} .eael-divider-icon span' => 'transform: rotate( {{SIZE}}deg );', '{{WRAPPER}} .eael-divider-svg-icon' => 'transform: rotate( {{SIZE}}deg );' ], 'condition' => [ 'divider_type' => 'icon', ], ] ); $this->add_responsive_control( 'icon_spacing', [ 'label' => __( 'Spacing', 'essential-addons-elementor' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%', 'px' ], 'range' => [ 'px' => [ 'max' => 200, ], ], 'condition' => [ 'divider_type' => 'icon', ], 'selectors' => [ '{{WRAPPER}}.eael-divider-center .eael-divider-wrap.divider-direction-horizontal .eael-divider-content' => 'margin-left: {{SIZE}}{{UNIT}}; margin-right: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-left .eael-divider-wrap.divider-direction-horizontal .eael-divider-content' => 'margin-right: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-right .eael-divider-wrap.divider-direction-horizontal .eael-divider-content' => 'margin-left: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-center .eael-divider-wrap.divider-direction-vertical .eael-divider-content' => 'margin-top: {{SIZE}}{{UNIT}}; margin-bottom: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-left .eael-divider-wrap.divider-direction-vertical .eael-divider-content' => 'margin-bottom: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-right .eael-divider-wrap.divider-direction-vertical .eael-divider-content' => 'margin-top: {{SIZE}}{{UNIT}};', ], ] ); $this->end_controls_section(); /** * Style Tab: Image */ $this->start_controls_section( 'section_image_style', [ 'label' => __( 'Image', 'essential-addons-elementor' ), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'divider_type' => 'image', ], ] ); $this->add_control( 'image_position', [ 'label' => __( 'Position', 'essential-addons-elementor' ), 'type' => Controls_Manager::CHOOSE, 'options' => [ 'left' => [ 'title' => __( 'Left', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-left', ], 'center' => [ 'title' => __( 'Center', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-center', ], 'right' => [ 'title' => __( 'Right', 'essential-addons-elementor' ), 'icon' => 'eicon-h-align-right', ], ], 'default' => 'center', 'prefix_class' => 'eael-divider-' ] ); $this->add_responsive_control( 'image_width', [ 'label' => __( 'Width', 'essential-addons-elementor' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%', 'px' ], 'range' => [ 'px' => [ 'max' => 1200, ], ], 'default' => [ 'size' => 80, 'unit' => 'px', ], 'tablet_default' => [ 'unit' => 'px', ], 'mobile_default' => [ 'unit' => 'px', ], 'condition' => [ 'divider_type' => 'image', ], 'selectors' => [ '{{WRAPPER}} .eael-divider-image' => 'width: {{SIZE}}{{UNIT}};', ], ] ); $this->add_control( 'icon_border_radius', [ 'label' => __( 'Border Radius', 'essential-addons-elementor' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'condition' => [ 'divider_type' => 'image', ], 'selectors' => [ '{{WRAPPER}} .eael-divider-image img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_responsive_control( 'image_spacing', [ 'label' => __( 'Spacing', 'essential-addons-elementor' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%', 'px' ], 'range' => [ 'px' => [ 'max' => 200, ], ], 'condition' => [ 'divider_type' => 'image', ], 'selectors' => [ '{{WRAPPER}}.eael-divider-center .eael-divider-wrap.divider-direction-horizontal .eael-divider-content' => 'margin-left: {{SIZE}}{{UNIT}}; margin-right: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-left .eael-divider-wrap.divider-direction-horizontal .eael-divider-content' => 'margin-right: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-right .eael-divider-wrap.divider-direction-horizontal .eael-divider-content' => 'margin-left: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-center .eael-divider-wrap.divider-direction-vertical .eael-divider-content' => 'margin-top: {{SIZE}}{{UNIT}}; margin-bottom: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-left .eael-divider-wrap.divider-direction-vertical .eael-divider-content' => 'margin-bottom: {{SIZE}}{{UNIT}};', '{{WRAPPER}}.eael-divider-right .eael-divider-wrap.divider-direction-vertical .eael-divider-content' => 'margin-top: {{SIZE}}{{UNIT}};', ], ] ); $this->end_controls_section(); } /** * Render divider widget output on the frontend. */ protected function render() { $settings = $this->get_settings(); $icon_migrated = isset($settings['__fa4_migrated']['divider_icon_new']); $icon_is_new = empty($settings['divider_icon']); $this->add_render_attribute( 'divider', 'class', 'eael-divider' ); if ( $settings['divider_direction'] ) { $this->add_render_attribute( 'divider', 'class', $settings['divider_direction'] ); } if ( $settings['divider_style'] ) { $this->add_render_attribute( 'divider', 'class', $settings['divider_style'] ); } $this->add_render_attribute( 'divider-content', 'class', 'eael-divider-' . $settings['divider_type'] ); $this->add_inline_editing_attributes( 'divider_text', 'none' ); $this->add_render_attribute( 'divider_text', 'class', 'eael-divider-' . $settings['divider_type'] ); $this->add_render_attribute( 'divider-wrap', [ 'class' => [ 'eael-divider-wrap', "divider-direction-{$settings['divider_direction']}" ] ] ); ?>

get_render_attribute_string('divider-wrap'); ?>>

get_render_attribute_string( 'divider' ); ?>>

%3$s', $settings['text_html_tag'], $this->get_render_attribute_string( 'divider_text' ), $settings['divider_text'] ); ?> get_render_attribute_string( 'divider-content' ); ?>>

get_render_attribute_string( 'divider-content' ); ?>> <?php echo esc_attr(get_post_meta($settings['divider_image']['id'], '_wp_attachment_image_alt', true)); ?>