%s
', admin_url( 'edit.php?post_type=easy-offcanvas' ), esc_html__( 'Edit Offcanvas Templates', 'easy-elements' ), esc_html__( 'All your offcanvas content can be managed here in the Easy Offcanvas post type.', 'easy-elements' ) ), 'separator' => 'before', ] ); $this->add_control( 'close_icon', [ 'label' => esc_html__('Close Icon', 'easy-elements'), 'type' => Controls_Manager::ICONS, 'default' => [ 'value' => '', 'library' => '', ], ] ); $this->add_control( 'need_blur_effect', [ 'label' => esc_html__( 'Enable Blur', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Yes', 'easy-elements' ), 'label_off' => esc_html__( 'No', 'easy-elements' ), 'return_value' => 'yes', 'default' => 'no', ] ); $this->end_controls_section(); // Style $this->start_controls_section( 'style_section', [ 'label' => esc_html__( 'Style', 'easy-elements' ), 'tab' => \Elementor\Controls_Manager::TAB_STYLE, ] ); $this->add_control( 'open_icon_options', [ 'label' => esc_html__( 'Opener Icon', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::HEADING, 'separator' => 'after', ] ); $this->add_control( 'offcanvas_opener_text_color', [ 'label' => esc_html__( 'Text Color', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .eel-offcanvas-toggle-text .eel-icon-text' => 'color: {{VALUE}};', ], 'condition' => [ 'menu_text!' => '', ], ] ); $this->add_group_control( \Elementor\Group_Control_Typography::get_type(), [ 'name' => 'offcanvas_opener_text_typography', 'label' => esc_html__('Typography', 'easy-elements' ), 'selector' => '{{WRAPPER}} .eel-offcanvas-toggle-text .eel-icon-text', 'separator' => 'after', 'condition' => [ 'menu_text!' => '', ], ] ); $this->add_control( 'offcanvas_opener_icon_color', [ 'label' => esc_html__( 'Hamburger Color', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::COLOR, 'selectors' => [ '{{WRAPPER}} .eel-offcanvas-toggle-text svg' => 'fill: {{VALUE}};', '{{WRAPPER}} .eel-offcanvas-toggle-text i' => 'color: {{VALUE}};', '{{WRAPPER}} .eel-icon-menu' => 'border-bottom-color: {{VALUE}};', ], 'condition' => [ 'offcanvas_layout' => 'classic', ], ] ); $this->add_control( 'offcanvas_opener_icon_humburger_color', [ 'label' => esc_html__( 'Hamburger Color', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::COLOR, 'selectors' => [ '.modern.eel-offcanvas-wrapper label span' => 'background: {{VALUE}} !important;', ], 'condition' => [ 'offcanvas_layout' => 'modern', ], ] ); $this->add_responsive_control( 'offcanvas_opener_icon_size', [ 'label' => __( 'Hamburger Size', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .eel-offcanvas-toggle-text svg' => 'width: {{SIZE}}{{UNIT}} !important; height: {{SIZE}}{{UNIT}} !important;', '{{WRAPPER}} .eel-offcanvas-toggle-text i' => 'font-size: {{SIZE}}{{UNIT}} !important;', ], 'condition' => [ 'offcanvas_layout' => 'classic', ], ] ); $this->add_responsive_control( 'offcanvas_opener_icon_size_morden', [ 'label' => __( 'Hamburger Size', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .modern.eel-offcanvas-wrapper label' => 'width: {{SIZE}}{{UNIT}};', ], 'condition' => [ 'offcanvas_layout' => 'modern', ], ] ); $this->add_control( 'closing_icon_options', [ 'label' => esc_html__( 'Closing Icon', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::HEADING, 'separator' => 'after', ] ); $this->add_control( 'offcanvas_closing_icon_color', [ 'label' => esc_html__( 'Icon Color', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::COLOR, 'selectors' => [ '.eel-offcanvas-close' => 'color: {{VALUE}} !important;', ], 'condition' => [ 'offcanvas_layout' => 'classic', ], ] ); $this->add_control( 'offcanvas_closing_icon_morden_color', [ 'label' => esc_html__( 'Icon Color', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::COLOR, 'selectors' => [ '.eel-modern-close-toggle span, .modern.eel-offcanvas-wrapper label.eel-modern-close-toggle span' => 'background: {{VALUE}} !important;', ], 'condition' => [ 'offcanvas_layout' => 'modern', ], ] ); $this->add_responsive_control( 'offcanvas_closing_icon_size', [ 'label' => __( 'Icon Size', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'selectors' => [ '.eel-offcanvas-close' => 'font-size: {{SIZE}}{{UNIT}} !important;', ], 'condition' => [ 'offcanvas_layout' => 'classic', ], ] ); $this->add_control( 'offcanvas_item', [ 'label' => esc_html__( 'OffCanvas Item', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::HEADING, 'separator' => 'after', ] ); $this->add_control( 'offcanvas_bg', [ 'label' => esc_html__( 'OffCanvas Background', 'easy-elements' ), 'type' => \Elementor\Controls_Manager::COLOR, 'selectors' => [ 'body .eel-offcanvas' => 'background: {{VALUE}} !important;', ], ] ); $this->add_responsive_control( 'offcanvas_padding', [ 'label' => esc_html__('OffCanvas Padding', 'easy-elements'), 'type' => \Elementor\Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', 'em', '%' ], 'selectors' => [ 'body .eel-offcanvas' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;', ], ] ); $this->end_controls_section(); } private function get_eligible_canvas_templates() { $templates = []; $posts = get_posts([ 'post_type' => 'easy-offcanvas', 'posts_per_page' => -1, 'post_status' => 'publish', ]); foreach ( $posts as $post ) { $templates[ $post->ID ] = $post->post_title; } return $templates; } protected function render() { $settings = $this->get_settings_for_display(); $position = $settings['position_offcanvas']; $btn_text = ! empty( $settings['menu_text'] ) ? $settings['menu_text'] : ''; $content_template = ! empty( $settings['content_template'] ) ? $settings['content_template'] : ''; $blur = ( isset( $settings['need_blur_effect'] ) && $settings['need_blur_effect'] === 'yes' ) ? 'eel-blur-effect' : ''; $unique_id = 'eel-offcanvas-' . $this->get_id(); ?>