PluginProbe ʕ •ᴥ•ʔ
ElementsKit Elementor Addons – Advanced Widgets & Templates Addons for Elementor / 4.0.1
ElementsKit Elementor Addons – Advanced Widgets & Templates Addons for Elementor v4.0.1
4.0.2 4.0.1 4.0.0 3.10.02 3.10.01 3.9.10 3.9.9 3.9.8 3.9.7 3.9.5 3.9.6 3.9.3 2.1.0 2.1.1 2.1.2 2.1.3 2.1.4 2.1.5 2.1.6 2.1.7 2.2.0 2.2.1 2.2.2 2.2.3 2.2.4 2.3.0 2.3.1 2.3.1.1 2.3.2 2.3.3 2.3.4 2.3.5 2.3.6 2.3.7 2.4.0 2.5.0 2.5.1 2.5.10 2.5.2 2.5.3 2.5.4 2.5.5 2.5.6 2.5.7 2.5.8 2.5.9 2.6.0 2.6.1 2.6.2 2.6.3 2.7.0 2.7.2 2.7.3 2.7.4 2.7.5 2.8.0 2.8.1 2.8.5 2.8.6 2.8.7 2.8.8 2.9.0 2.9.1 2.9.2 3.0.0 3.0.1 3.0.2 3.0.3 3.0.4 3.0.5 3.0.6 3.0.7 3.1.0 3.1.1 3.1.2 3.1.3 3.1.4 3.2.0 3.2.1 3.2.2 3.2.3 3.2.4 3.2.5 3.2.6 3.2.7 3.2.8 3.2.9 3.3.0 3.3.1 3.3.2 3.3.3 3.3.4 3.3.5 3.3.6 3.3.7 3.3.8 3.3.9 3.4.0 3.4.1 3.4.2 3.4.3 3.4.4 3.4.5 3.4.6 3.4.7 3.4.8 3.4.9 3.5.0 3.5.1 3.5.2 3.5.3 3.5.4 3.5.5 3.5.6 3.6.0 3.6.1 3.7.0 3.7.1 3.7.2 3.7.3 3.7.4 3.7.5 3.7.6 3.7.7 3.7.8 3.7.9 3.8.0 3.8.1 3.8.2 3.9.0 3.9.1 3.9.2 trunk 1.2.6 1.2.7 1.2.9 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.3.8 1.3.9 1.4.0 1.4.1 1.4.2 1.4.3 1.4.4 1.4.5 1.4.7 1.4.8 1.4.9 1.5.0 1.5.1 1.5.10 1.5.11 1.5.12 1.5.2 1.5.4 1.5.5 1.5.6 1.5.7 1.5.8 1.5.9 2.0.0 2.0.1 2.0.10 2.0.11 2.0.12 2.0.13 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 2.0.7 2.0.8 2.0.9 2.0.9.1 2.0.9.2 2.0.9.3
elementskit-lite / widgets / dual-button / dual-button.php
elementskit-lite / widgets / dual-button Last commit date
dual-button-handler.php 3 years ago dual-button.php 3 weeks ago
dual-button.php
1080 lines
1 <?php
2 namespace Elementor;
3
4 use \Elementor\ElementsKit_Widget_Dual_Button_Handler as Handler;
5 use \ElementsKit_Lite\Modules\Controls\Controls_Manager as ElementsKit_Controls_Manager;
6
7 if ( ! defined( 'ABSPATH' ) ) exit;
8
9
10 class ElementsKit_Widget_Dual_Button extends Widget_Base {
11 use \ElementsKit_Lite\Widgets\Widget_Notice;
12
13 public $base;
14
15 public function get_name() {
16 return Handler::get_name();
17 }
18
19 public function get_title() {
20 return Handler::get_title();
21 }
22
23 public function get_icon() {
24 return Handler::get_icon();
25 }
26
27 public function get_categories() {
28 return Handler::get_categories();
29 }
30
31 public function get_keywords() {
32 return Handler::get_keywords();
33 }
34
35 public function get_help_url() {
36 return 'https://wpmet.com/doc/dual-button/';
37 }
38
39 public function get_style_depends() {
40 return ['ekit-dual-button'];
41 }
42
43 protected function is_dynamic_content(): bool {
44 return false;
45 }
46
47 public function has_widget_inner_wrapper(): bool {
48 return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
49 }
50
51 protected function register_controls() {
52
53 $this->start_controls_section(
54 'dualbutton_content',
55 [
56 'label' => esc_html__( 'Double Button', 'elementskit-lite' ),
57 ]
58 );
59
60 $this->add_control(
61 'ekit_show_button_middle_text',
62 [
63 'label' => esc_html__( 'Middle Text', 'elementskit-lite' ),
64 'type' => Controls_Manager::SWITCHER,
65 ]
66 );
67
68 $this->add_control(
69 'ekit_button_middle_text',
70 [
71 'label' => esc_html__( 'Text', 'elementskit-lite' ),
72 'type' => Controls_Manager::TEXT,
73 'default' => esc_html__( 'Or', 'elementskit-lite' ),
74 'condition' => [
75 'ekit_show_button_middle_text' => 'yes',
76 ],
77 'dynamic' => [
78 'active' => true,
79 ],
80 ]
81 );
82
83 $this->add_responsive_control(
84 'ekit_double_button_align',
85 [
86 'label' => esc_html__( 'Alignment', 'elementskit-lite' ),
87 'type' => Controls_Manager::CHOOSE,
88 'options' => [
89 'start' => [
90 'title' => esc_html__( 'Left', 'elementskit-lite' ),
91 'icon' => 'eicon-text-align-left',
92 ],
93 'center' => [
94 'title' => esc_html__( 'Center', 'elementskit-lite' ),
95 'icon' => 'eicon-text-align-center',
96 ],
97 'end' => [
98 'title' => esc_html__( 'Right', 'elementskit-lite' ),
99 'icon' => 'eicon-text-align-right',
100 ],
101 ],
102 'prefix_class' => 'elementor-widget-elementskit-dual-button%s-',
103 ]
104 );
105
106 $this->add_responsive_control(
107 'ekit_dual_button_width',
108 [
109 'label' => esc_html__( 'Button Width', 'elementskit-lite' ),
110 'type' => Controls_Manager::SLIDER,
111 'range' => [
112 '%' => [
113 'max' => 100,
114 'min' => 20,
115 ],
116 'px' => [
117 'max' => 1200,
118 'min' => 300,
119 ],
120 ],
121 'size_units' => ['%', 'px'],
122 'default' => [
123 'size' => 40,
124 'unit' => '%',
125 ],
126 'tablet_default' => [
127 'size' => 80,
128 'unit' => '%',
129 ],
130 'mobile_default' => [
131 'size' => 100,
132 'unit' => '%',
133 ],
134 'selectors' => [
135 '{{WRAPPER}} .ekit_double_button' => 'width: {{SIZE}}{{UNIT}};',
136 ],
137 ]
138 );
139
140 $this->add_responsive_control(
141 'ekit_dual_button_gap',
142 [
143 'label' => esc_html__( 'Button Gap', 'elementskit-lite' ),
144 'type' => Controls_Manager::SLIDER,
145 'default' => [
146 'size' => 5,
147 ],
148 'range' => [
149 'px' => [
150 'min' => 0,
151 'max' => 100,
152 ],
153 ],
154 'selectors' => [
155 '{{WRAPPER}} .ekit-double-btn:not(:last-child)' => 'margin-right: {{SIZE}}px;',
156 ],
157 'condition' => [
158 'ekit_show_button_middle_text!' => 'yes',
159 ],
160 ]
161 );
162
163 $this->end_controls_section();
164
165 // Button One
166 $this->start_controls_section(
167 'ekit_button_one_content',
168 [
169 'label' => esc_html__( 'Button One', 'elementskit-lite' ),
170 ]
171 );
172 $this->add_control(
173 'ekit_button_one_text',
174 [
175 'label' => esc_html__( 'Text', 'elementskit-lite' ),
176 'type' => Controls_Manager::TEXT,
177 'default' => esc_html__( 'Button', 'elementskit-lite' ),
178 'dynamic' => [
179 'active' => true,
180 ],
181 ]
182 );
183
184 $this->add_control(
185 'ekit_button_one_link',
186 [
187 'label' => esc_html__( 'Link', 'elementskit-lite' ),
188 'type' => Controls_Manager::URL,
189 'placeholder' => esc_html( 'https://wpmet.com'),
190 'show_external' => true,
191 'default' => [
192 'url' => '#',
193 'is_external' => false,
194 'nofollow' => false,
195 ],
196 'dynamic' => [
197 'active' => true,
198 ],
199 ]
200 );
201
202 $this->add_control(
203 'ekit_button_one_icons__switch',
204 [
205 'label' => esc_html__('Add icon? ', 'elementskit-lite'),
206 'type' => Controls_Manager::SWITCHER,
207 'default' => 'yes',
208 'label_on' =>esc_html__( 'Yes', 'elementskit-lite' ),
209 'label_off' =>esc_html__( 'No', 'elementskit-lite' ),
210 ]
211 );
212
213 $this->add_control(
214 'ekit_button_one_icons',
215 [
216 'label' => __( 'Icon', 'elementskit-lite' ),
217 'type' => Controls_Manager::ICONS,
218 'fa4compatibility' => 'ekit_button_one_icon',
219 'default' => [
220 'value' => '',
221 ],
222 'condition' => [
223 'ekit_button_one_icons__switch' => 'yes'
224 ]
225 ]
226 );
227
228 $this->add_control(
229 'ekit_double_button_one_icon_position',
230 [
231 'label' => esc_html__( 'Icon Position', 'elementskit-lite' ),
232 'type' => Controls_Manager::SELECT,
233 'default' => 'before',
234 'options' => [
235 'before' => esc_html__( 'Before', 'elementskit-lite' ),
236 'after' => esc_html__( 'After', 'elementskit-lite' ),
237 ],
238 'condition' => [
239 'ekit_button_one_icons__switch' => 'yes'
240 ]
241 ]
242 );
243
244 $this->add_responsive_control(
245 'ekit_double_button_one_icon_before_specing',
246 [
247 'label' => esc_html__( 'Icon Spacing', 'elementskit-lite' ),
248 'type' => Controls_Manager::SLIDER,
249 'range' => [
250 'px' => [
251 'max' => 150,
252 ],
253 ],
254 'default' => [
255 'size' => 8,
256 ],
257 'selectors' => [
258 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one > i' => 'padding-right: {{SIZE}}{{UNIT}};',
259 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one > svg' => 'margin-right: {{SIZE}}{{UNIT}};',
260 ],
261 'condition' => [
262 'ekit_button_one_icons__switch' => 'yes',
263 'ekit_double_button_one_icon_position' => 'before',
264 ]
265 ]
266 );
267
268 $this->add_responsive_control(
269 'ekit_double_button_one_icon_after_specing',
270 [
271 'label' => esc_html__( 'Icon Spacing', 'elementskit-lite' ),
272 'type' => Controls_Manager::SLIDER,
273 'range' => [
274 'px' => [
275 'max' => 150,
276 ],
277 ],
278 'default' => [
279 'size' => 8,
280 ],
281 'selectors' => [
282 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one > i' => 'padding-left: {{SIZE}}{{UNIT}};',
283 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one > svg' => 'margin-left: {{SIZE}}{{UNIT}};',
284 ],
285 'condition' => [
286 'ekit_button_one_icons__switch' => 'yes',
287 'ekit_double_button_one_icon_position' => 'after',
288 ]
289 ]
290 );
291
292 $this->end_controls_section(); // Button One End
293
294 // Button Two
295 $this->start_controls_section(
296 'ekit_button_two_content',
297 [
298 'label' => esc_html__( 'Button Two', 'elementskit-lite' ),
299 ]
300 );
301 $this->add_control(
302 'ekit_button_two_text',
303 [
304 'label' => esc_html__( 'Text', 'elementskit-lite' ),
305 'type' => Controls_Manager::TEXT,
306 'default' => esc_html__( 'Button', 'elementskit-lite' ),
307 'dynamic' => [
308 'active' => true,
309 ],
310 ]
311 );
312
313 $this->add_control(
314 'ekit_button_two_link',
315 [
316 'label' => esc_html__( 'Link', 'elementskit-lite' ),
317 'type' => Controls_Manager::URL,
318 'placeholder' => esc_html__( 'https://wpmet.com', 'elementskit-lite' ),
319 'show_external' => true,
320 'default' => [
321 'url' => '#',
322 'is_external' => false,
323 'nofollow' => false,
324 ],
325 'dynamic' => [
326 'active' => true,
327 ],
328 ]
329 );
330
331 $this->add_control(
332 'ekit_button_two_icons__switch',
333 [
334 'label' => esc_html__('Add icon? ', 'elementskit-lite'),
335 'type' => Controls_Manager::SWITCHER,
336 'default' => 'yes',
337 'label_on' =>esc_html__( 'Yes', 'elementskit-lite' ),
338 'label_off' =>esc_html__( 'No', 'elementskit-lite' ),
339 ]
340 );
341
342 $this->add_control(
343 'ekit_button_two_icons',
344 [
345 'label' => __( 'Icon', 'elementskit-lite' ),
346 'type' => Controls_Manager::ICONS,
347 'fa4compatibility' => 'ekit_button_two_icon',
348 'default' => [
349 'value' => '',
350 ],
351 'condition' => [
352 'ekit_button_two_icons__switch' => 'yes'
353 ]
354 ]
355 );
356
357 $this->add_control(
358 'ekit_double_button_two_icon_position',
359 [
360 'label' => esc_html__( 'Icon Position', 'elementskit-lite' ),
361 'type' => Controls_Manager::SELECT,
362 'default' => 'before',
363 'options' => [
364 'before' => esc_html__( 'Before', 'elementskit-lite' ),
365 'after' => esc_html__( 'After', 'elementskit-lite' ),
366 ],
367 'condition' => [
368 'ekit_button_two_icons__switch' => 'yes'
369 ]
370 ]
371 );
372
373 $this->add_responsive_control(
374 'ekit_double_button_two_icon_before_specing',
375 [
376 'label' => esc_html__( 'Icon Spacing', 'elementskit-lite' ),
377 'type' => Controls_Manager::SLIDER,
378 'range' => [
379 'px' => [
380 'max' => 150,
381 ],
382 ],
383 'default' => [
384 'size' => 8,
385 ],
386 'selectors' => [
387 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two > i' => 'padding-right: {{SIZE}}{{UNIT}};',
388 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two > svg' => 'margin-right: {{SIZE}}{{UNIT}};',
389 ],
390 'condition' => [
391 'ekit_button_two_icons__switch' => 'yes',
392 'ekit_double_button_two_icon_position' => 'before',
393 ]
394 ]
395 );
396
397 $this->add_responsive_control(
398 'ekit_double_button_two_icon_after_specing',
399 [
400 'label' => esc_html__( 'Icon Spacing', 'elementskit-lite' ),
401 'type' => Controls_Manager::SLIDER,
402 'range' => [
403 'px' => [
404 'max' => 150,
405 ],
406 ],
407 'default' => [
408 'size' => 8,
409 ],
410 'selectors' => [
411 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two > i' => 'padding-left: {{SIZE}}{{UNIT}};',
412 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two > svg' => 'margin-left: {{SIZE}}{{UNIT}};',
413 ],
414 'condition' => [
415 'ekit_button_two_icons__switch' => 'yes',
416 'ekit_double_button_two_icon_position' => 'after',
417 ]
418 ]
419 );
420
421 $this->end_controls_section(); // Button Two End
422
423
424 // Button One Style tab Start
425 $this->start_controls_section(
426 'ekit_double_button_one_style_section',
427 [
428 'label' => esc_html__( 'Button One', 'elementskit-lite' ),
429 'tab' => Controls_Manager::TAB_STYLE,
430 ]
431 );
432
433 $this->start_controls_tabs('ekit_double_button_one_style_tabs');
434
435 // Button Default Normal style start
436 $this->start_controls_tab(
437 'ekit_double_button_one_style_normal_tab',
438 [
439 'label' => esc_html__( 'Normal', 'elementskit-lite' ),
440 ]
441 );
442
443 $this->add_control(
444 'ekit_double_button_one_color',
445 [
446 'label' => esc_html__( 'Color', 'elementskit-lite' ),
447 'type' => Controls_Manager::COLOR,
448 'default' =>'#ffffff',
449 'selectors' => [
450 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one' => 'color: {{VALUE}};',
451 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one svg' => 'fill: {{VALUE}};',
452 ],
453 ]
454 );
455
456 $this->add_group_control(
457 Group_Control_Typography::get_type(),
458 [
459 'name' => 'ekit_double_button_one_typography',
460 'label' => esc_html__( 'Typography', 'elementskit-lite' ),
461 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one',
462 ]
463 );
464
465 $this->add_responsive_control(
466 'ekit_double_button_one_icon_font_size',
467 [
468 'label' => esc_html__( 'Icon font size', 'elementskit-lite' ),
469 'type' => Controls_Manager::SLIDER,
470 'size_units' => [ 'px' ],
471 'selectors' => [
472 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one > i' => 'font-size: {{SIZE}}{{UNIT}};',
473 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one > svg' => 'max-width: {{SIZE}}{{UNIT}};',
474 ],
475 ]
476 );
477
478 $this->add_group_control(
479 Group_Control_Border::get_type(),
480 [
481 'name' => 'ekit_double_button_one_border',
482 'label' => esc_html__( 'Border', 'elementskit-lite' ),
483 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one',
484 ]
485 );
486
487 $this->add_responsive_control(
488 'ekit_double_button_one_border_radius',
489 [
490 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
491 'type' => Controls_Manager::DIMENSIONS,
492 'size_units' => [ 'px', '%', 'em' ],
493 'selectors' => [
494 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
495 ],
496 ]
497 );
498
499 $this->add_group_control(
500 Group_Control_Background::get_type(),
501 [
502 'name' => 'ekit_double_button_one_background',
503 'label' => esc_html__( 'Background', 'elementskit-lite' ),
504 'types' => [ 'classic', 'gradient' ],
505 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one',
506 'separator' => 'before',
507 ]
508 );
509
510 $this->add_group_control(
511 Group_Control_Box_Shadow::get_type(),
512 [
513 'name' => 'ekit_double_button_one_box_shadow',
514 'label' => esc_html__( 'Box Shadow', 'elementskit-lite' ),
515 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one',
516 ]
517 );
518
519 $this->add_responsive_control(
520 'ekit_double_button_one_padding',
521 [
522 'label' => esc_html__( 'Padding', 'elementskit-lite' ),
523 'type' => Controls_Manager::DIMENSIONS,
524 'size_units' => [ 'px', '%', 'em' ],
525 'selectors' => [
526 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
527 ],
528 'separator' => 'before',
529 ]
530 );
531
532 $this->add_responsive_control(
533 'ekit_double_button_one_margin',
534 [
535 'label' => esc_html__( 'Margin', 'elementskit-lite' ),
536 'type' => Controls_Manager::DIMENSIONS,
537 'size_units' => [ 'px', '%', 'em' ],
538 'selectors' => [
539 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
540 ],
541 ]
542 );
543
544 $this->add_responsive_control(
545 'ekit_double_button_one_align',
546 [
547 'label' => esc_html__( 'Alignment', 'elementskit-lite' ),
548 'type' => Controls_Manager::CHOOSE,
549 'options' => [
550 'start' => [
551 'title' => esc_html__( 'Left', 'elementskit-lite' ),
552 'icon' => 'eicon-text-align-left',
553 ],
554 'center' => [
555 'title' => esc_html__( 'Center', 'elementskit-lite' ),
556 'icon' => 'eicon-text-align-center',
557 ],
558 'end' => [
559 'title' => esc_html__( 'Right', 'elementskit-lite' ),
560 'icon' => 'eicon-text-align-right',
561 ],
562 'justify' => [
563 'title' => esc_html__( 'Justified', 'elementskit-lite' ),
564 'icon' => 'eicon-text-align-justify',
565 ],
566 ],
567 'default' => '',
568 'selectors' => [
569 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one' => 'text-align: {{VALUE}};',
570 ],
571 ]
572 );
573
574 $this->end_controls_tab(); // Button One Normal style End
575
576 // Button One Hover style start
577 $this->start_controls_tab(
578 'ekit_double_button_one_style_hover_tab',
579 [
580 'label' => esc_html__( 'Hover', 'elementskit-lite' ),
581 ]
582 );
583
584 $this->add_control(
585 'ekit_double_button_one_hover_color',
586 [
587 'label' => esc_html__( 'Color', 'elementskit-lite' ),
588 'type' => Controls_Manager::COLOR,
589 'default' =>'#ffffff',
590 'selectors' => [
591 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one:hover' => 'color: {{VALUE}};',
592 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one:hover svg' => 'fill: {{VALUE}};',
593 ],
594 ]
595 );
596
597 $this->add_group_control(
598 Group_Control_Border::get_type(),
599 [
600 'name' => 'ekit_double_button_one_hover_border',
601 'label' => esc_html__( 'Border', 'elementskit-lite' ),
602 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one:hover',
603 ]
604 );
605
606 $this->add_responsive_control(
607 'ekit_double_button_one_hover_border_radius',
608 [
609 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
610 'type' => Controls_Manager::DIMENSIONS,
611 'size_units' => [ 'px', '%', 'em' ],
612 'selectors' => [
613 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one:hover' => 'border-radius: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
614 ],
615 ]
616 );
617
618 $this->add_group_control(
619 Group_Control_Background::get_type(),
620 [
621 'name' => 'ekit_double_button_one_hover_background',
622 'label' => esc_html__( 'Background', 'elementskit-lite' ),
623 'types' => [ 'classic', 'gradient' ],
624 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one:hover',
625 'separator' => 'before',
626 ]
627 );
628
629 $this->add_group_control(
630 Group_Control_Box_Shadow::get_type(),
631 [
632 'name' => 'ekit_double_button_one_hover_box_shadow',
633 'label' => esc_html__( 'Box Shadow', 'elementskit-lite' ),
634 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-one:hover',
635 ]
636 );
637
638 $this->end_controls_tab(); // Button one Hover style End
639
640 $this->end_controls_tabs();
641
642 $this->end_controls_section(); // Button One Style tab end
643
644 // Button two Style tab Start
645 $this->start_controls_section(
646 'ekit_double_button_two_style_section',
647 [
648 'label' => esc_html__( 'Button Two', 'elementskit-lite' ),
649 'tab' => Controls_Manager::TAB_STYLE,
650 ]
651 );
652
653 $this->start_controls_tabs('ekit_double_button_two_style_tabs');
654
655 // Button Two Normal style start
656 $this->start_controls_tab(
657 'ekit_double_button_two_style_normal_tab',
658 [
659 'label' => esc_html__( 'Normal', 'elementskit-lite' ),
660 ]
661 );
662
663 $this->add_control(
664 'ekit_double_button_two_color',
665 [
666 'label' => esc_html__( 'Color', 'elementskit-lite' ),
667 'type' => Controls_Manager::COLOR,
668 'default' =>'#ffffff',
669 'selectors' => [
670 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two' => 'color: {{VALUE}};',
671 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two svg' => 'fill: {{VALUE}};',
672 ],
673 ]
674 );
675
676 $this->add_group_control(
677 Group_Control_Typography::get_type(),
678 [
679 'name' => 'ekit_double_button_two_typography',
680 'label' => esc_html__( 'Typography', 'elementskit-lite' ),
681 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two',
682 ]
683 );
684
685 $this->add_responsive_control(
686 'ekit_double_button_two_icon_font_size',
687 [
688 'label' => esc_html__( 'Icon font size', 'elementskit-lite' ),
689 'type' => Controls_Manager::SLIDER,
690 'size_units' => [ 'px' ],
691 'selectors' => [
692 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two > i' => 'font-size: {{SIZE}}{{UNIT}};',
693 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two > svg' => 'max-width: {{SIZE}}{{UNIT}};',
694 ],
695 ]
696 );
697
698 $this->add_group_control(
699 Group_Control_Border::get_type(),
700 [
701 'name' => 'ekit_double_button_two_border',
702 'label' => esc_html__( 'Border', 'elementskit-lite' ),
703 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two',
704 ]
705 );
706
707 $this->add_responsive_control(
708 'ekit_double_button_two_border_radius',
709 [
710 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
711 'type' => Controls_Manager::DIMENSIONS,
712 'size_units' => [ 'px', '%', 'em' ],
713 'selectors' => [
714 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
715 ],
716 ]
717 );
718
719 $this->add_group_control(
720 Group_Control_Background::get_type(),
721 [
722 'name' => 'ekit_double_button_two_background',
723 'label' => esc_html__( 'Background', 'elementskit-lite' ),
724 'types' => [ 'classic', 'gradient' ],
725 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two',
726 'separator' => 'before',
727 ]
728 );
729
730 $this->add_group_control(
731 Group_Control_Box_Shadow::get_type(),
732 [
733 'name' => 'ekit_double_button_two_box_shadow',
734 'label' => esc_html__( 'Box Shadow', 'elementskit-lite' ),
735 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two',
736 ]
737 );
738
739 $this->add_responsive_control(
740 'ekit_double_button_two_padding',
741 [
742 'label' => esc_html__( 'Padding', 'elementskit-lite' ),
743 'type' => Controls_Manager::DIMENSIONS,
744 'size_units' => [ 'px', '%', 'em' ],
745 'selectors' => [
746 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
747 ],
748 'separator' => 'before',
749 ]
750 );
751
752 $this->add_responsive_control(
753 'ekit_double_button_two_margin',
754 [
755 'label' => esc_html__( 'Margin', 'elementskit-lite' ),
756 'type' => Controls_Manager::DIMENSIONS,
757 'size_units' => [ 'px', '%', 'em' ],
758 'selectors' => [
759 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
760 ],
761 ]
762 );
763
764 $this->add_responsive_control(
765 'ekit_double_button_two_align',
766 [
767 'label' => esc_html__( 'Alignment', 'elementskit-lite' ),
768 'type' => Controls_Manager::CHOOSE,
769 'options' => [
770 'start' => [
771 'title' => esc_html__( 'Left', 'elementskit-lite' ),
772 'icon' => 'eicon-text-align-left',
773 ],
774 'center' => [
775 'title' => esc_html__( 'Center', 'elementskit-lite' ),
776 'icon' => 'eicon-text-align-center',
777 ],
778 'end' => [
779 'title' => esc_html__( 'Right', 'elementskit-lite' ),
780 'icon' => 'eicon-text-align-right',
781 ],
782 'justify' => [
783 'title' => esc_html__( 'Justified', 'elementskit-lite' ),
784 'icon' => 'eicon-text-align-justify',
785 ],
786 ],
787 'selectors' => [
788 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two' => 'text-align: {{VALUE}};',
789 ],
790 ]
791 );
792
793 $this->end_controls_tab(); // Button two Normal style End
794
795 // Button Two Hover style start
796 $this->start_controls_tab(
797 'ekit_double_button_two_style_hover_tab',
798 [
799 'label' => esc_html__( 'Hover', 'elementskit-lite' ),
800 ]
801 );
802 $this->add_control(
803 'ekit_double_button_two_hover_color',
804 [
805 'label' => esc_html__( 'Color', 'elementskit-lite' ),
806 'type' => Controls_Manager::COLOR,
807 'default' =>'#ffffff',
808 'selectors' => [
809 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two:hover' => 'color: {{VALUE}};',
810 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two:hover svg' => 'fill: {{VALUE}};',
811 ],
812 ]
813 );
814
815 $this->add_group_control(
816 Group_Control_Border::get_type(),
817 [
818 'name' => 'ekit_double_button_two_hover_border',
819 'label' => esc_html__( 'Border', 'elementskit-lite' ),
820 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two:hover',
821 ]
822 );
823
824 $this->add_responsive_control(
825 'ekit_double_button_two_hover_border_radius',
826 [
827 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
828 'type' => Controls_Manager::DIMENSIONS,
829 'size_units' => [ 'px', '%', 'em' ],
830 'selectors' => [
831 '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
832 ],
833 ]
834 );
835
836 $this->add_group_control(
837 Group_Control_Background::get_type(),
838 [
839 'name' => 'ekit_double_button_two_hover_background',
840 'label' => esc_html__( 'Background', 'elementskit-lite' ),
841 'types' => [ 'classic', 'gradient' ],
842 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two:hover',
843 'separator' => 'before',
844 ]
845 );
846
847 $this->add_group_control(
848 Group_Control_Box_Shadow::get_type(),
849 [
850 'name' => 'ekit_double_button_two_hover_box_shadow',
851 'label' => esc_html__( 'Box Shadow', 'elementskit-lite' ),
852 'selector' => '{{WRAPPER}} .ekit-double-btn.ekit-double-btn-two:hover',
853 ]
854 );
855
856 $this->end_controls_tab(); // Button two Hover style End
857
858 $this->end_controls_tabs();
859
860 $this->end_controls_section(); // Button two Style tab end
861
862 // Button Middle Text style start
863 $this->start_controls_section(
864 'ekit_double_button_middletext_style_section',
865 [
866 'label' => esc_html__( 'Middle Text', 'elementskit-lite' ),
867 'tab' => Controls_Manager::TAB_STYLE,
868 'condition'=>[
869 'ekit_show_button_middle_text'=>'yes',
870 'ekit_button_middle_text!'=>'',
871 ]
872 ]
873 );
874 $this->add_control(
875 'ekit_double_button_middletext_color',
876 [
877 'label' => esc_html__( 'Color', 'elementskit-lite' ),
878 'type' => Controls_Manager::COLOR,
879 'default' =>'#000000',
880 'selectors' => [
881 '{{WRAPPER}} .ekit-wid-con .ekit_button_middle_text' => 'color: {{VALUE}};',
882 ],
883 ]
884 );
885
886 $this->add_group_control(
887 Group_Control_Typography::get_type(),
888 [
889 'name' => 'ekit_double_button_middletext_typography',
890 'label' => esc_html__( 'Typography', 'elementskit-lite' ),
891 'selector' => '{{WRAPPER}} .ekit-wid-con .ekit_button_middle_text',
892 ]
893 );
894
895 $this->add_group_control(
896 Group_Control_Border::get_type(),
897 [
898 'name' => 'ekit_double_button_middletext_border',
899 'label' => esc_html__( 'Border', 'elementskit-lite' ),
900 'selector' => '{{WRAPPER}} .ekit-wid-con .ekit_button_middle_text',
901 ]
902 );
903
904 $this->add_responsive_control(
905 'ekit_double_button_middletext_border_radius',
906 [
907 'label' => esc_html__( 'Border Radius', 'elementskit-lite' ),
908 'type' => Controls_Manager::DIMENSIONS,
909 'size_units' => [ 'px', '%', 'em' ],
910 'selectors' => [
911 '{{WRAPPER}} .ekit-wid-con .ekit_button_middle_text' => 'border-radius: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
912 ],
913 ]
914 );
915
916 $this->add_group_control(
917 Group_Control_Background::get_type(),
918 [
919 'name' => 'ekit_double_button_middletext_background',
920 'label' => esc_html__( 'Background', 'elementskit-lite' ),
921 'types' => [ 'classic', 'gradient' ],
922 'selector' => '{{WRAPPER}} .ekit-wid-con .ekit_button_middle_text',
923 'separator' => 'before',
924 ]
925 );
926
927 $this->add_group_control(
928 Group_Control_Box_Shadow::get_type(),
929 [
930 'name' => 'ekit_double_button_middletext_box_shadow',
931 'label' => esc_html__( 'Box Shadow', 'elementskit-lite' ),
932 'selector' => '{{WRAPPER}} .ekit-wid-con .ekit_button_middle_text',
933 ]
934 );
935
936 $this->add_responsive_control(
937 'ekit_double_button_middletext_width',
938 [
939 'label' => esc_html__( 'Width', 'elementskit-lite' ),
940 'type' => Controls_Manager::SLIDER,
941 'size_units' => [ 'px' ],
942 'range' => [
943 'px' => [
944 'min' => 10,
945 'max' => 140,
946 'step' => 1,
947 ],
948 ],
949 'default' => [
950 'unit' => 'px',
951 'size' => 40,
952 ],
953 'selectors' => [
954 '{{WRAPPER}} .ekit-wid-con .ekit_button_middle_text' => 'width: {{SIZE}}{{UNIT}};',
955 ],
956 ]
957 );
958
959 $this->add_responsive_control(
960 'ekit_double_button_middletext_height',
961 [
962 'label' => esc_html__( 'Height', 'elementskit-lite' ),
963 'type' => Controls_Manager::SLIDER,
964 'size_units' => [ 'px' ],
965 'range' => [
966 'px' => [
967 'min' => 10,
968 'max' => 140,
969 'step' => 1,
970 ],
971 ],
972 'default' => [
973 'unit' => 'px',
974 'size' => 40,
975 ],
976 'selectors' => [
977 '{{WRAPPER}} .ekit-wid-con .ekit_button_middle_text' => 'height: {{SIZE}}{{UNIT}};',
978 ],
979 ]
980 );
981
982 $this->end_controls_section(); //Button Middle Text Style tab end
983
984 $this->insert_pro_message();
985 }
986
987 protected function render( ) {
988 echo '<div class="ekit-wid-con" >
989 <div class="ekit-element-align-wrapper">
990 <div class="ekit_double_button">';
991 $this->render_raw();
992 echo ' </div>
993 </div>
994 </div>';
995 }
996
997 protected function render_raw( ) {
998 $settings = $this->get_settings_for_display();
999
1000 // fw_print($settings['ekit_button_one_icons']);
1001 // fw_print($settings['ekit_button_one_link']);
1002
1003 // Button One
1004 if ( ! empty( $settings['ekit_button_one_link']['url'] ) ) {
1005
1006 // new icon
1007 $migrated = isset( $settings['__fa4_migrated']['ekit_button_one_icons'] );
1008 // Check if its a new widget without previously selected icon using the old Icon control
1009 $is_new = empty( $settings['ekit_button_one_icon'] );
1010
1011
1012 if ( ! empty( $settings['ekit_button_one_link']['url'] ) ) {
1013 $this->add_link_attributes( 'button-1', $settings['ekit_button_one_link'] );
1014 }
1015
1016 ?>
1017 <a class="ekit-double-btn ekit-double-btn-one" <?php echo $this->get_render_attribute_string( 'button-1' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Already escaped by elementor ?>>
1018 <?php
1019 if ($settings['ekit_double_button_one_icon_position'] == 'before') {
1020 if ($is_new || $migrated) {
1021 Icons_Manager::render_icon( $settings['ekit_button_one_icons'], [ 'aria-hidden' => 'true' ] );
1022 } else {
1023 echo '<i class="'. esc_attr($settings['ekit_button_one_icon']) .'" aria-hidden="true"></i>';
1024 }
1025 }
1026 echo esc_html($settings['ekit_button_one_text']);
1027 if ($settings['ekit_double_button_one_icon_position'] == 'after') {
1028 if ($is_new || $migrated) {
1029 Icons_Manager::render_icon( $settings['ekit_button_one_icons'], [ 'aria-hidden' => 'true' ] );
1030 } else {
1031 echo '<i class="'. esc_attr($settings['ekit_button_one_icon']) .'" aria-hidden="true"></i>';
1032 }
1033 }
1034 ?>
1035 </a>
1036 <?php
1037 }
1038
1039
1040 if( $settings['ekit_show_button_middle_text'] == 'yes' && !empty( $settings['ekit_button_middle_text'] ) ){
1041 echo "<span class='ekit_button_middle_text'>". esc_html($settings['ekit_button_middle_text']) ."</span>";
1042 }
1043
1044 // Button Two
1045 // new icon
1046 $migrated = isset( $settings['__fa4_migrated']['ekit_button_two_icons'] );
1047 // Check if its a new widget without previously selected icon using the old Icon control
1048 $is_new = empty( $settings['ekit_button_two_icon'] );
1049
1050 if ( ! empty( $settings['ekit_button_two_link']['url'] ) ) {
1051
1052 if ( ! empty( $settings['ekit_button_two_link']['url'] ) ) {
1053 $this->add_link_attributes( 'button-2', $settings['ekit_button_two_link'] );
1054 }
1055 ?>
1056
1057 <a class="ekit-double-btn ekit-double-btn-two" <?php echo $this->get_render_attribute_string( 'button-2' ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Already escaped by elementor ?>>
1058 <?php
1059 if ($settings['ekit_double_button_two_icon_position'] == 'before') {
1060 if ($is_new || $migrated) {
1061 Icons_Manager::render_icon( $settings['ekit_button_two_icons'], [ 'aria-hidden' => 'true' ] );
1062 } else {
1063 echo '<i class="'. esc_attr($settings['ekit_button_two_icon']) .'" aria-hidden="true"></i>';
1064 }
1065 }
1066 echo esc_html($settings['ekit_button_two_text']);
1067 if ($settings['ekit_double_button_two_icon_position'] == 'after') {
1068 if ($is_new || $migrated) {
1069 Icons_Manager::render_icon( $settings['ekit_button_two_icons'], [ 'aria-hidden' => 'true' ] );
1070 } else {
1071 echo '<i class="'. esc_attr($settings['ekit_button_two_icon']) .'" aria-hidden="true"></i>';
1072 }
1073 }
1074 ?>
1075 </a>
1076 <?php
1077 }
1078 }
1079 }
1080