trAvis - MANAGER
Edit File: tp_mobile_menu.php
<?php /* Widget Name: Mobile Menu Description: Mobile Menu Author: Theplus Author URI: https://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\Group_Control_Border; use Elementor\Core\Schemes\Typography; use Elementor\Group_Control_Background; use Elementor\Group_Control_Box_Shadow; use TheplusAddons\Theplus_Element_Load; use Elementor\Group_Control_Image_Size; if (!defined('ABSPATH')) exit; // Exit if accessed directly class ThePlus_Mobile_Menu extends Widget_Base { public function get_name() { return 'tp-mobile-menu'; } public function get_title() { return esc_html__('Mobile Menu', 'theplus'); } public function get_icon() { return 'fa fa-mobile theplus_backend_icon'; } public function get_categories() { return array('plus-header'); } protected function _register_controls() { /*mobile menu section start*/ $this->start_controls_section( 'section_advanced_buttons', [ 'label' => esc_html__( 'Mobile Menu', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, ] ); $this->add_control( 'mm_style', [ 'label' => esc_html__( 'Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'style_1', 'options' => [ 'style_1' => esc_html__( 'Style 1', 'theplus' ), 'style_2' => esc_html__( 'Style 2', 'theplus' ), ], ] ); $this->add_control( 'mobile_menu_pos', [ 'label' => esc_html__( 'Position', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'fixed', 'options' => [ 'absolute' => esc_html__( 'Absolute', 'theplus' ), 'fixed' => esc_html__( 'Fixed', 'theplus' ), ], ] ); $this->add_control( 'mobile_menu_pos_po', [ 'label' => esc_html__( 'Fixed Position', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'bottom', 'options' => [ 'top' => esc_html__( 'Top', 'theplus' ), 'bottom' => esc_html__( 'Bottom', 'theplus' ), ], 'condition' => [ 'mobile_menu_pos' => 'fixed', ], ] ); $this->add_control( 'open_mobile_menu', [ 'label' => esc_html__( 'Open Mobile Menu', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 1500, 'step' => 5, ], ], 'separator' => 'before', ] ); $this->end_controls_section(); /*mobile menu section start*/ /*mobile menu 1 for style 1 & 2 section start*/ $this->start_controls_section( 'section_mm_st1', [ 'label' => esc_html__( 'Menu 1', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, ] ); $repeater = new \Elementor\Repeater(); $repeater->add_control( 'mm_st1_icon_image', [ 'label' => esc_html__( 'Select Icon', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'mm_st1_icon', 'options' => [ 'mm_st1_icon' => esc_html__( 'Icon', 'theplus' ), 'mm_st1_image' => esc_html__( 'Image', 'theplus' ), ], ] ); $repeater->add_control( 'mm_st1_custom_icon', [ 'label' => esc_html__( 'Icon', 'theplus' ), 'type' => Controls_Manager::ICONS, 'default' => [ 'value' => 'far fa-calendar-alt', 'library' => 'solid', ], 'condition' => [ 'mm_st1_icon_image' => 'mm_st1_icon', ], ] ); $repeater->add_control( 'mm_st1_custom_image', [ 'label' => esc_html__( 'Image', 'theplus' ), 'type' => Controls_Manager::MEDIA, 'default' => [ 'url' => '', ], 'media_type' => 'image', 'dynamic' => [ 'active' => true, ], 'condition' => [ 'mm_st1_icon_image' => 'mm_st1_image', ], ] ); $repeater->add_group_control( Group_Control_Image_Size::get_type(), [ 'name' => 'mmst1_ci_thumbnail', 'default' => 'full', 'separator' => 'none', 'separator' => 'after', 'condition' => [ 'mm_st1_icon_image' => 'mm_st1_image', ], ] ); $repeater->add_control( 'mm_st1_text', [ 'label' => esc_html__( 'Text', 'theplus' ), 'type' => Controls_Manager::TEXT, 'default' => esc_html__( 'The', 'theplus' ), 'separator' => 'before', 'dynamic' => ['active' => true,], ] ); $repeater->add_control( 'mm_st1_link', [ 'label' => esc_html__( 'Link', 'theplus' ), 'type' => Controls_Manager::URL, 'placeholder' => esc_html__( 'https://your-link.com', 'theplus' ), 'show_external' => true, 'default' => [ 'url' => '', ], 'separator' => 'before', 'dynamic' => [ 'active' => true, ], ] ); $repeater->add_control( 'mm_st1_pin_text', [ 'label' => esc_html__( 'Pin Text', 'theplus' ), 'type' => Controls_Manager::TEXT, 'separator' => 'before', 'dynamic' => ['active' => true,], 'selectors' => [ '{{WRAPPER}} {{CURRENT_ITEM}} .tp-loop-inner:after' => ' content:"{{VALUE}}";', ], ] ); $this->add_control( 'mm_st1_content', [ 'label' => esc_html__( 'Menu 1', 'theplus' ), 'type' => Controls_Manager::REPEATER, 'separator' => 'before', 'default' => [ [ 'mm_st1_text' => '1', ], [ 'mm_st1_text' => '2', ], [ 'mm_st1_text' => '3', ], [ 'mm_st1_text' => '4', ], ], 'fields' => $repeater->get_controls(), 'title_field' => '{{{ mm_st1_text }}}', ] ); $this->end_controls_section(); /*mobile menu 1 for style 1 & 2 section end*/ /*right menu style 2 section start*/ $this->start_controls_section( 'section_mm_st2_r', [ 'label' => esc_html__( 'Menu 2', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, 'condition' => [ 'mm_style' => 'style_2', ], ] ); $repeater = new \Elementor\Repeater(); $repeater->add_control( 'mm_st2_icon_image_r', [ 'label' => esc_html__( 'Select Icon', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'mm_st2_icon_r', 'options' => [ 'mm_st2_icon_r' => esc_html__( 'Icon', 'theplus' ), 'mm_st2_image_r' => esc_html__( 'Image', 'theplus' ), ], ] ); $repeater->add_control( 'mm_st2_custom_icon_r', [ 'label' => esc_html__( 'Icon', 'theplus' ), 'type' => Controls_Manager::ICONS, 'default' => [ 'value' => 'far fa-calendar-alt', 'library' => 'solid', ], 'condition' => [ 'mm_st2_icon_image_r' => 'mm_st2_icon_r', ], ] ); $repeater->add_control( 'mm_st2_custom_image_r', [ 'label' => esc_html__( 'Image', 'theplus' ), 'type' => Controls_Manager::MEDIA, 'default' => [ 'url' => '', ], 'media_type' => 'image', 'dynamic' => [ 'active' => true, ], 'condition' => [ 'mm_st2_icon_image_r' => 'mm_st2_image_r', ], ] ); $repeater->add_group_control( Group_Control_Image_Size::get_type(), [ 'name' => 'mmst2_cir_thumbnail', 'default' => 'full', 'separator' => 'none', 'separator' => 'after', 'condition' => [ 'mm_st2_icon_image_r' => 'mm_st2_image_r', ], ] ); $repeater->add_control( 'mm_st2_text_r', [ 'label' => esc_html__( 'Text', 'theplus' ), 'type' => Controls_Manager::TEXT, 'default' => esc_html__( 'Plus', 'theplus' ), 'separator' => 'before', 'dynamic' => ['active' => true,], ] ); $repeater->add_control( 'mm_st2_link_r', [ 'label' => esc_html__( 'Link', 'theplus' ), 'type' => Controls_Manager::URL, 'placeholder' => esc_html__( 'https://your-link.com', 'theplus' ), 'show_external' => true, 'default' => [ 'url' => '', ], 'separator' => 'before', 'dynamic' => [ 'active' => true, ], ] ); $repeater->add_control( 'mm_st2_pin_text_r', [ 'label' => esc_html__( 'Pin Text', 'theplus' ), 'type' => Controls_Manager::TEXT, 'separator' => 'before', 'dynamic' => ['active' => true,], 'selectors' => [ '{{WRAPPER}} {{CURRENT_ITEM}} .tp-loop-inner:after' => ' content:"{{VALUE}}";', ], ] ); $this->add_control( 'mm_st2_content_r', [ 'label' => esc_html__( 'Menu 2', 'theplus' ), 'type' => Controls_Manager::REPEATER, 'separator' => 'before', 'default' => [ [ 'mm_st2_text_r' => '3', ], [ 'mm_st2_text_r' => '4', ], ], 'fields' => $repeater->get_controls(), 'title_field' => '{{{ mm_st2_text_r }}}', ] ); $this->end_controls_section(); /*right menu style 2 section end*/ /*extra toggle section start*/ $this->start_controls_section( 'section_mm_extra_toggle', [ 'label' => esc_html__( 'Extra Toggle', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, ] ); $this->add_control( 'mm_extra_toggle_switch', [ 'label' => esc_html__( 'Extra Toggle', 'theplus' ), 'type' => \Elementor\Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', ] ); $this->add_control( 'mm_extra_toggle_icon_image', [ 'label' => esc_html__( 'Select Toggle Icon', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'mm_ext_tgl_icon', 'options' => [ 'mm_ext_tgl_icon' => esc_html__( 'Icon', 'theplus' ), 'mm_ext_tgl_image' => esc_html__( 'Image', 'theplus' ), ], 'condition' => [ 'mm_extra_toggle_switch' => 'yes', ], ] ); $this->add_control( 'mm_extra_toggle_custom_icon', [ 'label' => esc_html__( 'Icon', 'theplus' ), 'type' => Controls_Manager::ICONS, 'default' => [ 'value' => 'far fa-calendar-check', 'library' => 'solid', ], 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'mm_extra_toggle_icon_image' => 'mm_ext_tgl_icon', ], ] ); $this->add_control( 'mm_extra_toggle_custom_image', [ 'label' => esc_html__( 'Image', 'theplus' ), 'type' => Controls_Manager::MEDIA, 'default' => [ 'url' => '', ], 'media_type' => 'image', 'dynamic' => [ 'active' => true, ], 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'mm_extra_toggle_icon_image' => 'mm_ext_tgl_image', ], ] ); $this->add_group_control( Group_Control_Image_Size::get_type(), [ 'name' => 'mm_et_ci_thumbnail', 'default' => 'full', 'separator' => 'none', 'separator' => 'after', ] ); $this->add_control( 'mm_extra_toggle_text', [ 'label' => esc_html__( 'Text', 'theplus' ), 'type' => Controls_Manager::TEXT, 'default' => esc_html__( 'TP', 'theplus' ), 'separator' => 'before', 'dynamic' => ['active' => true,], 'condition' => [ 'mm_extra_toggle_switch' => 'yes', ], ] ); $this->add_control( 'mm_extra_toggle_link_template', [ 'label' => esc_html__( 'Content', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'et_link', 'options' => [ 'et_link' => esc_html__( 'Link', 'theplus' ), 'et_template' => esc_html__( 'Template', 'theplus' ), ], 'separator' => 'before', 'condition' => [ 'mm_extra_toggle_switch' => 'yes', ], ] ); $this->add_control( 'mm_extra_toggle_link', [ 'label' => esc_html__( 'Link', 'theplus' ), 'type' => Controls_Manager::URL, 'dynamic' => [ 'active' => true, ], 'placeholder' => esc_html__( 'https://www.demo-link.com', 'theplus' ), 'default' => [ 'url' => '#', ], 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'mm_extra_toggle_link_template' => 'et_link', ], ] ); $this->add_control( 'extra_content_template_et', [ 'label' => esc_html__( 'Elementor Templates', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '0', 'options' => theplus_get_templates(), 'label_block' => 'true', 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'mm_extra_toggle_link_template' => 'et_template', ], ] ); $this->add_control( 'extra_toggle_bar_direction', [ 'label' => esc_html__( 'Open Content Direction', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'right', 'options' => [ 'right' => esc_html__( 'Right', 'theplus' ), 'left' => esc_html__( 'Left', 'theplus' ), 'top' => esc_html__( 'Top', 'theplus' ), 'bottom' => esc_html__( 'Bottom', 'theplus' ), ], 'separator' => 'before', 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'mm_extra_toggle_link_template' => 'et_template', ], ] ); $this->add_control( 'extra_toggle_style', [ 'label' => esc_html__( 'Open Content Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'mm-ett-style-1', 'options' => [ 'mm-ett-style-1' => esc_html__( 'Style 1', 'theplus' ), 'mm-ett-style-2' => esc_html__( 'Style 2', 'theplus' ), ], 'separator' => 'before', 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'mm_extra_toggle_link_template' => 'et_template', ], ] ); $this->add_control( 'extra_content_width_option', [ 'label' => esc_html__( 'Content Width', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'custom', 'options' => [ 'custom' => esc_html__( 'Custom Width/Height', 'theplus' ), 'fullwidth' => esc_html__( 'Full-Width/Height', 'theplus' ), ], 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'mm_extra_toggle_link_template' => 'et_template', ], ] ); $this->add_responsive_control( 'extra_content_margin', [ 'label' => esc_html__( 'Margin', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ '%' ], 'range' => [ '%' => [ 'min' => 1, 'max' => 100, 'step' => 1, ], ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.full-width-content.open' => 'width:calc(100% - {{SIZE}}%);height:calc(100% - {{SIZE}}%); max-width:calc(100% - {{SIZE}}%);max-height:calc(100% - {{SIZE}}%); align-items: center;justify-content: center;vertical-align: middle;right: 0;left: 0;margin: 0 auto;top: 50%;transform: translateY(-50%);', '{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.full-width-content' => 'transition: all 0.3s ease-in-out;', ], 'condition' => [ 'extra_content_width_option' => 'fullwidth', ], ] ); $this->add_responsive_control( 'extra_content_width', [ 'label' => esc_html__( 'Custom Content Width/Height', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 1000, 'step' => 5, ], ], 'default' => [ 'unit' => 'px', 'size' => 400, ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.left,{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.right' => 'max-width: {{SIZE}}{{UNIT}};', '{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.top,{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.bottom' => 'max-height: {{SIZE}}{{UNIT}};', ], 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'mm_extra_toggle_link_template' => 'et_template', 'extra_content_width_option' => 'custom', ], ] ); $this->end_controls_section(); /*extra toggle section end*/ /*extra options section start*/ $this->start_controls_section( 'section_mm_extra_options', [ 'label' => esc_html__( 'Extra Options', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, ] ); $this->add_control( 'mm_extra_display_mode', [ 'label' => esc_html__( 'Display', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'swiper', 'options' => [ 'swiper' => esc_html__( 'Swiper', 'theplus' ), 'columns' => esc_html__( 'Columns', 'theplus' ), ], ] ); $this->add_control( 'mm_extra_indicator_switch', [ 'label' => esc_html__( 'Active Page Indicator', 'theplus' ), 'type' => \Elementor\Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'separator' => 'before', ] ); $this->add_control( 'mm_extra_indicator_type', [ 'label' => esc_html__( 'Style', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'line', 'options' => [ 'line' => esc_html__( 'Line', 'theplus' ), 'dot' => esc_html__( 'Dot', 'theplus' ), ], 'condition' => [ 'mm_extra_indicator_switch' => 'yes', ], ] ); $this->add_control( 'mm_extra_indicator', [ 'label' => esc_html__( 'Position', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '', 'options' => [ '' => esc_html__( 'Select', 'theplus' ), 'indi-top' => esc_html__( 'Top', 'theplus' ), 'indi-bottom' => esc_html__( 'Bottom', 'theplus' ), ], 'condition' => [ 'mm_extra_indicator_switch' => 'yes', 'mm_extra_indicator_type' => 'line', ], ] ); $this->add_responsive_control( 'mm_extra_indicator_dot_offset', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Offset', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => -100, 'max' => 100, 'step' => 1, ], ], 'separator' => 'after', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.dot.active .tp-menu-link:after' => 'bottom: {{SIZE}}{{UNIT}}', ], 'condition' => [ 'mm_extra_indicator_switch' => 'yes', 'mm_extra_indicator_type' => 'dot', ], ] ); $this->add_control( 'pin_text_overflow', [ 'label' => esc_html__( 'Pin Text Overflow', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'hidden', 'options' => [ 'hidden' => esc_html__( 'Hidden', 'theplus' ), 'visible' => esc_html__( 'Visible', 'theplus' ), ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.style_2 .tp-mm-l-wrapper .tp-mm-li, {{WRAPPER}} .tp-mobile-menu.style_2 .tp-mm-r-wrapper .tp-mm-li, {{WRAPPER}} .tp-mobile-menu.style_2 .tp-mm-c-wrapper .tp-mm-c-et-li' => ' overflow:{{VALUE}};', ], ] ); $this->end_controls_section(); /*extra toggle section end*/ /* style section start*/ /*icon/image style start*/ $this->start_controls_section( 'mm_icon_image_styling', [ 'label' => esc_html__('Icon/Image Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, ] ); $this->add_control( 'mm_icon_head', [ 'label' => esc_html__( 'Icon Style', 'theplus' ), 'type' => \Elementor\Controls_Manager::HEADING, ] ); $this->add_responsive_control( 'mm_icon_size', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Size', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 300, 'step' => 1, ], ], 'separator' => 'after', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li i,{{WRAPPER}} .tp-mm-c-wrapper .tp-menu-link i,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li i' => 'font-size: {{SIZE}}{{UNIT}}', '{{WRAPPER}} .tp-mobile-menu .tp-mm-li svg,{{WRAPPER}} .tp-mm-c-wrapper .tp-menu-link svg,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li svg' => 'width: {{SIZE}}{{UNIT}};height: {{SIZE}}{{UNIT}}', ], ] ); $this->start_controls_tabs( 'tabs_mm_icon' ); $this->start_controls_tab( 'tab_mm_icon_normal', [ 'label' => esc_html__( 'Normal', 'theplus' ), ] ); $this->add_control( 'mm_icon_color_n', [ 'label' => esc_html__( 'Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li i,{{WRAPPER}} .tp-mm-c-wrapper .tp-menu-link i,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li i' => 'color: {{VALUE}};', '{{WRAPPER}} .tp-mobile-menu .tp-mm-li svg,{{WRAPPER}} .tp-mm-c-wrapper .tp-menu-link svg,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li svg' => 'fill: {{VALUE}};', ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_mm_icon_active', [ 'label' => esc_html__( 'Active', 'theplus' ), ] ); $this->add_control( 'mm_icon_color_a', [ 'label' => esc_html__( 'Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active i,{{WRAPPER}} .tp-mm-c-wrapper .tp-menu-link i,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li i' => 'color: {{VALUE}};', '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active svg,{{WRAPPER}} .tp-mm-c-wrapper .tp-menu-link svg,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li svg' => 'fill: {{VALUE}};', ], ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->add_control( 'mm_image_head', [ 'label' => esc_html__( 'Image Style', 'theplus' ), 'type' => \Elementor\Controls_Manager::HEADING, 'separator' => 'before', ] ); $this->add_responsive_control( 'mm_image_size', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Size', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 300, 'step' => 1, ], ], 'separator' => 'after', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner .tp-mm-img' => 'width: {{SIZE}}{{UNIT}}', ], ] ); $this->start_controls_tabs( 'tabs_mm_image' ); $this->start_controls_tab( 'tab_mm_image_normal', [ 'label' => esc_html__( 'Normal', 'theplus' ), ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'mm_image_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner .tp-mm-img', ] ); $this->add_responsive_control( 'mm_image_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner .tp-mm-img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'mm_image_shadow', 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner .tp-mm-img', ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_mm_image_active', [ 'label' => esc_html__( 'Active', 'theplus' ), ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'mm_image_border_a', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active .tp-loop-inner .tp-mm-img', ] ); $this->add_responsive_control( 'mm_image_radius_a', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active .tp-loop-inner .tp-mm-img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'mm_image_shadow_a', 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active .tp-loop-inner .tp-mm-img', ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); /*icon/image style end*/ /*extra toggle icon/image style start*/ $this->start_controls_section( 'mm_et_icon_image_styling', [ 'label' => esc_html__('Extra Toggle Icon/Image Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'mm_extra_toggle_switch' => 'yes', ], ] ); $this->add_control( 'mm_et_icon_head', [ 'label' => esc_html__( 'Icon Style', 'theplus' ), 'type' => \Elementor\Controls_Manager::HEADING, ] ); $this->add_responsive_control( 'mm_et_icon_size', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Size', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 300, 'step' => 1, ], ], 'separator' => 'after', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mm-c-wrapper .tp-menu-link i,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li i' => 'font-size: {{SIZE}}{{UNIT}}', '{{WRAPPER}} .tp-mm-c-wrapper .tp-menu-link svg,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li svg' => 'width: {{SIZE}}{{UNIT}};height: {{SIZE}}{{UNIT}}', ], ] ); $this->add_control( 'mm_et_icon_color_n', [ 'label' => esc_html__( 'Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .tp-mm-c-wrapper .tp-menu-link i,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li i' => 'color: {{VALUE}};', '{{WRAPPER}} .tp-mm-c-wrapper .tp-menu-link svg,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li svg' => 'fill: {{VALUE}};', ], ] ); $this->add_control( 'mm_et_image_head', [ 'label' => esc_html__( 'Image Style', 'theplus' ), 'type' => \Elementor\Controls_Manager::HEADING, 'separator' => 'before', ] ); $this->add_responsive_control( 'mm_et_image_size', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Size', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 300, 'step' => 1, ], ], 'separator' => 'after', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner .tp-mm-img.tp-mm-et-img' => 'width: {{SIZE}}{{UNIT}}', ], ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'mm_et_image_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner .tp-mm-img.tp-mm-et-img', ] ); $this->add_responsive_control( 'mm_et_image_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner .tp-mm-img.tp-mm-et-img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'mm_et_image_shadow', 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner .tp-mm-img.tp-mm-et-img', ] ); $this->end_controls_section(); /*extra toggle icon/image style end*/ /*active page indicator start*/ $this->start_controls_section( 'mm_indicator_styling', [ 'label' => esc_html__('Active Page Indicator Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'mm_extra_indicator_switch' => 'yes', ], ] ); $this->add_responsive_control( 'mm_indicator_line_width', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Width', 'theplus'), 'size_units' => [ '%' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 100, 'step' => 1, ], ], 'separator' => 'after', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active:before,{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active:after' => 'width: {{SIZE}}{{UNIT}} !important', ], 'condition' => [ 'mm_extra_indicator_switch' => 'yes', 'mm_extra_indicator_type' => 'line', ], ] ); $this->add_responsive_control( 'mm_indicator_line_height', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Height', 'theplus'), 'size_units' => [ '%' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 100, 'step' => 1, ], ], 'separator' => 'after', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active:before,{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active:after' => 'border-width: {{SIZE}}{{UNIT}} !important', ], 'condition' => [ 'mm_extra_indicator_switch' => 'yes', 'mm_extra_indicator_type' => 'line', ], ] ); $this->add_control( 'mm_indicator_line_color', [ 'label' => esc_html__( 'Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active:before,{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active:after' => 'border-color: {{VALUE}} !important;', ], 'condition' => [ 'mm_extra_indicator_switch' => 'yes', 'mm_extra_indicator_type' => 'line', ], ] ); $this->add_responsive_control( 'mm_indicator_dot_size', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Size', 'theplus'), 'size_units' => [ '%' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 100, 'step' => 1, ], ], 'separator' => 'after', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.dot.active .tp-menu-link:after' => 'width: {{SIZE}}{{UNIT}};height: {{SIZE}}{{UNIT}}', ], 'condition' => [ 'mm_extra_indicator_switch' => 'yes', 'mm_extra_indicator_type' => 'dot', ], ] ); $this->add_control( 'mm_indicator_dot_color', [ 'label' => esc_html__( 'Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.dot.active .tp-menu-link:after' => 'background: {{VALUE}};', ], 'condition' => [ 'mm_extra_indicator_switch' => 'yes', 'mm_extra_indicator_type' => 'dot', ], ] ); $this->end_controls_section(); /*active page indicator end*/ /*menu style start*/ $this->start_controls_section( 'mm_main_menu_styling', [ 'label' => esc_html__('Menu Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, ] ); $this->add_responsive_control( 'mm_main_menu_margin', [ 'label' => esc_html__( 'Outer Padding', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%', 'em' ], 'selectors' => [ '{{WRAPPER}} .tp-mm-wrapper .tp-mm-wrapper-inner .tp-mm-li,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-ul .tp-mm-et-li,{{WRAPPER}} .tp-mobile-menu .tp-mm-l-wrapper .tp-mm-li,{{WRAPPER}} .tp-mobile-menu .tp-mm-r-wrapper .tp-mm-li,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-mm-li, {{WRAPPER}} .tp-mobile-menu.style_2 .tp-mm-c-wrapper .tp-mm-c-et-li' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_responsive_control( 'max_width_loop', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Menu Width', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 100, 'step' => 1, ], ], 'separator' => 'before', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mm-wrapper .tp-mm-wrapper-inner .tp-mm-li,{{WRAPPER}} .tp-mobile-menu .tp-mm-l-wrapper .tp-mm-li,{{WRAPPER}} .tp-mobile-menu .tp-mm-r-wrapper .tp-mm-li' => 'max-width:{{SIZE}}{{UNIT}} !important;min-width:{{SIZE}}{{UNIT}} !important;', ], 'condition' => [ 'mm_extra_display_mode' => 'swiper', ], ] ); $this->add_responsive_control( 'max_height_loop', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Menu Height', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 1000, 'step' => 1, ], ], 'default' => [ 'unit' => 'px', 'size' => 70, ], 'separator' => 'before', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mm-wrapper .tp-mm-wrapper-inner .tp-mm-li,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-ul .tp-mm-et-li,{{WRAPPER}} .tp-mobile-menu .tp-mm-l-wrapper .tp-mm-li,{{WRAPPER}} .tp-mobile-menu .tp-mm-r-wrapper .tp-mm-li,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-mm-li, {{WRAPPER}} .tp-mobile-menu.style_2 .tp-mm-c-wrapper .tp-mm-c-et-li' => 'max-height:{{SIZE}}{{UNIT}} !important;min-height:{{SIZE}}{{UNIT}} !important;', ], 'condition' => [ 'mm_extra_display_mode' => 'swiper', ], ] ); $this->add_control( 'n_title_head', [ 'label' => esc_html__( 'Title Typography', 'theplus' ), 'type' => \Elementor\Controls_Manager::HEADING, 'separator' => 'before', ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'n_title', 'selector' => '{{WRAPPER}} .tp-mm-wrapper .tp-mm-wrapper-inner .tp-mm-li .tp-mm-st1-title,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li .tp-mm-extra-toggle,{{WRAPPER}} .tp-mobile-menu.style_2 .tp-mm-st1-title, {{WRAPPER}} .tp-mobile-menu.style_2 .tp-mm-extra-toggle', ] ); $this->start_controls_tabs( 'tabs_mm_main_menu' ); $this->start_controls_tab( 'tab_mm_main_menu_normal', [ 'label' => esc_html__( 'Normal', 'theplus' ), ] ); $this->add_control( 'n_title_color', [ 'label' => esc_html__( 'Normal Title Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .tp-mm-wrapper .tp-mm-wrapper-inner .tp-mm-li .tp-mm-st1-title,{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li .tp-mm-extra-toggle,{{WRAPPER}} .tp-mobile-menu.style_2 .tp-mm-st1-title, {{WRAPPER}} .tp-mobile-menu.style_2 .tp-mm-extra-toggle' => 'color: {{VALUE}} !important;', ], ] ); $this->add_control( 'et_title_color', [ 'label' => esc_html__( 'Extra Toggle Title Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .tp-mm-et-wrapper .tp-mm-et-li .tp-mm-extra-toggle,{{WRAPPER}} .tp-mobile-menu.style_2 .tp-mm-extra-toggle' => 'color: {{VALUE}} !important;', ], ] ); $this->add_group_control( Group_Control_Background::get_type(), [ 'name' => 'mm_main_menu_background', 'types' => [ 'classic', 'gradient' ], 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-loop-inner,{{WRAPPER}} .tp-mobile-menu .tp-mm-et-wrapper', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'mm_main_menu_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-loop-inner,{{WRAPPER}} .tp-mobile-menu .tp-mm-et-wrapper', 'separator' => 'before', ] ); $this->add_responsive_control( 'mm_main_menu_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-loop-inner,{{WRAPPER}} .tp-mobile-menu .tp-mm-et-wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'mm_main_menu_shadow', 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-loop-inner,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-loop-inner,{{WRAPPER}} .tp-mobile-menu .tp-mm-et-wrapper', ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_mm_main_menu_active', [ 'label' => esc_html__( 'Active', 'theplus' ), ] ); $this->add_control( 'n_title_color_a', [ 'label' => esc_html__( 'Active Title Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active .tp-mm-st1-title' => 'color: {{VALUE}} !important;', ], ] ); $this->add_group_control( Group_Control_Background::get_type(), [ 'name' => 'mm_main_menu_background_a', 'types' => [ 'classic', 'gradient' ], 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active .tp-loop-inner', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'mm_main_menu_border_a', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active .tp-loop-inner', 'separator' => 'before', ] ); $this->add_responsive_control( 'mm_main_menu_radius_a', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active .tp-loop-inner' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'mm_main_menu_shadow_a', 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-li.active .tp-loop-inner', ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); /*menu style end*/ /*extra toggle style start*/ $this->start_controls_section( 'mm_extra_toggle_styling', [ 'label' => esc_html__('Extra Toggle Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'mm_extra_toggle_switch' => 'yes', ], ] ); $this->add_control( 'extra_toggle_equal_height', [ 'label' => esc_html__( 'Extra Toggle Equal Height/Width', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'default' => 'no', 'condition' => [ 'mm_extra_toggle_switch' => 'yes', ], ] ); $this->add_responsive_control( 'extra_toggle_width', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Extra Toggle Width', 'theplus'), 'size_units' => [ '%' ], 'range' => [ '%' => [ 'min' => 0, 'max' => 100, 'step' => 1, ], ], 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.style_1.tpet-on .tp-mm-et-wrapper,{{WRAPPER}} .tp-mobile-menu.style_2.tpet-on .tp-mm-c-wrapper' => 'width:{{SIZE}}%;', '{{WRAPPER}} .tp-mobile-menu.style_2.tpet-on .tp-mm-l-wrapper,{{WRAPPER}} .tp-mobile-menu.style_2.tpet-on .tp-mm-r-wrapper' => 'width:calc((100% - {{SIZE}}%)/2);', '{{WRAPPER}} .tp-mobile-menu.style_1.tpet-on .tp-mm-wrapper' => 'width:calc(100% - {{SIZE}}%);', ], 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'extra_toggle_equal_height!' => 'yes', ], ] ); $this->add_responsive_control( 'extra_toggle_width_eq', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Extra Toggle Size', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 300, 'step' => 1, ], ], 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper, {{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-loop-inner, {{WRAPPER}} .tp-mobile-menu .tp-mm-et-wrapper' => 'width:{{SIZE}}{{UNIT}} !important;height: {{SIZE}}{{UNIT}} !important;max-height: {{SIZE}}{{UNIT}} !important;min-height :{{SIZE}}{{UNIT}} !important;max-width:{{SIZE}}{{UNIT}} !important;min-width:{{SIZE}}{{UNIT}} !important;', ], 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'extra_toggle_equal_height' => 'yes', ], ] ); $this->add_responsive_control( 'extra_toggle_offset', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Toggle Offset', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => -200, 'max' => 1000, 'step' => 1, ], ], 'separator' => 'before', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-et-wrapper,{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper' => 'margin-top:{{SIZE}}{{UNIT}};max-height: {{max_height_loop.SIZE}}px;', ], 'condition' => [ 'mm_extra_toggle_switch' => 'yes', ], ] ); $this->add_group_control( Group_Control_Background::get_type(), [ 'name' => 'mm_extra_toggle_background', 'types' => [ 'classic', 'gradient' ], 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper, {{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-loop-inner, {{WRAPPER}} .tp-mobile-menu .tp-mm-et-wrapper', 'separator' => 'before', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'mm_extra_toggle_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper, {{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-loop-inner, {{WRAPPER}} .tp-mobile-menu .tp-mm-et-wrapper', 'separator' => 'before', ] ); $this->add_responsive_control( 'mm_extra_toggle_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper, {{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-loop-inner, {{WRAPPER}} .tp-mobile-menu .tp-mm-et-wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'mm_extra_toggle_shadow', 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper, {{WRAPPER}} .tp-mobile-menu .tp-mm-c-wrapper .tp-loop-inner, {{WRAPPER}} .tp-mobile-menu .tp-mm-et-wrapper', ] ); $this->end_controls_section(); /*extra toggle style end*/ /*extra toggle style start*/ $this->start_controls_section( 'mm_extra_toggle_temp_styling', [ 'label' => esc_html__('Extra Toggle Template Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'mm_extra_toggle_switch' => 'yes', 'mm_extra_toggle_link_template' => 'et_template', ], ] ); $this->add_control( 'mm_extra_toggle_temp_heading', [ 'label' => esc_html__( 'Template', 'theplus' ), 'type' => Controls_Manager::HEADING, ] ); $this->add_control( 'mm_extra_toggle_temp_overflow', [ 'label' => esc_html__( 'Overflow', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'tp-of-h', 'options' => [ 'tp-of-v' => esc_html__( 'Visible', 'theplus' ), 'tp-of-h' => esc_html__( 'Hidden', 'theplus' ), ], 'separator' => 'before', ] ); $this->add_control( 'content_inner_padding', [ 'label' => esc_html__( 'Inner Padding', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px','em' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Background::get_type(), [ 'name' => 'extra_toggle_content_background', 'label' => esc_html__( 'Content Background', 'theplus' ), 'types' => [ 'classic', 'gradient'], 'selector' => '{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.mm-ett-style-1, {{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.mm-ett-style-2:after', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'extra_toggle_content_fw_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.full-width-content.open', 'condition' => [ 'extra_content_width_option' => 'fullwidth', ], ] ); $this->add_responsive_control( 'extra_toggle_content_fw_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.full-width-content.open' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], 'condition' => [ 'extra_content_width_option' => 'fullwidth', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'extra_toggle_content_fw_shadow', 'selector' => '{{WRAPPER}} .tp-mobile-menu.tpet-on .header-extra-toggle-content.full-width-content.open', 'condition' => [ 'extra_content_width_option' => 'fullwidth', ], ] ); $this->add_control( 'extra_toggle_close_heading_options', [ 'label' => esc_html__( 'Close Icon Style', 'theplus' ), 'type' => Controls_Manager::HEADING, 'separator' => 'before', ] ); $this->add_control( 'tab_extra_toggle_close_position', [ 'label' => esc_html__( 'Close Icon Position', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'mm-ci-top-right', 'options' => [ 'mm-ci-top-left' => esc_html__( 'Top Left', 'theplus' ), 'mm-ci-top-center' => esc_html__( 'Top Center', 'theplus' ), 'mm-ci-top-right' => esc_html__( 'Top Right', 'theplus' ), 'mm-ci-bottom-left' => esc_html__( 'Bottom Left', 'theplus' ), 'mm-ci-bottom-center' => esc_html__( 'Bottom Center', 'theplus' ), 'mm-ci-bottom-right' => esc_html__( 'Bottom Right', 'theplus' ), 'mm-ci-auto' => esc_html__( 'Auto', 'theplus' ), ], ] ); $this->start_controls_tabs( 'tabs_extra_toggle_close_style' ); $this->start_controls_tab( 'tab_extra_toggle_close_normal', [ 'label' => esc_html__( 'Normal', 'theplus' ), ] ); $this->add_control( 'extra_toggle_icon_close_color', [ 'label' => esc_html__( 'Close Icon Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#fff', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu:before,{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu:after,{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu-auto.tp-mm-ca:before,{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu-auto.tp-mm-ca:after' => 'background: {{VALUE}}', ], ] ); $this->add_control( 'extra_toggle_icon_close_bg', [ 'label' => esc_html__( 'Close Background Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#ff5a6e', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu' => 'background: {{VALUE}}', ], 'condition' => [ 'tab_extra_toggle_close_position!' => 'mm-ci-auto', ], ] ); $this->add_control( 'extra_toggle_icon_close_border_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], 'condition' => [ 'tab_extra_toggle_close_position!' => 'mm-ci-auto', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'extra_toggle_icon_close_box_shadow', 'label' => esc_html__( 'Hover Box Shadow', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu', 'condition' => [ 'tab_extra_toggle_close_position!' => 'mm-ci-auto', ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_extra_toggle_close_hover', [ 'label' => esc_html__( 'Hover', 'theplus' ), ] ); $this->add_control( 'extra_toggle_icon_close_color_hover', [ 'label' => esc_html__( 'Close Icon Hover Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#ff5a6e', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu:hover:before,{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu:hover:after,{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu-auto.tp-mm-ca:hover:before,{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu-auto.tp-mm-ca:hover:after' => 'background: {{VALUE}}', ], ] ); $this->add_control( 'extra_toggle_icon_close_bg_hover', [ 'label' => esc_html__( 'Close Hover Background Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '#313131', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu:hover' => 'background: {{VALUE}}', ], 'condition' => [ 'tab_extra_toggle_close_position!' => 'mm-ci-auto', ], ] ); $this->add_control( 'extra_toggle_icon_close_border_radius_hover', [ 'label' => esc_html__( 'Hover Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], 'condition' => [ 'tab_extra_toggle_close_position!' => 'mm-ci-auto', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'extra_toggle_icon_close_box_shadow_hover', 'label' => esc_html__( 'Hover Box Shadow', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-close-menu:hover', 'condition' => [ 'tab_extra_toggle_close_position!' => 'mm-ci-auto', ], ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->add_control( 'extra_toggle_overlay_heading_options', [ 'label' => esc_html__( 'Overlay Style', 'theplus' ), 'type' => Controls_Manager::HEADING, 'separator' => 'before', ] ); $this->add_group_control( Group_Control_Background::get_type(), [ 'name' => 'extra_toggle_overlay_background', 'label' => esc_html__( 'Overlay Background', 'theplus' ), 'types' => [ 'classic', 'gradient'], 'selector' => '{{WRAPPER}} .tp-mobile-menu.tpet-on .extra-toggle-content-overlay', ] ); $this->end_controls_section(); /*extra toggle style end*/ /*content background style start*/ $this->start_controls_section( 'mm_cb_styling', [ 'label' => esc_html__('Content Background Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, ] ); $this->add_responsive_control( 'mm_cb__padding', [ 'label' => esc_html__( 'Padding', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', 'em'], 'selectors' => [ '{{WRAPPER}} tp-mobile-menu' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Background::get_type(), [ 'name' => 'mm_cb_bg', 'types' => [ 'classic', 'gradient' ], 'selector' => '{{WRAPPER}} .tp-mobile-menu', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'mm_cb_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu', ] ); $this->add_responsive_control( 'mm_cb_border_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};overflow: hidden;', ], ] ); $this->add_control( 'mm_cb_overflow', [ 'label' => esc_html__( 'Overflow', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'hidden', 'options' => [ 'hidden' => esc_html__( 'Hidden', 'theplus' ), 'visible' => esc_html__( 'Visible', 'theplus' ), ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu' => 'overflow: {{VALUE}} !important;', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'mm_cb_box_shadow', 'selector' => '{{WRAPPER}} .tp-mobile-menu', ] ); $this->end_controls_section(); /*content background style end*/ /*Pin text Option Style*/ $this->start_controls_section( 'pin_text_style_section', [ 'label' => esc_html__( 'Pin Text Options', 'theplus' ), 'tab' => Controls_Manager::TAB_STYLE, ] ); $this->add_responsive_control( 'pin_text_padding', [ 'label' => esc_html__( 'Padding', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', 'em'], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li .tp-loop-inner:after' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};line-height: 1;', ], ] ); $this->add_responsive_control( 'pin_text_top_offset', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Top Offset', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => -400, 'max' => 400, 'step' => 1, ], ], 'separator' => 'before', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li .tp-loop-inner:after' => 'top: {{SIZE}}{{UNIT}}', ], ] ); $this->add_responsive_control( 'pin_text_right_offset', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Right Offset', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => -400, 'max' => 400, 'step' => 1, ], ], 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li .tp-loop-inner:after' => 'right: {{SIZE}}{{UNIT}}', ], ] ); $this->add_responsive_control( 'pin_text_size', [ 'type' => Controls_Manager::SLIDER, 'label' => esc_html__('Text Size', 'theplus'), 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 100, 'step' => 1, ], ], 'separator' => 'before', 'render_type' => 'ui', 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li .tp-loop-inner:after' => 'font-size: {{SIZE}}{{UNIT}}', ], ] ); $this->add_control( 'pin_text_color', [ 'label' => esc_html__( 'Text Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li .tp-loop-inner:after' => 'color: {{VALUE}};', ], ] ); $this->add_group_control( Group_Control_Background::get_type(), [ 'name' => 'pin_text_bg', 'types' => [ 'classic', 'gradient' ], 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-li .tp-loop-inner:after', ] ); $this->add_group_control( Group_Control_Border::get_type(), [ 'name' => 'pin_text_border', 'label' => esc_html__( 'Border', 'theplus' ), 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-li .tp-loop-inner:after', 'separator' => 'before', ] ); $this->add_responsive_control( 'pin_text_radius', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .tp-mobile-menu .tp-mm-li .tp-loop-inner:after' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'pin_text_shadow', 'selector' => '{{WRAPPER}} .tp-mobile-menu .tp-mm-li .tp-loop-inner:after', ] ); $this->end_controls_section(); /*Pin text Option Style end*/ /*Extra Option Style*/ $this->start_controls_section( 'extra_option_style_section', [ 'label' => esc_html__( 'Extra Options', 'theplus' ), 'tab' => Controls_Manager::TAB_STYLE, ] ); $this->add_control( 'show_scroll_window_offset', [ 'label' => esc_html__( 'Show Mobile Menu Scroll Offset', 'theplus' ), 'type' => \Elementor\Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Show', 'theplus' ), 'label_off' => esc_html__( 'Hide', 'theplus' ), 'default' => 'no', ] ); $this->add_control( 'scroll_top_offset_value', [ 'label' => esc_html__( 'Scroll Top Offset Value', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => 'px', 'range' => [ 'px' => [ 'min' => 0, 'max' => 5000, 'step' => 2, ], ], 'default' => [ 'unit' => 'px', 'size' => 100, ], 'condition' => [ 'show_scroll_window_offset' => 'yes', ], ] ); $this->end_controls_section(); /*Extra Option Style*/ /* style section end*/ } protected function render() { $settings = $this->get_settings_for_display(); $uid = uniqid("mm"); $mm_style = $settings['mm_style']; $close_position = $settings['tab_extra_toggle_close_position']; global $wp; $current_page_url = home_url( $wp->request ); $show_scroll_window_offset = ($settings['show_scroll_window_offset'] == 'yes') ? 'scroll-view' : ''; $scroll_top_offset_value = (!empty($settings['scroll_top_offset_value']["size"]) && $settings['show_scroll_window_offset'] == 'yes') ? 'data-scroll-view="'.esc_attr($settings['scroll_top_offset_value']["size"]).'"' : 'data-scroll-view=""'; $mobile_menu_pos = $settings['mobile_menu_pos']; $position_class=''; if($mobile_menu_pos == 'absolute'){ $position_class = 'tp-mm-absolute'; }else if($mobile_menu_pos == 'fixed'){ $position_class = 'tp-mm-fix'; } $mm_extra_toggle_switch = $settings['mm_extra_toggle_switch']; $extra_toggle=''; /*extra toggle start*/ if(!empty($mm_extra_toggle_switch) && $mm_extra_toggle_switch == 'yes'){ $mm_extra_toggle_icon_image = $settings['mm_extra_toggle_icon_image']; $mm_extra_toggle_link_template = $settings['mm_extra_toggle_link_template']; $mm_extra_toggle_text = !empty($settings['mm_extra_toggle_text']) ? $settings['mm_extra_toggle_text'] : ''; /*extra toggle icon image start*/ $image_alt=''; if(!empty($mm_extra_toggle_icon_image == 'mm_ext_tgl_image')){ $mm_extra_toggle_custom_image=$settings['mm_extra_toggle_custom_image']['id']; $img = wp_get_attachment_image_src($mm_extra_toggle_custom_image,$settings['mm_et_ci_thumbnail_size']); $mm_et_ci_src = isset($img[0]) ? $img[0] : ''; $image_alt = get_post_meta($mm_extra_toggle_custom_image, '_wp_attachment_image_alt', TRUE); if(!$image_alt){ $image_alt = get_the_title($mm_extra_toggle_custom_image); } $extra_toggle_ii ='<img class="tp-mm-img tp-mm-et-img" src='.esc_url($mm_et_ci_src).' alt="'.esc_attr($image_alt).'" />'; }else if($mm_extra_toggle_icon_image == 'mm_ext_tgl_icon'){ ob_start(); \Elementor\Icons_Manager::render_icon( $settings['mm_extra_toggle_custom_icon'] , [ 'aria-hidden' => 'true' ]); $extra_toggle_ii = ob_get_contents(); ob_end_clean(); }else{ $extra_toggle_ii=''; } /*extra toggle icon image end*/ /*extra toggle link template start*/ if(($mm_extra_toggle_link_template == 'et_link' && !empty($extra_toggle_ii)) || ($mm_extra_toggle_link_template == 'et_link' && !empty($mm_extra_toggle_text))){ if(!empty($settings['mm_extra_toggle_link']['url'])){ $et_a_start = '<a class="tp-menu-link tp-mm-et-link" href="'.esc_url($settings['mm_extra_toggle_link']['url']).'">'; $et_a_end = '</a>'; } $extra_toggle .= wp_kses_post($et_a_start) .$extra_toggle_ii.'<span class="tp-mm-extra-toggle">'.wp_kses_post($mm_extra_toggle_text).'</span>' .wp_kses_post($et_a_end); }else if(($mm_extra_toggle_link_template == 'et_template' && !empty($extra_toggle_ii)) || ($mm_extra_toggle_link_template == 'et_template' && !empty($mm_extra_toggle_text))){ $open_direction = $settings["extra_toggle_bar_direction"]; $extra_toggle_style = $settings["extra_toggle_style"]; $mm_extra_toggle_temp_overflow = $settings["mm_extra_toggle_temp_overflow"]; $fullwidth_content = ($settings['extra_content_width_option']=='fullwidth') ? 'full-width-content' : ''; $extra_toggle .= '<a class="tp-menu-link tp-mm-et-link" >'.$extra_toggle_ii.'<span class="tp-mm-extra-toggle">'.wp_kses_post($mm_extra_toggle_text).'</span></a>'; if(!empty($settings['tab_extra_toggle_close_position']) && $settings['tab_extra_toggle_close_position'] == 'mm-ci-auto'){ $extra_toggle .= '<div class="extra-toggle-close-menu-auto"></div>'; } $extra_toggle .='<div class="header-extra-toggle-content '.esc_attr($extra_toggle_style).' '.esc_attr($fullwidth_content).' '.esc_attr($open_direction).' '.esc_attr($mm_extra_toggle_temp_overflow).'">'; if($settings['extra_toggle_style']=='mm-ett-style-2' && !empty($settings['extra_toggle_style'])){ $extra_toggle .='<div class="tp-con-open-st2">'; } $extra_toggle .='<div class="extra-toggle-close-menu '.esc_attr($close_position).'"></div>'; $extra_toggle .= Theplus_Element_Load::elementor()->frontend->get_builder_content_for_display($settings['extra_content_template_et'] ); if($settings['extra_toggle_style']=='mm-ett-style-2' && !empty($settings['extra_toggle_style'])){ $extra_toggle .='</div>'; } $extra_toggle .='</div>'; $extra_toggle .='<div class="extra-toggle-content-overlay"></div>'; } /*extra toggle link template end*/ } /*extra toggle end*/ $loop=$loop2=''; $indi_class=''; if($settings['mm_extra_indicator_type'] == 'dot'){ $indi_class = 'dot'; } if(!empty($settings["mm_st1_content"])) { $i=0; foreach($settings["mm_st1_content"] as $item) { $mm_st1_icon_image = $item['mm_st1_icon_image']; $mm_st1_custom_icon = $item['mm_st1_custom_icon']; $mm_st1_custom_image=''; if(!empty($item['mm_st1_custom_image'])){ $mm_st1_custom_image = $item['mm_st1_custom_image']['id']; $img = wp_get_attachment_image_src($mm_st1_custom_image,$item['mmst1_ci_thumbnail_size']); $mm_st1_custom_image = isset($img[0]) ? $img[0] : ''; } $mm_st1_text = $item['mm_st1_text']; $mm_st1_link = $item['mm_st1_link']; $title_a_start=$title_a_end=''; /*st1 custom icon start*/ if($mm_st1_icon_image=='mm_st1_icon'){ ob_start(); \Elementor\Icons_Manager::render_icon( $mm_st1_custom_icon , [ 'aria-hidden' => 'true' ]); $mm_st1_custom_icon = ob_get_contents(); ob_end_clean(); } /*st1 custom icon end*/ $mobile_menu=''; /*st1 title & link start*/ if ( ! empty( $item['mm_st1_link']['url'] ) ) { $mm_st1_link = $item['mm_st1_link']['url']; } if(!empty($item['mm_st1_text'])){ $mobile_menu .= '<span class="tp-mm-st1-title">'.$item['mm_st1_text'].'</span>'; } $i++; /*st1 title & link end*/ /*display st1 start*/ if (!empty($item['mm_st1_link']['url'])){ $title_a_start = '<a class="tp-menu-link tp-mm-normal" href="'.esc_url($mm_st1_link).'">'; $title_a_end = '</a>'; }else{ $title_a_start = '<a class="tp-menu-link tp-mm-normal">'; $title_a_end = '</a>'; } $inner_class_loop=''; if($settings['mm_extra_display_mode'] == 'columns'){ $inner_class_loop .= 'grid-item tp-mm-eq-col'; } $loop .='<li class="tp-mm-li elementor-repeater-item-' . esc_attr($item['_id']) . ' '.esc_attr($inner_class_loop).' '.esc_attr($settings['mm_extra_indicator']).' '.esc_attr($indi_class).'"><div class="tp-loop-inner">'.$title_a_start.''; if(!empty($mm_st1_custom_icon)){ $loop .= $mm_st1_custom_icon; } if(!empty($mm_st1_custom_image)){ $loop .= '<img class="tp-mm-img tp-mm-st1-img" src='.esc_url($mm_st1_custom_image).' />'; } $loop .= $mobile_menu; $loop .=''.$title_a_end.'</div></li>'; /*display st1 end*/ } } if(!empty($settings["mm_st2_content_r"])) { $j=0; foreach($settings["mm_st2_content_r"] as $item) { $mm_st2_icon_image_r= $item['mm_st2_icon_image_r']; $mm_st2_custom_icon_r= $item['mm_st2_custom_icon_r']; $mm_st2_custom_image_r=''; if(!empty($item['mm_st2_custom_image_r'])){ $mm_st2_custom_image_r=$item['mm_st2_custom_image_r']['id']; $img = wp_get_attachment_image_src($mm_st2_custom_image_r,$item['mmst2_cir_thumbnail_size']); $mm_st2_custom_image_r = isset($img[0]) ? $img[0] : ''; } $mm_st2_text_r= $item['mm_st2_text_r']; $mm_st2_link_r= $item['mm_st2_link_r']; $title_a_start=$title_a_end=''; /*st2 custom icon start*/ if($mm_st2_icon_image_r=='mm_st2_icon_r'){ ob_start(); \Elementor\Icons_Manager::render_icon( $mm_st2_custom_icon_r , [ 'aria-hidden' => 'true' ]); $mm_st2_custom_icon_r = ob_get_contents(); ob_end_clean(); } /*st2 custom icon end*/ $mobile_menu=''; /*st2 title & link start*/ if ( ! empty( $item['mm_st2_link_r']['url'] ) ) { $mm_st2_link_r = $item['mm_st2_link_r']['url']; } if(!empty($item['mm_st2_text_r'])){ $mobile_menu .= '<span class="tp-mm-st1-title">'.wp_kses_post($item['mm_st2_text_r']).'</span>'; } $j++; /*st2 title & link end*/ /*display st2 start*/ if (!empty($item['mm_st2_link_r']['url'])){ $title_a_start = '<a class="tp-menu-link tp-mm-normal" href="'.esc_url($mm_st2_link_r).'">'; $title_a_end = '</a>'; }else{ $title_a_start = '<a class="tp-menu-link tp-mm-normal">'; $title_a_end = '</a>'; } $inner_class_loop=''; if($settings['mm_extra_display_mode'] == 'columns'){ $inner_class_loop .= 'grid-item tp-mm-eq-col'; } $loop2 .='<li class="tp-mm-li elementor-repeater-item-' . esc_attr($item['_id']) . ' '.esc_attr($inner_class_loop).' '.esc_attr($settings['mm_extra_indicator']).' '.esc_attr($indi_class).'"><div class="tp-loop-inner">'.$title_a_start.''; if(!empty($mm_st2_custom_icon_r)){ $loop2 .= $mm_st2_custom_icon_r; } if(!empty($mm_st2_custom_image_r)){ $loop2 .= '<img class="tp-mm-img tp-mm-st1-img" src='.esc_url($mm_st2_custom_image_r).' />'; } $loop2 .= $mobile_menu; $loop2 .=''.$title_a_end.'</div></li>'; /*display st2 end*/ } } $wrapper_main_class=$wrapper_class=$inner_class=$main_class=$et_class=$close_auto_class=''; if($settings['mm_extra_display_mode'] == 'swiper'){ $wrapper_main_class .= ' swiper-container'; $wrapper_class .= ' swiper-wrapper'; $inner_class .= ' swiper-slide swiper-slide-active'; }else if($settings['mm_extra_display_mode'] == 'columns'){ $inner_class .= 'tp-row'; $main_class .= 'tp-column-base'; } if($mm_extra_toggle_switch=='yes'){ $et_class .= ' tpet-on'; } if(!empty($settings['tab_extra_toggle_close_position']) && $settings['tab_extra_toggle_close_position'] == 'mm-ci-auto'){ $close_auto_class .= ' tp-mm-ca'; } $mobile_menu_load ='<div class="tp-mobile-menu '.esc_attr($uid).' '.esc_attr($mm_style).' '.esc_attr($et_class).' '.esc_attr($main_class).' '.esc_attr($position_class).' '.esc_attr($settings['mobile_menu_pos_po']).' '.esc_attr($show_scroll_window_offset).' '.esc_attr($close_auto_class).'" '.$scroll_top_offset_value.' data-uid='.esc_attr($uid).' >'; if($mm_style=='style_1'){ $mobile_menu_load .='<div class="tp-mm-wrapper '.esc_attr($wrapper_main_class).'">'; $mobile_menu_load .='<div class="tp-mm-wrapper-inner '.esc_attr($wrapper_class).'">'; $mobile_menu_load .='<ul class="tp-mm-ul '.esc_attr($inner_class).'">'; $mobile_menu_load .= $loop; $mobile_menu_load .='</ul>'; $mobile_menu_load .='</div>'; $mobile_menu_load .='</div>'; if($mm_extra_toggle_switch=='yes'){ $mobile_menu_load .='<div class="tp-mm-et-wrapper">'; $mobile_menu_load .='<ul class="tp-mm-et-ul"><li class="tp-mm-et-li"><div class="tp-loop-inner">'.$extra_toggle.'</div></li></ul>'; $mobile_menu_load .='</div>'; } }else if($mm_style=='style_2'){ $mobile_menu_load .='<div class="tp-mm-l-wrapper '.esc_attr($wrapper_main_class).'">'; $mobile_menu_load .='<div class="tp-mm-l-wrapper-inner '.esc_attr($wrapper_class).'">'; $mobile_menu_load .='<ul class="tp-mm-l-ul '.esc_attr($inner_class).'">'; $mobile_menu_load .=$loop; $mobile_menu_load .='</ul>'; $mobile_menu_load .='</div>'; $mobile_menu_load .='</div>'; if($mm_extra_toggle_switch=='yes'){ $mobile_menu_load .='<div class="tp-mm-c-wrapper">'; $mobile_menu_load .='<ul class="tp-mm-c-et-ul"><li class="tp-mm-c-et-li"><div class="tp-loop-inner">'.$extra_toggle.'</div></li></ul>'; $mobile_menu_load .='</div>'; } $mobile_menu_load .='<div class="tp-mm-r-wrapper '.esc_attr($wrapper_main_class).'">'; $mobile_menu_load .='<div class="tp-mm-r-wrapper-inner '.esc_attr($wrapper_class).'">'; $mobile_menu_load .='<ul class="tp-mm-r-ul '.esc_attr($inner_class).'">'; $mobile_menu_load .=$loop2; $mobile_menu_load .='</ul>'; $mobile_menu_load .='</div>'; $mobile_menu_load .='</div>'; } $mobile_menu_load .='</div>'; $css_rule=''; if(!empty($settings['open_mobile_menu']['size'])){ $open_mobile_menu=($settings['open_mobile_menu']['size']).$settings['open_mobile_menu']['unit']; $close_mobile_menu=($settings['open_mobile_menu']['size']+1).$settings['open_mobile_menu']['unit']; $css_rule .='@media (min-width:'.esc_attr($close_mobile_menu).'){.tp-mobile-menu.'.esc_attr($uid).'{display:none;}}'; $css_rule .='@media (max-width:'.esc_attr($open_mobile_menu).'){{.tp-mobile-menu.'.esc_attr($uid).'{display:flex;}}'; } echo '<style>'.esc_attr($css_rule).'</style>'; echo $mobile_menu_load; } protected function content_template() { } }