start_controls_section( 'section_contact_detail', [ 'label' => esc_html__('Contact Detail', 'business-roy'), ] ); $repeater = new Repeater(); $repeater->add_control( 'contact_detail_icon', [ 'label' => esc_html__('Contact Icon', 'business-roy'), 'type' => Controls_Manager::ICONS, 'default' => [ 'value' => 'fas fa-star', 'library' => 'solid', ], ] ); $repeater->add_control( 'contact_detail_label', [ 'label' => esc_html__('Contact Label', 'business-roy'), 'type' => Controls_Manager::TEXT, 'label_block' => true, 'default' => 'Contact Label' ] ); $repeater->add_control( 'contact_detail_desc', [ 'label' => esc_html__('Contact Description', 'business-roy'), 'type' => Controls_Manager::TEXTAREA, 'default' => esc_html__( 'Contact Description' , 'business-roy' ), 'placeholder' => esc_html__('Type your contact description here', 'business-roy'), ] ); $this->add_control( 'contact_list', [ 'label' => esc_html__('Contact Detail Items', 'business-roy'), 'type' => Controls_Manager::REPEATER, 'fields' => $repeater->get_controls(), 'default' => [ [ 'contact_detail_icon' => [ 'value' => 'fas fa-map-signs', 'library' => 'solid', ], 'contact_detail_label' => esc_html__( 'Office Location', 'business-roy' ), 'contact_detail_desc' => esc_html__( '5305 Creek CT Garland, TX 75043', 'business-roy' ) ], [ 'contact_detail_icon' => [ 'value' => 'fas fa-phone-volume', 'library' => 'solid', ], 'contact_detail_label' => esc_html__( 'Phone Number', 'business-roy' ), 'contact_detail_desc' => esc_html__( '+1 - (214) 838-0543 Or (214) 838-0543 ( Give us a free call 24/7 )', 'business-roy' ), ], [ 'contact_detail_icon' => [ 'value' => 'fas fa-envelope', 'library' => 'solid', ], 'contact_detail_label' => esc_html__( 'Write Us Mail', 'business-roy' ), 'contact_detail_desc' => esc_html__( 'example@example.com Or support@example.com', 'business-roy' ), ], ], 'title_field' => '{{{ contact_detail_label }}}', ] ); $this->add_control( 'shortcode', [ 'label' => esc_html__('Contact Form Shortcode', 'business-roy'), 'description' => sprintf(esc_html__('Install %s plugin to get the shortcode', 'business-roy'), 'Contact Form 7'), 'type' => Controls_Manager::TEXT, 'placeholder' => '[contact-form-7 id="0c5d3c9" title="Contact form 1"]', 'label_block' => true, 'separator' => 'after' ] ); $default_address = esc_html__('London Eye, London, United Kingdom', 'business-roy'); $this->add_control( 'address', [ 'label' => esc_html__('Location', 'business-roy'), 'type' => Controls_Manager::TEXT, 'dynamic' => [ 'active' => true, 'categories' => [ TagsModule::POST_META_CATEGORY, ], ], 'placeholder' => $default_address, 'default' => $default_address, 'label_block' => true, ] ); $this->add_control( 'zoom', [ 'label' => esc_html__('Zoom', 'business-roy'), 'type' => Controls_Manager::SLIDER, 'default' => [ 'size' => 15, ], 'range' => [ 'px' => [ 'min' => 1, 'max' => 20, ], ], 'separator' => 'before', ] ); $this->add_control( 'view', [ 'label' => esc_html__('View', 'business-roy'), 'type' => Controls_Manager::HIDDEN, 'default' => 'traditional', ] ); $this->end_controls_section(); $this->start_controls_section( 'section_settings', [ 'label' => esc_html__('General Style', 'business-roy'), 'tab' => Controls_Manager::TAB_STYLE, ] ); $this->add_responsive_control( 'contact_form_position', [ 'label' => esc_html__( 'Contact Row Position', 'business-roy' ), 'type' => Controls_Manager::CHOOSE, 'options' => [ 'start' => [ 'title' => esc_html__( 'Start', 'business-roy' ), 'icon' => "eicon-h-align-left", ], 'end' => [ 'title' => esc_html__( 'End', 'business-roy' ), 'icon' => "eicon-h-align-right", ], ], 'selectors_dictionary' => [ 'start' => 'flex-direction: row;', 'end' => 'flex-direction: row-reverse;', ], 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-content' => '{{VALUE}}', ], ] ); $this->add_responsive_control( 'contact_form_column_position', [ 'label' => esc_html__( 'Contact Column Position', 'business-roy' ), 'type' => Controls_Manager::CHOOSE, 'options' => [ 'before' => [ 'title' => esc_html__( 'Before', 'business-roy' ), 'icon' => 'eicon-v-align-top', ], 'after' => [ 'title' => esc_html__( 'After', 'business-roy' ), 'icon' => 'eicon-v-align-bottom', ], ], 'selectors_dictionary' => [ 'before' => 'display:flex; flex-direction: column;', 'after' => 'display:flex; flex-direction: column-reverse;', ], 'prefix_class' => 'iktheme-contact-position-', 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-area' => '{{VALUE}}', ] ] ); $this->end_controls_section(); $this->start_controls_section( 'contact_detail_style', [ 'label' => esc_html__('Contact Detail', 'business-roy'), 'tab' => Controls_Manager::TAB_STYLE, ] ); $this->start_controls_tabs( 'contact_detail_items' ); $this->start_controls_tab( 'contact_detail_item', [ 'label' => esc_html__('Items', 'business-roy'), ] ); $this->add_control( 'contact_detail_item_bg', [ 'label' => esc_html__('Background Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .ikthemes-touch' => 'background: {{VALUE}}', ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(),[ 'name' => 'contact_detail_item_box_shadow', 'selector' => '{{WRAPPER}} .ikthemes-touch', ] ); $this->add_responsive_control( 'contact_detail_item_padding', [ 'label' => esc_html__('Padding', 'business-roy'), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => ['px', '%', 'em'], 'selectors' => [ '{{WRAPPER}} .ikthemes-touch' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'contact_detail_item_icon', [ 'label' => esc_html__('Icon', 'business-roy'), ] ); $this->add_control( 'contact_detail_item_icon_color', [ 'label' => esc_html__('Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .ikthemes-touch-icon' => 'color: {{VALUE}}', '{{WRAPPER}} .ikthemes-touch-icon svg' => 'fill: {{VALUE}}', ], ] ); $this->add_responsive_control( 'contact_detail_item_icon_padding', [ 'label' => esc_html__('Padding', 'business-roy'), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => ['px', '%', 'em'], 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-area .ikthemes-touch-icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'contact_detail_item_detail', [ 'label' => esc_html__('Detail', 'business-roy'), ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'contact_detail_item_title_typography', 'label' => esc_html__('Title Typography', 'business-roy'), 'selector' => '{{WRAPPER}} .ikthemes-touch-title', ] ); $this->add_control( 'contact_detail_item_title_color', [ 'label' => esc_html__('Title Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .ikthemes-touch-title' => 'color: {{VALUE}}', ], ] ); $this->add_responsive_control( 'contact_detail_item_title_margin', [ 'label' => esc_html__('Title Margin', 'business-roy'), 'type' => Controls_Manager::DIMENSIONS, 'allowed_dimensions' => 'vertical', 'separator' => 'after', 'size_units' => ['px', '%', 'em'], 'selectors' => [ '{{WRAPPER}} .ikthemes-touch-title' => 'margin: {{TOP}}{{UNIT}} 0 {{BOTTOM}}{{UNIT}} 0;', ], ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'contact_detail_item_content_typography', 'label' => esc_html__('Content Typography', 'business-roy'), 'selector' => '{{WRAPPER}} .ikthemes-touch-content', ] ); $this->add_control( 'contact_detail_item_content_color', [ 'label' => esc_html__('Content Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .ikthemes-touch-content' => 'color: {{VALUE}}', ], ] ); $this->add_responsive_control( 'contact_detail_item_content_margin', [ 'label' => esc_html__('Content Margin', 'business-roy'), 'type' => Controls_Manager::DIMENSIONS, 'allowed_dimensions' => 'vertical', 'size_units' => ['px', '%', 'em'], 'selectors' => [ '{{WRAPPER}} .ikthemes-touch-content' => 'margin: {{TOP}}{{UNIT}} 0 {{BOTTOM}}{{UNIT}} 0;', ], ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); $this->start_controls_section( 'contact_form_style', [ 'label' => esc_html__('Contact Form', 'business-roy'), 'tab' => Controls_Manager::TAB_STYLE, ] ); $this->add_control( 'contact_detail_bg', [ 'label' => esc_html__('Background Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-detail' => 'background: {{VALUE}}', ], ] ); $this->add_responsive_control( 'contact_detail_padding', [ 'label' => esc_html__('Padding', 'business-roy'), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => ['px', '%', 'em'], 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-detail' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_control( 'contact_form_bg', [ 'label' => esc_html__('Background Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '#f9f9f9', 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-form' => 'background: {{VALUE}}', ], ] ); $this->add_control( 'contact_form_text_color', [ 'label' => esc_html__('Text Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '#112437', 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-form label, {{WRAPPER}} .ikthemes-contact-form h3, {{WRAPPER}} .ikthemes-contact-form h2, {{WRAPPER}} .ikthemes-contact-form h4' => 'color: {{VALUE}}', ], ] ); $this->add_control( 'contact_form_input_text_color', [ 'label' => esc_html__('Input Text Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '#112437', 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-form input[type="text"], {{WRAPPER}} .ikthemes-contact-form input[type="email"], {{WRAPPER}} .ikthemes-contact-form input[type="url"], {{WRAPPER}} .ikthemes-contact-form input[type="password"], {{WRAPPER}} .ikthemes-contact-form input[type="search"], {{WRAPPER}} .ikthemes-contact-form input[type="number"], {{WRAPPER}} .ikthemes-contact-form input[type="tel"], {{WRAPPER}} .ikthemes-contact-form input[type="range"], {{WRAPPER}} .ikthemes-contact-form input[type="date"], {{WRAPPER}} .ikthemes-contact-form input[type="month"], {{WRAPPER}} .ikthemes-contact-form input[type="week"], {{WRAPPER}} .ikthemes-contact-form input[type="time"], {{WRAPPER}} .ikthemes-contact-form input[type="datetime"], {{WRAPPER}} .ikthemes-contact-form input[type="datetime-local"], {{WRAPPER}} .ikthemes-contact-form input[type="color"], {{WRAPPER}} .ikthemes-contact-form textarea' => 'color: {{VALUE}}', ], ] ); $this->add_control( 'contact_form_input_border_color', [ 'label' => esc_html__('Input Border Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '#eeeeee', 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-form input[type="text"], {{WRAPPER}} .ikthemes-contact-form input[type="email"], {{WRAPPER}} .ikthemes-contact-form input[type="url"], {{WRAPPER}} .ikthemes-contact-form input[type="password"], {{WRAPPER}} .ikthemes-contact-form input[type="search"], {{WRAPPER}} .ikthemes-contact-form input[type="number"], {{WRAPPER}} .ikthemes-contact-form input[type="tel"], {{WRAPPER}} .ikthemes-contact-form input[type="range"], {{WRAPPER}} .ikthemes-contact-form input[type="date"], {{WRAPPER}} .ikthemes-contact-form input[type="month"], {{WRAPPER}} .ikthemes-contact-form input[type="week"], {{WRAPPER}} .ikthemes-contact-form input[type="time"], {{WRAPPER}} .ikthemes-contact-form input[type="datetime"], {{WRAPPER}} .ikthemes-contact-form input[type="datetime-local"], {{WRAPPER}} .ikthemes-contact-form input[type="color"], {{WRAPPER}} .ikthemes-contact-form textarea' => 'border-color: {{VALUE}}', ], ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'contact_form_typography', 'label' => esc_html__('Typography', 'business-roy'), 'selector' => '{{WRAPPER}} .ikthemes-contact-form label, {{WRAPPER}} .ikthemes-contact-form input[type="text"], {{WRAPPER}} .ikthemes-contact-form input[type="email"], {{WRAPPER}} .ikthemes-contact-form input[type="url"], {{WRAPPER}} .ikthemes-contact-form input[type="password"], {{WRAPPER}} .ikthemes-contact-form input[type="search"], {{WRAPPER}} .ikthemes-contact-form input[type="number"], {{WRAPPER}} .ikthemes-contact-form input[type="tel"], {{WRAPPER}} .ikthemes-contact-form input[type="range"], {{WRAPPER}} .ikthemes-contact-form input[type="date"], {{WRAPPER}} .ikthemes-contact-form input[type="month"], {{WRAPPER}} .ikthemes-contact-form input[type="week"], {{WRAPPER}} .ikthemes-contact-form input[type="time"], {{WRAPPER}} .ikthemes-contact-form input[type="datetime"], {{WRAPPER}} .ikthemes-contact-form input[type="datetime-local"], {{WRAPPER}} .ikthemes-contact-form input[type="color"], {{WRAPPER}} .ikthemes-contact-form textarea', ] ); $this->add_control( 'button_link_heading',[ 'type' => Controls_Manager::HEADING, 'label' => esc_html__( 'Submit Button', 'business-roy' ), 'separator' => 'before', ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'button_typography', 'label' => esc_html__('Typography', 'business-roy'), 'selector' => '{{WRAPPER}} .ikthemes-contact-form input[type="submit"], {{WRAPPER}} .ikthemes-contact-form input[type="button"]', ] ); $this->add_responsive_control( 'button_padding', [ 'label' => esc_html__('Padding', 'business-roy'), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => ['px', '%', 'em'], 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-form input[type="submit"], {{WRAPPER}} .ikthemes-contact-form input[type="button"]' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_responsive_control( 'button_radius', [ 'label' => esc_html__('Radius', 'business-roy'), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => ['px', '%', 'em'], 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-form input[type="submit"], {{WRAPPER}} .ikthemes-contact-form input[type="button"]' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Border::get_type(),[ 'name' => 'counter_border', 'selector' => '{{WRAPPER}} .ikthemes-contact-form input[type="submit"], {{WRAPPER}} .ikthemes-contact-form input[type="button"]', 'default' => 'none', ] ); $this->start_controls_tabs( 'button_style_tabs' ); $this->start_controls_tab( 'button_normal_tab', [ 'label' => __('Normal', 'business-roy'), ] ); $this->add_control( 'button_bg_color', [ 'label' => esc_html__('Background Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-form input[type="submit"], {{WRAPPER}} .ikthemes-contact-form input[type="button"]' => 'background-color: {{VALUE}}', ], ] ); $this->add_control( 'button_color', [ 'label' => esc_html__('Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-form input[type="submit"], {{WRAPPER}} .ikthemes-contact-form input[type="button"]' => 'color: {{VALUE}}', ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'button_hover_tab', [ 'label' => esc_html__('Hover', 'business-roy'), ] ); $this->add_control( 'button_bg_hover_color', [ 'label' => esc_html__('Background Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-form input[type="submit"]:hover, {{WRAPPER}} .ikthemes-contact-form input[type="button"]:hover' => 'background: {{VALUE}}', ], ] ); $this->add_control( 'button_hover_color', [ 'label' => esc_html__('Color', 'business-roy'), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{WRAPPER}} .ikthemes-contact-form input[type="submit"]:hover, {{WRAPPER}} .ikthemes-contact-form input[type="button"]:hover' => 'color: {{VALUE}}', ], ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); } /** Render Layout */ protected function render() { $settings = $this->get_settings_for_display(); ?>