File Content: poolax-banner2.php <?php use \Elementor\Widget_Base; use \Elementor\Controls_Manager; use \Elementor\Group_Control_Typography; use \Elementor\Repeater; use \Elementor\Utils; use \Elementor\Group_Control_Border; /** * * Banner 2 Widget. * */ class poolax_Banner2 extends Widget_Base { public function get_name() { return 'poolaxbanner2'; } public function get_title() { return __( 'Banner Hero', 'poolax' ); } public function get_icon() { return 'th-icon'; } public function get_categories() { return [ 'poolax_header_elements' ]; } protected function register_controls() { $this->start_controls_section( 'banner_section', [ 'label' => __( 'Banner Hero', 'poolax' ), 'tab' => Controls_Manager::TAB_CONTENT, ] ); $this->add_control( 'layout_style', [ 'label' => __( 'Layout Style', 'poolax' ), 'type' => Controls_Manager::SELECT, 'default' => '1', 'options' => [ '1' => __( 'Style One', 'poolax' ), '2' => __( 'Style Two', 'poolax' ), '3' => __( 'Style Three', 'poolax' ), '4' => __( 'Style Four', 'poolax' ), ], ] ); poolax_media_fields( $this, 'image', 'Choose Image'); poolax_media_fields( $this, 'image2', 'Choose Image', ['1', '2', '3']); poolax_media_fields( $this, 'image3', 'Choose Image', ['1', '2'] ); poolax_media_fields( $this, 'image4', 'Choose Image', ['2'] ); poolax_general_fields( $this, 'subtitle', 'Subtitle', 'TEXT', 'Refresh, Relax, Rejuvenate', ['1', '3', '4'] ); poolax_general_fields( $this, 'title', 'Title', 'TEXTAREA', 'Pool Perfection Starts Here'); poolax_general_fields( $this, 'title2', 'Title', 'TEXTAREA', 'Pool Perfection Starts Here', ['2'] ); poolax_general_fields( $this, 'desc', 'Description', 'TEXTAREA', '', ['1', '3', '4'] ); poolax_general_fields( $this, 'button_text', 'Button Text', 'TEXT', 'Discover More'); poolax_url_fields( $this, 'button_url', 'Button URL'); poolax_general_fields( $this, 'button_text2', 'Button Text 2', 'TEXT', 'Contact Us', ['1', '2', '3'] ); poolax_url_fields( $this, 'button_url2', 'Button URL 2', '', ['1', '2', '3'] ); poolax_url_fields( $this, 'video_url', 'Video URL', '', ['4'] ); poolax_switcher_fields( $this, 'show_social', 'Show left Social Options?', ['4'] ); poolax_media_fields( $this, 'line_img', 'Social Line Image', ['4'] ); $repeater = new Repeater(); poolax_media_fields( $repeater, 'icon', 'Choose Icon' ); poolax_url_fields( $repeater, 'social_url', 'Social URL' ); $this->add_control( 'social_lists', [ 'label' => __( 'Social Lists', 'poolax' ), 'type' => Controls_Manager::REPEATER, 'fields' => $repeater->get_controls(), 'condition' => [ 'layout_style' => ['4'], ] ] ); $this->end_controls_section(); //--------------------------------------- //Style Section Start //--------------------------------------- //-------Subtitle Style------- poolax_common_style_fields( $this, 'subtitle2', 'Subtitle', '{{WRAPPER}} .hero-subtitle', ['1'],'--theme-color2' ); poolax_common_style_fields( $this, 'subtitle22', 'Subtitle', '{{WRAPPER}} .hero-subtitle', ['3'],'--theme-color' ); poolax_common_style_fields( $this, 'subtitle222', 'Subtitle', '{{WRAPPER}} .hero-subtitle', ['4'],'--white-color' ); //-------Title Style------- poolax_common_style_fields( $this, 'title', 'Title', '{{WRAPPER}} .hero-title' ); //-------Description Style------- poolax_common_style_fields( $this, 'desc', 'Description', '{{WRAPPER}} .hero-text', ['1', '3', '4'] ); //------Button Style------- poolax_button_style_fields( $this, '10', 'Button Styling', '{{WRAPPER}} .th_btn' ); //------Button 2 Style------- poolax_button_style_fields( $this, '11', 'Button 2 Styling', '{{WRAPPER}} .th_btn2', ['1', '2', '3'] ); } protected function render() { $settings = $this->get_settings_for_display(); if( $settings['layout_style'] == '1' ){ echo '<div class="th-hero-wrapper hero-6" data-bg-src="'.esc_url($settings['image']['url']).'">'; echo '<div class="container">'; echo '<div class="hero-style6">'; if(!empty($settings['subtitle'])){ echo '<span class="hero-subtitle">'.wp_kses_post($settings['subtitle']).'</span>'; } if(!empty($settings['title'])){ echo '<h1 class="hero-title">'.wp_kses_post($settings['title']).'</h1>'; } if(!empty($settings['desc'])){ echo '<p class="hero-text">'.wp_kses_post($settings['desc']).'</p>'; } echo '<div class="btn-group justify-content-center justify-content-lg-start">'; if(!empty($settings['button_text'])){ echo '<a href="'.esc_url( $settings['button_url']['url'] ).'" class="th-btn th_btn">'.wp_kses_post($settings['button_text']).'</a>'; } if(!empty($settings['button_text2'])){ echo '<a href="'.esc_url( $settings['button_url2']['url'] ).'" class="th-btn th_btn2 th-border2">'.wp_kses_post($settings['button_text2']).'</a>'; } echo '</div>'; echo '</div>'; echo '</div>'; echo '<div class="th-hero-img">'; if(!empty($settings['image2']['url'] )){ echo '<div class="hero-img6">'; echo poolax_img_tag( array( 'url' => esc_url( $settings['image2']['url'] ), )); echo '</div>'; } if(!empty($settings['image3']['url'] )){ echo '<div class="hero-shape">'; echo poolax_img_tag( array( 'url' => esc_url( $settings['image3']['url'] ), )); echo '</div>'; } echo '</div>'; echo '</div>'; }elseif( $settings['layout_style'] == '2' ){ echo '<div class="th-hero-wrapper hero-5" data-bg-src="'.esc_url($settings['image']['url']).'">'; echo '<div class="bottom-shape" data-bg-src="'.esc_url($settings['image2']['url']).'"></div>'; echo '<div class="container">'; echo '<div class="hero-style5">'; if( !empty($settings['title']) || !empty($settings['title2']) ){ echo '<h1 class="hero-title mb-0">'; echo wp_kses_post($settings['title']); echo wp_kses_post($settings['title2']); echo '</h1>'; } echo '<div class="btn-group justify-content-center mt-20">'; if(!empty($settings['button_text'])){ echo '<a href="'.esc_url( $settings['button_url']['url'] ).'" class="th-btn th_btn">'.wp_kses_post($settings['button_text']).'</a>'; } if(!empty($settings['button_text2'])){ echo '<a href="'.esc_url( $settings['button_url2']['url'] ).'" class="th-btn th_btn2 style3">'.wp_kses_post($settings['button_text2']).'</a>'; } echo '</div>'; echo '</div>'; echo '</div>'; echo '<div class="shape-mockup hero-shape1 spin d-none d-xxl-block" data-top="30%" data-left="5%">'; echo poolax_img_tag( array( 'url' => esc_url( $settings['image3']['url'] ), )); echo '</div>'; echo '<div class="shape-mockup hero-shape1 spin d-none d-xxl-block" data-top="10%" data-right="5%">'; echo poolax_img_tag( array( 'url' => esc_url( $settings['image4']['url'] ), )); echo '</div>'; echo '</div>'; }elseif( $settings['layout_style'] == '3' ){ echo '<div class="th-hero-wrapper bg-title hero-10">'; echo '<div class="hero-shape" data-bg-src="'.esc_url($settings['image']['url']).'"></div>'; echo '<div class="container">'; echo '<div class="row">'; echo '<div class="col-xl-7">'; echo '<div class="hero-style10">'; if(!empty($settings['subtitle'])){ echo '<span class="hero-subtitle">'.wp_kses_post($settings['subtitle']).'</span>'; } if(!empty($settings['title'])){ echo '<h1 class="hero-title">'.wp_kses_post($settings['title']).'</h1>'; } if(!empty($settings['desc'])){ echo '<p class="hero-text">'.wp_kses_post($settings['desc']).'</p>'; } echo '<div class="btn-group justify-content-center justify-content-xl-start">'; if(!empty($settings['button_text'])){ echo '<a href="'.esc_url( $settings['button_url']['url'] ).'" class="th-btn style4 th_btn">'.wp_kses_post($settings['button_text']).'</a>'; } if(!empty($settings['button_text2'])){ echo '<a href="'.esc_url( $settings['button_url2']['url'] ).'" class="th-btn th_btn2">'.wp_kses_post($settings['button_text2']).'</a>'; } echo '</div>'; echo '</div>'; echo '</div>'; echo '</div>'; echo '</div>'; if(!empty($settings['image2']['url'] )){ echo '<div class="th-hero-image">'; echo poolax_img_tag( array( 'url' => esc_url( $settings['image2']['url'] ), )); echo '</div>'; } echo '</div>'; }elseif( $settings['layout_style'] == '4' ){ echo '<div class="th-hero-wrapper hero-11">'; echo '<div class="th-hero-bg" data-bg-src="'.esc_url($settings['image']['url']).'"></div>'; echo '<div class="hero-shape11"></div>'; echo '<div class="container">'; echo '<div class="row align-items-center justify-content-center">'; echo '<div class="col-lg-10">'; echo '<div class="hero-style11">'; if(!empty($settings['subtitle'])){ echo '<div class="hero-subtitle">'.wp_kses_post($settings['subtitle']).'</div>'; } if(!empty($settings['title'])){ echo '<h1 class="hero-title">'.wp_kses_post($settings['title']).'</h1>'; } if(!empty($settings['desc'])){ echo '<p class="hero-text">'.wp_kses_post($settings['desc']).'</p>'; } if(!empty($settings['button_text'])){ echo '<div class="btn-group mt-30 justify-content-center justify-content-md-start">'; echo '<a href="'.esc_url( $settings['button_url']['url'] ).'" class="th-btn style8 th_btn">'.wp_kses_post($settings['button_text']).'</a>'; echo '</div>'; } echo '<div class="hero11-shape"></div>'; echo '</div>'; echo '</div>'; if(!empty($settings['video_url']['url'])){ echo '<div class="col-lg-2 text-center">'; echo '<div class="hero-video-1">'; echo '<a href="'.esc_url( $settings['video_url']['url'] ).'" class="video-play-btn popup-video" tabindex="0"><i class="fa-duotone fa-play"></i></a>'; echo '</div>'; echo '</div>'; } echo '</div>'; echo '</div>'; if($settings['show_social'] == 'yes'){ echo '<div class="social-links-wrap">'; if(!empty($settings['line_img']['url'] )){ echo '<div class="top-line">'; echo poolax_img_tag( array( 'url' => esc_url( $settings['line_img']['url'] ), )); echo '</div>'; } echo '<div class="social-links">'; foreach( $settings['social_lists'] as $data ){ echo '<a href="'.esc_url( $data['social_url']['url'] ).'">'; echo poolax_img_tag( array( 'url' => esc_url( $data['icon']['url'] ), )); echo '</a> '; } echo '</div>'; echo '</div>'; } echo '</div>'; } } } Submit