File Content: poolax-button.php <?php use \Elementor\Widget_Base; use \Elementor\Controls_Manager; use \Elementor\Group_Control_Typography; use \Elementor\Group_Control_Border; use \Elementor\Group_Control_Box_Shadow; /** * * Button Widget * */ class poolax_Button extends Widget_Base { public function get_name() { return 'poolaxbutton'; } public function get_title() { return __( 'Button', 'poolax' ); } public function get_icon() { return 'th-icon'; } public function get_categories() { return [ 'poolax' ]; } protected function register_controls() { $this->start_controls_section( 'button_section', [ 'label' => __( 'Button', 'poolax' ), 'tab' => Controls_Manager::TAB_CONTENT, ] ); $this->add_control( 'layout_style', [ 'label' => __( 'Button Style', 'poolax' ), 'type' => Controls_Manager::SELECT, 'default' => '1', 'options' => [ '1' => __( 'Style One', 'poolax' ), // '2' => __( 'Style Two', 'poolax' ), ], ] ); poolax_general_fields($this, 'button_text', 'Button Text', 'TEXT', 'Button Text'); poolax_general_fields($this, 'button_extra_class', 'Button Extra Class', 'TEXT', ''); poolax_url_fields($this, 'button_url', 'Button URL'); poolax_general_fields($this, 'button_icon', 'Button Icon Class', 'TEXT', ''); $this->add_control( 'button_icon_position', [ 'label' => __( 'Button Icon Position', 'poolax' ), 'type' => Controls_Manager::SELECT, 'default' => '2', 'options' => [ '1' => __( 'Before Text', 'poolax' ), '2' => __( 'After Text', 'poolax' ), ], ] ); $this->add_control( 'button_space', [ 'label' => esc_html__( 'Button Icon Spacing (PX)', 'poolax' ), 'type' => \Elementor\Controls_Manager::SLIDER, 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 50, 'step' => 1, ], ], 'default' => [ 'unit' => 'px', 'size' => 8, ], 'selectors' => [ '{{WRAPPER}} .th_btn i' => 'margin-right: {{SIZE}}{{UNIT}};', ], 'condition' => [ 'button_icon_position' => ['1'] ] ] ); $this->add_control( 'button_space2', [ 'label' => esc_html__( 'Button Icon Spacing (PX)', 'poolax' ), 'type' => \Elementor\Controls_Manager::SLIDER, 'size_units' => [ 'px' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 50, 'step' => 1, ], ], 'default' => [ 'unit' => 'px', 'size' => 8, ], 'selectors' => [ '{{WRAPPER}} .th_btn i' => 'margin-left: {{SIZE}}{{UNIT}};', ], 'condition' => [ 'button_icon_position' => ['2'] ] ] ); $this->add_responsive_control( 'button_align', [ 'label' => __( 'Alignment', 'poolax' ), 'type' => Controls_Manager::CHOOSE, 'options' => [ 'left' => [ 'title' => __( 'Left', 'poolax' ), 'icon' => 'eicon-text-align-left', ], 'center' => [ 'title' => __( 'Center', 'poolax' ), 'icon' => 'eicon-text-align-center', ], 'right' => [ 'title' => __( 'Right', 'poolax' ), 'icon' => 'eicon-text-align-right', ], ], 'default' => 'left', 'toggle' => true, 'selectors' => [ '{{WRAPPER}} .btn-wrapper' => 'text-align: {{VALUE}}', ], ] ); $this->end_controls_section(); //--------------------------------------- //Style Section Start //--------------------------------------- //------Button Style------- poolax_button_style_fields($this, '10', 'Button Styling', '{{WRAPPER}} .th_btn'); } protected function render() { $settings = $this->get_settings_for_display(); $this->add_render_attribute( 'wrapper', 'class', 'btn-wrapper'); $this->add_render_attribute( 'button', 'class', 'th-btn th_btn' ); $this->add_render_attribute( 'button', 'class', $settings['button_extra_class'] ); if( ! empty( $settings['button_url']['url'] ) ) { $this->add_render_attribute( 'button', 'href', esc_url( $settings['button_url']['url'] ) ); } if( ! empty( $settings['button_url']['nofollow'] ) ) { $this->add_render_attribute( 'button', 'rel', 'nofollow' ); } if( ! empty( $settings['button_url']['is_external'] ) ) { $this->add_render_attribute( 'button', 'target', '_blank' ); } echo '<div '.$this->get_render_attribute_string('wrapper').'>'; if( ! empty( $settings['button_text'] ) ) { echo '<a '.$this->get_render_attribute_string('button').'>'; if( ! empty( $settings['button_icon'] ) && $settings['button_icon_position'] == '1' ){ echo wp_kses_post($settings['button_icon']); } echo esc_html( $settings['button_text'] ); if( ! empty( $settings['button_icon'] ) && $settings['button_icon_position'] == '2' ){ echo wp_kses_post($settings['button_icon']); } echo '</a>'; } echo '</div>'; } } Submit