PluginProbe
Easy Elements for Elementor – Addons & Website Templates / 1.0.7
Easy Elements for Elementor – Addons & Website Templates v1.0.7
1.5.3 1.5.2 1.5.1 1.5.0 1.4.9 1.4.6 1.4.7 1.4.8 1.4.5 1.4.4 1.4.3 1.2.7 1.2.8 1.2.9 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.3.6 1.3.7 1.3.8 1.3.9 1.4.0 All 47 releases
← All changes | widgets/heading/heading.php +1277 -1730 1.4.51.0.7 View file →
@@ -1,1730 +1,1277 @@
1 -<?php
2 -namespace Easyel\EasyElements\Widgets;
3 -use Elementor\Controls_Manager;
4 -use Elementor\Group_Control_Typography;
5 -use Elementor\Widget_Base;
6 -use Elementor\Group_Control_Background;
7 -
8 -if ( ! defined( 'ABSPATH' ) ) {
9 - exit;
10 -}
11 -
12 -class Easyel_Heading_Widget extends \Elementor\Widget_Base {
13 -
14 - public function get_name() {
15 - return 'eel-heading';
16 - }
17 -
18 - public function get_title() {
19 - return __( 'Heading', 'easy-elements' );
20 - }
21 -
22 - public function get_icon() {
23 - return 'easyicon easyelIcon-heading';
24 - }
25 -
26 - public function get_categories() {
27 - return [ 'easyelements_category' ];
28 - }
29 - public function get_keywords() {
30 - return [ 'heading', 'title', 'link', 'click', 'text' ];
31 - }
32 -
33 - public function get_style_depends() {
34 - return [
35 - 'eel-heading',
36 - ];
37 - }
38 -
39 -
40 - protected function register_controls() {
41 - $this->start_controls_section(
42 - 'content_section',
43 - [
44 - 'label' => esc_html__('Heading Settings', 'easy-elements'),
45 - 'tab' => Controls_Manager::TAB_CONTENT,
46 - ]
47 - );
48 -
49 - $this->add_control(
50 - 'title',
51 - [
52 - 'label' => esc_html__('Heading Text', 'easy-elements'),
53 - 'type' => Controls_Manager::TEXTAREA,
54 - 'default' => esc_html__('Heading Here', 'easy-elements'),
55 - 'label_block' => true,
56 - 'description' => esc_html__('You can highlight part of the text using double curly brackets. Example: Heading {{Here}} will highlight "Here".', 'easy-elements'),
57 - ]
58 - );
59 -
60 - $this->add_control(
61 - 'show_border_title',
62 - [
63 - 'label' => esc_html__( 'Show Title Side Border', 'easy-elements' ),
64 - 'type' => \Elementor\Controls_Manager::SWITCHER,
65 - 'label_on' => esc_html__( 'On', 'easy-elements' ),
66 - 'label_off' => esc_html__( 'Off', 'easy-elements' ),
67 - 'return_value' => 'yes',
68 - 'default' => '',
69 - 'description' => esc_html__( 'Adds a colored vertical bar on the left or right side of the title.', 'easy-elements' ),
70 - ]
71 - );
72 -
73 - $this->add_control(
74 - 'show_gradient_title',
75 - [
76 - 'label' => esc_html__( 'Enable Gradient Text', 'easy-elements' ),
77 - 'type' => \Elementor\Controls_Manager::SWITCHER,
78 - 'label_on' => esc_html__( 'On', 'easy-elements' ),
79 - 'label_off' => esc_html__( 'Off', 'easy-elements' ),
80 - 'return_value' => 'yes',
81 - 'default' => '',
82 - 'description' => esc_html__( 'Fill the title text with a gradient. Configure colors in Style > Heading.', 'easy-elements' ),
83 - ]
84 - );
85 -
86 - $this->add_control(
87 - 'border_position',
88 - [
89 - 'label' => esc_html__( 'Border Position', 'easy-elements' ),
90 - 'type' => \Elementor\Controls_Manager::SELECT,
91 - 'default' => 'eel_title_start',
92 - 'options' => [
93 - 'eel_title_start' => esc_html__( 'Left of Title (text width)', 'easy-elements' ),
94 - 'eel_title_end' => esc_html__( 'Right of Title (text width)', 'easy-elements' ),
95 - 'eel_full_title_start' => esc_html__( 'Left of Title (full width)', 'easy-elements' ),
96 - 'eel_full_title_end' => esc_html__( 'Right of Title (full width)', 'easy-elements' ),
97 - ],
98 - 'description' => esc_html__( 'Choose which side the side border sits, and whether it spans only the text or the full container width.', 'easy-elements' ),
99 - 'condition' => [
100 - 'show_border_title' => 'yes',
101 - ],
102 - ]
103 - );
104 -
105 -
106 - $this->add_control(
107 - 'border_color',
108 - [
109 - 'label' => esc_html__('Border Color', 'easy-elements'),
110 - 'type' => Controls_Manager::COLOR,
111 - 'selectors' => [
112 - '{{WRAPPER}} .eel_full_title_end, {{WRAPPER}} .eel_title_end .e-e-title, {{WRAPPER}} .eel_full_title_start, {{WRAPPER}} .eel_title_start .e-e-title' => 'border-color: {{VALUE}};',
113 - ],
114 - 'condition' => [
115 - 'show_border_title' => 'yes',
116 - ],
117 - ]
118 - );
119 -
120 - $this->add_responsive_control(
121 - 'title_border_padding',
122 - [
123 - 'label' => esc_html__( 'Padding', 'easy-elements' ),
124 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
125 - 'size_units' => [ 'px', '%', 'em' ],
126 - 'selectors' => [
127 - '{{WRAPPER}} .eel_full_title_end, {{WRAPPER}} .eel_title_end .e-e-title, {{WRAPPER}} .eel_full_title_start, {{WRAPPER}} .eel_title_start .e-e-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
128 - ],
129 - 'condition' => [
130 - 'show_border_title' => 'yes',
131 - ],
132 - ]
133 - );
134 -
135 -
136 - $this->add_control(
137 - 'link',
138 - [
139 - 'label' => __( 'Link', 'easy-elements' ),
140 - 'type' => \Elementor\Controls_Manager::URL,
141 - 'placeholder' => 'https://your-link.com',
142 - 'default' => [
143 - 'url' => '',
144 - 'is_external' => false,
145 - 'nofollow' => false,
146 - ],
147 - 'show_external' => true,
148 - 'description' => esc_html__( 'Set a URL to make the heading clickable. Supports opening in a new tab and nofollow attribute.', 'easy-elements' ),
149 - ]
150 - );
151 -
152 - $this->add_control(
153 - 'title_tag',
154 - [
155 - 'label' => esc_html__('HTML Tag', 'easy-elements'),
156 - 'type' => Controls_Manager::SELECT,
157 - 'default' => 'h2',
158 - 'description' => esc_html__('Choose the HTML tag for SEO. Use H1 once per page only.', 'easy-elements'),
159 - 'options' => [
160 - 'h1' => 'H1',
161 - 'h2' => 'H2',
162 - 'h3' => 'H3',
163 - 'h4' => 'H4',
164 - 'h5' => 'H5',
165 - 'h6' => 'H6',
166 - 'div' => 'div',
167 - ],
168 - ]
169 - );
170 -
171 - $this->add_control(
172 - 'description',
173 - [
174 - 'label' => esc_html__('Description', 'easy-elements'),
175 - 'type' => Controls_Manager::TEXTAREA,
176 - 'label_block' => true,
177 - 'description' => esc_html__( 'Optional. A short paragraph displayed below the heading.', 'easy-elements' ),
178 - ]
179 - );
180 -
181 -
182 - $this->add_responsive_control(
183 - 'align',
184 - [
185 - 'label' => esc_html__('Alignment', 'easy-elements'),
186 - 'type' => Controls_Manager::CHOOSE,
187 - 'options' => [
188 - 'left' => [
189 - 'title' => esc_html__('Left', 'easy-elements'),
190 - 'icon' => 'eicon-text-align-left',
191 - ],
192 - 'center' => [
193 - 'title' => esc_html__('Center', 'easy-elements'),
194 - 'icon' => 'eicon-text-align-center',
195 - ],
196 - 'right' => [
197 - 'title' => esc_html__('Right', 'easy-elements'),
198 - 'icon' => 'eicon-text-align-right',
199 - ],
200 - 'justify' => [
201 - 'title' => esc_html__('Justify', 'easy-elements'),
202 - 'icon' => 'eicon-text-align-justify',
203 - ],
204 - ],
205 - 'toggle' => true,
206 - 'selectors' => [
207 - '{{WRAPPER}} .e-e-heading' => 'text-align: {{VALUE}}',
208 - '{{WRAPPER}} .image-heading' => 'justify-content: {{VALUE}}',
209 - ],
210 - ]
211 - );
212 -
213 - $this->end_controls_section();
214 -
215 - $this->start_controls_section(
216 - 'sub_heading_section',
217 - [
218 - 'label' => esc_html__('Sub Heading Settings', 'easy-elements'),
219 - 'tab' => Controls_Manager::TAB_CONTENT,
220 - ]
221 - );
222 -
223 - $this->add_control(
224 - 'sub_title',
225 - [
226 - 'label' => esc_html__( 'Sub Heading', 'easy-elements' ),
227 - 'type' => \Elementor\Controls_Manager::TEXTAREA,
228 - 'label_block' => true,
229 - 'description' => esc_html__( 'A small line of text above the main heading. Often used for category, tag, or eyebrow text.', 'easy-elements' ),
230 - ]
231 - );
232 -
233 - $this->add_control(
234 - 'show_gradient_border',
235 - [
236 - 'label' => esc_html__( 'Show Gradient Border', 'easy-elements' ),
237 - 'type' => \Elementor\Controls_Manager::SWITCHER,
238 - 'label_on' => esc_html__( 'Show', 'easy-elements' ),
239 - 'label_off' => esc_html__( 'Hide', 'easy-elements' ),
240 - 'return_value' => 'yes',
241 - 'default' => '',
242 - ]
243 - );
244 -
245 - $this->add_control(
246 - 'gradient_color_1',
247 - [
248 - 'label' => esc_html__( 'Gradient Color 1', 'easy-elements' ),
249 - 'type' => \Elementor\Controls_Manager::COLOR,
250 - 'default' => 'rgba(0, 0, 0, 0.15)',
251 - 'selectors' => [
252 - '{{WRAPPER}} .easy_gradiant_border::before' => '--grad-color-1: {{VALUE}};',
253 - ],
254 - 'condition' => [
255 - 'show_gradient_border' => 'yes',
256 - ],
257 - ]
258 - );
259 -
260 - $this->add_control(
261 - 'gradient_color_2',
262 - [
263 - 'label' => esc_html__( 'Gradient Color 2', 'easy-elements' ),
264 - 'type' => \Elementor\Controls_Manager::COLOR,
265 - 'default' => 'rgba(0, 0, 0, 0.30)',
266 - 'selectors' => [
267 - '{{WRAPPER}} .easy_gradiant_border::before' => '--grad-color-2: {{VALUE}};',
268 - ],
269 - 'condition' => [
270 - 'show_gradient_border' => 'yes',
271 - ],
272 - ]
273 - );
274 -
275 - $this->add_control(
276 - 'gradient_color_3',
277 - [
278 - 'label' => esc_html__( 'Gradient Color 3', 'easy-elements' ),
279 - 'type' => \Elementor\Controls_Manager::COLOR,
280 - 'default' => 'rgba(0, 0, 0, 0.50)',
281 - 'selectors' => [
282 - '{{WRAPPER}} .easy_gradiant_border::before' => '--grad-color-3: {{VALUE}};',
283 - ],
284 - 'condition' => [
285 - 'show_gradient_border' => 'yes',
286 - ],
287 - ]
288 - );
289 -
290 -
291 - $this->add_responsive_control(
292 - 'sub_gradient_border_padding',
293 - [
294 - 'label' => __('Gradient Border Padding', 'easy-elements'),
295 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
296 - 'size_units' => ['px', '%', 'em'],
297 - 'selectors' => [
298 - '{{WRAPPER}} .easy_gradiant_border' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
299 - ],
300 - 'condition' => [
301 - 'show_gradient_border' => 'yes',
302 - ],
303 - ]
304 - );
305 -
306 - $this->add_responsive_control(
307 - 'gradient_border_radius',
308 - [
309 - 'label' => esc_html__( 'Border Radius', 'easy-elements' ),
310 - 'type' => \Elementor\Controls_Manager::SLIDER,
311 - 'size_units' => [ 'px', '%' ],
312 - 'range' => [
313 - 'px' => [
314 - 'min' => 0,
315 - 'max' => 200,
316 - ],
317 - '%' => [
318 - 'min' => 0,
319 - 'max' => 100,
320 - ],
321 - ],
322 - 'default' => [
323 - 'unit' => 'px',
324 - 'size' => 40,
325 - ],
326 - 'selectors' => [
327 - '{{WRAPPER}} .easy_gradiant_border::before' => '--grad-border-radius: {{SIZE}}{{UNIT}};',
328 - ],
329 - 'condition' => [
330 - 'show_gradient_border' => 'yes',
331 - ],
332 - ]
333 - );
334 -
335 -
336 - $this->add_control(
337 - 'sub_heading_type',
338 - [
339 - 'label' => esc_html__( 'Sub Heading Type', 'easy-elements' ),
340 - 'type' => \Elementor\Controls_Manager::CHOOSE,
341 - 'options' => [
342 - 'none' => [
343 - 'title' => esc_html__( 'None', 'easy-elements' ),
344 - 'icon' => 'eicon-ban',
345 - ],
346 - 'icon' => [
347 - 'title' => esc_html__( 'Icon', 'easy-elements' ),
348 - 'icon' => 'eicon-star',
349 - ],
350 - 'image' => [
351 - 'title' => esc_html__( 'Image', 'easy-elements' ),
352 - 'icon' => 'eicon-image-bold',
353 - ],
354 - ],
355 - 'default' => 'none',
356 - 'toggle' => false,
357 - ]
358 - );
359 -
360 - $this->add_control(
361 - 'sub_heading_icon',
362 - [
363 - 'label' => esc_html__( 'Select Icon', 'easy-elements' ),
364 - 'type' => \Elementor\Controls_Manager::ICONS,
365 - 'default' => [
366 - 'value' => 'fas fa-heart',
367 - 'library' => 'fa-solid',
368 - ],
369 - 'condition' => [
370 - 'sub_heading_type' => 'icon',
371 - ],
372 - ]
373 - );
374 -
375 - $this->add_control(
376 - 'sub_heading_image',
377 - [
378 - 'label' => esc_html__( 'Upload Image', 'easy-elements' ),
379 - 'type' => \Elementor\Controls_Manager::MEDIA,
380 - 'default' => [
381 - 'url' => \Elementor\Utils::get_placeholder_image_src(),
382 - ],
383 - 'condition' => [
384 - 'sub_heading_type' => 'image',
385 - ],
386 - ]
387 - );
388 -
389 - $this->add_control(
390 - 'icon_color',
391 - [
392 - 'label' => esc_html__('Icon Color', 'easy-elements'),
393 - 'type' => Controls_Manager::COLOR,
394 - 'selectors' => [
395 - '{{WRAPPER}} .eel-sub-heading i, {{WRAPPER}} .eel-sub-heading svg' => 'color: {{VALUE}}; fill: {{VALUE}};',
396 - ],
397 - 'condition' => [
398 - 'sub_heading_type' => ['icon'],
399 - ],
400 - ]
401 - );
402 -
403 - $this->add_responsive_control(
404 - 'sub_heading_icon_margin',
405 - [
406 - 'label' => esc_html__( 'Icon Spacing', 'easy-elements' ),
407 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
408 - 'size_units' => [ 'px', '%', 'em' ],
409 - 'selectors' => [
410 - '{{WRAPPER}} .eel-sub-heading span' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
411 - ],
412 - 'condition' => [
413 - 'sub_heading_type' => ['image', 'icon'],
414 - ],
415 - ]
416 - );
417 -
418 - $this->add_control(
419 - 'icon_direction',
420 - [
421 - 'label' => esc_html__( 'Icon / Image Position', 'easy-elements' ),
422 - 'type' => \Elementor\Controls_Manager::CHOOSE,
423 - 'default' => 'top',
424 - 'options' => [
425 - 'left' => [
426 - 'title' => esc_html__( 'Left of Text', 'easy-elements' ),
427 - 'icon' => 'eicon-h-align-left',
428 - ],
429 - 'top' => [
430 - 'title' => esc_html__( 'Above Text', 'easy-elements' ),
431 - 'icon' => 'eicon-v-align-top',
432 - ],
433 - 'right' => [
434 - 'title' => esc_html__( 'Right of Text', 'easy-elements' ),
435 - 'icon' => 'eicon-h-align-right',
436 - ],
437 - ],
438 - 'description' => esc_html__( 'Place the icon/image relative to the sub heading text. Also controls how the sub heading wraps.', 'easy-elements' ),
439 - 'toggle' => false,
440 - ]
441 - );
442 - $this->end_controls_section();
443 -
444 - $this->start_controls_section(
445 - 'separator_section',
446 - [
447 - 'label' => esc_html__('Separator Settings', 'easy-elements'),
448 - 'tab' => Controls_Manager::TAB_CONTENT,
449 - ]
450 - );
451 -
452 - $this->add_control(
453 - 'separator_',
454 - [
455 - 'label' => __( 'Separator Type', 'easy-elements' ),
456 - 'type' => \Elementor\Controls_Manager::SELECT,
457 - 'options' => [
458 - 'none' => __( 'None', 'easy-elements' ),
459 - 'dotted' => __( 'Dotted', 'easy-elements' ),
460 - 'solid' => __( 'Solid', 'easy-elements' ),
461 - 'icon' => __( 'Icon', 'easy-elements' ),
462 - 'image' => __( 'Image', 'easy-elements' ),
463 - ],
464 - 'default' => 'none',
465 - 'description' => esc_html__( 'Pick a separator style: solid bar, dotted dots, a font icon, or your own image.', 'easy-elements' ),
466 - ]
467 - );
468 -
469 - // Solid / Dotted: color + size
470 - $this->add_control(
471 - 'solid_color',
472 - [
473 - 'label' => esc_html__('Separator Color', 'easy-elements'),
474 - 'type' => \Elementor\Controls_Manager::COLOR,
475 - 'selectors' => [
476 - '{{WRAPPER}} .eel--separator-icon.dotted::before, {{WRAPPER}} .eel--separator-icon' => 'color: {{VALUE}}; background-color: {{VALUE}};',
477 - ],
478 - 'condition' => [
479 - 'separator_' => ['solid', 'dotted'],
480 - ],
481 - ]
482 - );
483 -
484 - $this->add_responsive_control(
485 - 'separator_bar_width',
486 - [
487 - 'label' => esc_html__( 'Width', 'easy-elements' ),
488 - 'type' => \Elementor\Controls_Manager::SLIDER,
489 - 'size_units' => [ 'px', '%', 'em' ],
490 - 'range' => [
491 - 'px' => [ 'min' => 5, 'max' => 500 ],
492 - '%' => [ 'min' => 1, 'max' => 100 ],
493 - ],
494 - 'selectors' => [
495 - '{{WRAPPER}} .eel--separator-icon' => 'width: {{SIZE}}{{UNIT}};',
496 - ],
497 - 'condition' => [
498 - 'separator_' => ['solid', 'dotted'],
499 - ],
500 - ]
501 - );
502 -
503 - $this->add_responsive_control(
504 - 'separator_bar_height',
505 - [
506 - 'label' => esc_html__( 'Height (Solid)', 'easy-elements' ),
507 - 'type' => \Elementor\Controls_Manager::SLIDER,
508 - 'size_units' => [ 'px', 'em' ],
509 - 'range' => [
510 - 'px' => [ 'min' => 1, 'max' => 50 ],
511 - ],
512 - 'selectors' => [
513 - '{{WRAPPER}} .eel--separator-icon' => 'height: {{SIZE}}{{UNIT}};',
514 - ],
515 - 'description' => esc_html__( 'Bar thickness. Applies to the Solid type.', 'easy-elements' ),
516 - 'condition' => [
517 - 'separator_' => ['solid'],
518 - ],
519 - ]
520 - );
521 -
522 - // Icon: picker + color + size
523 - $this->add_control(
524 - 'select_icon_',
525 - [
526 - 'label' => esc_html__( 'Select/Upload Icon', 'easy-elements' ),
527 - 'type' => \Elementor\Controls_Manager::ICONS,
528 - 'default' => [
529 - 'value' => 'fas fa-heart',
530 - 'library' => 'fa-solid',
531 - ],
532 - 'description' => esc_html__( 'You can upload an SVG image or choose a font icon.', 'easy-elements' ),
533 - 'condition' => [
534 - 'separator_' => ['icon'],
535 - ],
536 - ]
537 - );
538 -
539 - $this->add_control(
540 - 'separator_icon_color',
541 - [
542 - 'label' => esc_html__( 'Icon Color', 'easy-elements' ),
543 - 'type' => \Elementor\Controls_Manager::COLOR,
544 - 'selectors' => [
545 - '{{WRAPPER}} .eel--separator-icon-wrap i, {{WRAPPER}} .eel--separator-icon-wrap svg' => 'color: {{VALUE}}; fill: {{VALUE}};',
546 - ],
547 - 'condition' => [
548 - 'separator_' => ['icon'],
549 - ],
550 - ]
551 - );
552 -
553 - $this->add_responsive_control(
554 - 'separator_icon_size',
555 - [
556 - 'label' => esc_html__( 'Icon Size', 'easy-elements' ),
557 - 'type' => \Elementor\Controls_Manager::SLIDER,
558 - 'size_units' => [ 'px', 'em' ],
559 - 'range' => [
560 - 'px' => [ 'min' => 6, 'max' => 200 ],
561 - 'em' => [ 'min' => 0.5, 'max' => 10 ],
562 - ],
563 - 'selectors' => [
564 - '{{WRAPPER}} .eel--separator-icon-wrap i' => 'font-size: {{SIZE}}{{UNIT}};',
565 - '{{WRAPPER}} .eel--separator-icon-wrap svg' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
566 - ],
567 - 'condition' => [
568 - 'separator_' => ['icon'],
569 - ],
570 - ]
571 - );
572 -
573 - // Image: upload + size
574 - $this->add_control(
575 - 'sep_image',
576 - [
577 - 'label' => esc_html__( 'Upload Image', 'easy-elements' ),
578 - 'type' => \Elementor\Controls_Manager::MEDIA,
579 - 'default' => [
580 - 'url' => \Elementor\Utils::get_placeholder_image_src(),
581 - ],
582 - 'condition' => [
583 - 'separator_' => 'image',
584 - ],
585 - ]
586 - );
587 -
588 - $this->add_responsive_control(
589 - 'separator_image_width',
590 - [
591 - 'label' => esc_html__( 'Image Width', 'easy-elements' ),
592 - 'type' => \Elementor\Controls_Manager::SLIDER,
593 - 'size_units' => [ 'px', '%', 'em' ],
594 - 'range' => [
595 - 'px' => [ 'min' => 10, 'max' => 500 ],
596 - '%' => [ 'min' => 1, 'max' => 100 ],
597 - ],
598 - 'selectors' => [
599 - '{{WRAPPER}} .eel-separator-img' => 'width: {{SIZE}}{{UNIT}}; height: auto;',
600 - ],
601 - 'description' => esc_html__( 'Height stays auto to keep aspect ratio.', 'easy-elements' ),
602 - 'condition' => [
603 - 'separator_' => 'image',
604 - ],
605 - ]
606 - );
607 -
608 - // Position + Margin (apply to all types)
609 - $this->add_control(
610 - 'separator_position',
611 - [
612 - 'label' => esc_html__( 'Position', 'easy-elements' ),
613 - 'type' => \Elementor\Controls_Manager::SELECT,
614 - 'default' => 'below',
615 - 'options' => [
616 - 'top' => esc_html__( 'Top of Widget', 'easy-elements' ),
617 - 'above' => esc_html__( 'Above Heading Title', 'easy-elements' ),
618 - 'below' => esc_html__( 'Below Heading Title', 'easy-elements' ),
619 - 'bottom' => esc_html__( 'Bottom of Widget', 'easy-elements' ),
620 - ],
621 - 'description' => esc_html__( 'Where the separator sits inside the widget.', 'easy-elements' ),
622 - 'condition' => [
623 - 'separator_!' => 'none',
624 - ],
625 - ]
626 - );
627 -
628 - $this->add_control(
629 - 'separator_margin',
630 - [
631 - 'label' => esc_html__( 'Margin', 'easy-elements' ),
632 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
633 - 'size_units' => [ 'px', '%', 'em' ],
634 - 'selectors' => [
635 - '{{WRAPPER}} .eel--separator-icon, {{WRAPPER}} .eel--separator-icon-wrap' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
636 - ],
637 - 'condition' => [
638 - 'separator_!' => 'none',
639 - ],
640 - ]
641 - );
642 -
643 - $this->end_controls_section();
644 -
645 -
646 - $this->start_controls_section(
647 - 'water_mark_section',
648 - [
649 - 'label' => esc_html__('WaterMark Settings', 'easy-elements'),
650 - 'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
651 - ]
652 - );
653 -
654 - $this->add_control(
655 - 'water_mark',
656 - [
657 - 'label' => esc_html__('WaterMark Text', 'easy-elements'),
658 - 'type' => \Elementor\Controls_Manager::TEXTAREA,
659 - 'label_block' => true,
660 - ]
661 - );
662 -
663 - $this->end_controls_section();
664 -
665 -
666 - // Heading
667 - $this->start_controls_section(
668 - 'section_heading_style',
669 - [
670 - 'label' => esc_html__('Heading', 'easy-elements'),
671 - 'tab' => Controls_Manager::TAB_STYLE,
672 - ]
673 - );
674 -
675 - $this->add_control(
676 - 'title_color',
677 - [
678 - 'label' => esc_html__('Color', 'easy-elements'),
679 - 'type' => Controls_Manager::COLOR,
680 - 'selectors' => [
681 - '{{WRAPPER}} .e-e-heading .e-e-title' => 'color: {{VALUE}};',
682 - ],
683 - 'condition' => [
684 - 'show_gradient_title' => '',
685 - ],
686 - ]
687 - );
688 -
689 - $this->add_control(
690 - 'title_color_gradient_heading',
691 - [
692 - 'label' => esc_html__('Text Gradient Color', 'easy-elements'),
693 - 'type' => Controls_Manager::HEADING,
694 - 'separator' => 'before',
695 - 'condition' => [
696 - 'show_gradient_title' => 'yes',
697 - ]
698 - ]
699 - );
700 -
701 - $this->add_group_control(
702 - Group_Control_Background::get_type(),
703 - [
704 - 'name' => 'title_gradient_color',
705 - 'label' => __( 'Title Color', 'easy-elements' ),
706 - 'types' => [ 'classic', 'gradient' ],
707 - 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title.e-e-gradient-title',
708 - 'condition' => [
709 - 'show_gradient_title' => 'yes',
710 - ],
711 - ]
712 - );
713 -
714 -
715 - $this->add_group_control(
716 - Group_Control_Typography::get_type(),
717 - [
718 - 'name' => 'title_typography',
719 - 'label' => esc_html__('Typography', 'easy-elements'),
720 - 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title',
721 - ]
722 - );
723 - $this->add_control(
724 - 'title_opacity',
725 - [
726 - 'label' => esc_html__('Opacity', 'easy-elements'),
727 - 'type' => Controls_Manager::SLIDER,
728 - 'size_units' => ['%'],
729 - 'range' => [
730 - '%' => [ 'min' => 0, 'max' => 1, 'step' => 0.01 ],
731 - ],
732 - 'default' => [
733 - 'size' => 1,
734 - 'unit' => '%',
735 - ],
736 - 'selectors' => [
737 - '{{WRAPPER}} .e-e-heading .e-e-title' => 'opacity: {{SIZE}};',
738 - ],
739 - ]
740 - );
741 -
742 - $this->add_control(
743 - 'title_stroke_heading',
744 - [
745 - 'label' => esc_html__( 'Stroke', 'easy-elements' ),
746 - 'type' => Controls_Manager::HEADING,
747 - 'separator' => 'before',
748 - ]
749 - );
750 -
751 - $this->add_control(
752 - 'title_text_stroke',
753 - [
754 - 'label' => esc_html__('Stroke Width', 'easy-elements'),
755 - 'type' => Controls_Manager::SLIDER,
756 - 'size_units' => ['px', 'em'],
757 - 'range' => [
758 - 'px' => [ 'min' => 0, 'max' => 10, 'step' => 0.1 ],
759 - 'em' => [ 'min' => 0, 'max' => 1, 'step' => 0.01 ],
760 - ],
761 - 'default' => [
762 - 'size' => 0,
763 - 'unit' => 'px',
764 - ],
765 - 'selectors' => [
766 - '{{WRAPPER}} .e-e-heading .e-e-title' => '-webkit-text-stroke-width: {{SIZE}}{{UNIT}};',
767 - ],
768 - ]
769 - );
770 - $this->add_control(
771 - 'title_text_stroke_color',
772 - [
773 - 'label' => esc_html__('Stroke Color', 'easy-elements'),
774 - 'type' => Controls_Manager::COLOR,
775 - 'selectors' => [
776 - '{{WRAPPER}} .e-e-heading .e-e-title' => '-webkit-text-stroke-color: {{VALUE}};',
777 - ],
778 - 'condition' => [
779 - 'title_text_stroke[size]!' => '',
780 - ],
781 - ]
782 - );
783 - $this->add_control(
784 - 'title_effects_heading',
785 - [
786 - 'label' => esc_html__( 'Effects', 'easy-elements' ),
787 - 'type' => Controls_Manager::HEADING,
788 - 'separator' => 'before',
789 - ]
790 - );
791 -
792 - // Text Shadow
793 - $this->add_group_control(
794 - \Elementor\Group_Control_Text_Shadow::get_type(),
795 - [
796 - 'name' => 'title_text_shadow',
797 - 'label' => esc_html__('Text Shadow', 'easy-elements'),
798 - 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title',
799 - ]
800 - );
801 - // Mix Blend Mode
802 - $this->add_control(
803 - 'title_blend_mode',
804 - [
805 - 'label' => esc_html__('Blend Mode', 'easy-elements'),
806 - 'type' => Controls_Manager::SELECT,
807 - 'options' => [
808 - '' => esc_html__('Default', 'easy-elements'),
809 - 'normal' => 'Normal',
810 - 'multiply' => 'Multiply',
811 - 'screen' => 'Screen',
812 - 'overlay' => 'Overlay',
813 - 'darken' => 'Darken',
814 - 'lighten' => 'Lighten',
815 - 'color-dodge' => 'Color Dodge',
816 - 'color-burn' => 'Color Burn',
817 - 'hard-light' => 'Hard Light',
818 - 'soft-light' => 'Soft Light',
819 - 'difference' => 'Difference',
820 - 'exclusion' => 'Exclusion',
821 - 'hue' => 'Hue',
822 - 'saturation' => 'Saturation',
823 - 'color' => 'Color',
824 - 'luminosity' => 'Luminosity',
825 - ],
826 - 'selectors' => [
827 - '{{WRAPPER}} .e-e-heading .e-e-title' => 'mix-blend-mode: {{VALUE}};',
828 - ],
829 - ]
830 - );
831 - $this->add_control(
832 - 'title_spacing_heading',
833 - [
834 - 'label' => esc_html__( 'Spacing', 'easy-elements' ),
835 - 'type' => Controls_Manager::HEADING,
836 - 'separator' => 'before',
837 - ]
838 - );
839 -
840 - $this->add_responsive_control(
841 - 'title_margin',
842 - [
843 - 'label' => esc_html__('Margin', 'easy-elements'),
844 - 'type' => Controls_Manager::DIMENSIONS,
845 - 'size_units' => ['px', 'em', '%'],
846 - 'selectors' => [
847 - '{{WRAPPER}} .e-e-heading .e-e-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
848 - ],
849 - ]
850 - );
851 -
852 - $this->add_responsive_control(
853 - 'title_padding',
854 - [
855 - 'label' => esc_html__('Padding', 'easy-elements'),
856 - 'type' => Controls_Manager::DIMENSIONS,
857 - 'size_units' => ['px', 'em', '%'],
858 - 'selectors' => [
859 - '{{WRAPPER}} .e-e-heading .e-e-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
860 - ],
861 - ]
862 - );
863 -
864 -
865 - $this->add_control(
866 - 'title_image_fill_heading',
867 - [
868 - 'label' => esc_html__('Image Fill (Text Mask)', 'easy-elements'),
869 - 'type' => Controls_Manager::HEADING,
870 - 'separator' => 'before',
871 - ]
872 - );
873 -
874 - $this->add_control(
875 - 'enable_title_image_fill',
876 - [
877 - 'label' => esc_html__('Enable Image Fill', 'easy-elements'),
878 - 'type' => \Elementor\Controls_Manager::SWITCHER,
879 - 'label_on' => esc_html__('Yes', 'easy-elements'),
880 - 'label_off' => esc_html__('No', 'easy-elements'),
881 - 'return_value' => 'yes',
882 - 'default' => '',
883 - ]
884 - );
885 -
886 - $this->add_group_control(
887 - Group_Control_Background::get_type(),
888 - [
889 - 'name' => 'title_image_fill_bg',
890 - 'label' => esc_html__('Image Fill', 'easy-elements'),
891 - 'types' => [ 'classic' ],
892 - 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title.e-e-image-fill, {{WRAPPER}} .e-e-heading .e-e-title.e-e-image-fill div',
893 - 'fields_options' => [
894 - 'background' => [
895 - 'default' => 'classic',
896 - ],
897 - 'classic' => [
898 - 'types' => [ 'image' ],
899 - ],
900 - ],
901 - 'condition' => [
902 - 'enable_title_image_fill' => 'yes',
903 - ],
904 - ]
905 - );
906 -
907 - $this->add_control(
908 - 'title_image_fill_note',
909 - [
910 - 'type' => Controls_Manager::RAW_HTML,
911 - 'raw' => __('Tip: Apply this only when you want the text to be filled with an image (the image will appear inside the text).', 'easy-elements'),
912 - 'content_classes' => 'elementor-panel-alert elementor-panel-alert-info',
913 - ]
914 - );
915 -
916 - $this->end_controls_section();
917 -
918 - //Sub Heading
919 - $this->start_controls_section(
920 - 'section_sub_heading_style',
921 - [
922 - 'label' => esc_html__('Sub Heading', 'easy-elements'),
923 - 'tab' => Controls_Manager::TAB_STYLE,
924 - ]
925 - );
926 -
927 - $this->add_control(
928 - 'sub_heading_color',
929 - [
930 - 'label' => esc_html__('Color', 'easy-elements'),
931 - 'type' => Controls_Manager::COLOR,
932 - 'selectors' => [
933 - '{{WRAPPER}} .e-e-heading .eel-sub-heading span' => 'color: {{VALUE}};',
934 - ],
935 - ]
936 - );
937 -
938 - $this->add_group_control(
939 - \Elementor\Group_Control_Background::get_type(),
940 - [
941 - 'name' => 'background_subtext',
942 - 'label' => esc_html__( 'Background', 'easy-elements' ),
943 - 'types' => [ 'classic', 'gradient' ],
944 - 'selector' => '{{WRAPPER}} .eel-sub-heading.top',
945 - 'condition' => [
946 - 'icon_direction' => 'top',
947 - ],
948 - ]
949 - );
950 -
951 - $this->add_group_control(
952 - \Elementor\Group_Control_Background::get_type(),
953 - [
954 - 'name' => 'background_subtext_top',
955 - 'label' => esc_html__( 'Background', 'easy-elements' ),
956 - 'types' => [ 'classic', 'gradient' ],
957 - 'selector' => '{{WRAPPER}} .eel-sub-heading',
958 - 'condition' => [
959 - 'icon_direction' => ['left', 'right'],
960 - ],
961 - ]
962 - );
963 -
964 - $this->add_group_control(
965 - Group_Control_Typography::get_type(),
966 - [
967 - 'name' => 'sub_heading_typography',
968 - 'label' => esc_html__('Typography', 'easy-elements'),
969 - 'selector' => '{{WRAPPER}} .e-e-heading .eel-sub-heading span',
970 - ]
971 - );
972 -
973 - $this->add_control(
974 - 'sub_heading_icon_image_heading',
975 - [
976 - 'label' => esc_html__( 'Icon / Image', 'easy-elements' ),
977 - 'type' => Controls_Manager::HEADING,
978 - 'separator' => 'before',
979 - 'condition' => [
980 - 'sub_heading_type' => [ 'icon', 'image' ],
981 - ],
982 - ]
983 - );
984 -
985 - $this->add_responsive_control(
986 - 'sub_heading_icon_text_gap',
987 - [
988 - 'label' => esc_html__( 'Icon/Image to Text Gap', 'easy-elements' ),
989 - 'type' => \Elementor\Controls_Manager::SLIDER,
990 - 'size_units' => [ 'px', 'em', 'rem' ],
991 - 'range' => [
992 - 'px' => [ 'min' => 0, 'max' => 100 ],
993 - 'em' => [ 'min' => 0, 'max' => 10 ],
994 - ],
995 - 'selectors' => [
996 - '{{WRAPPER}} .eel-sub-heading.left, {{WRAPPER}} .eel-sub-heading.right' => 'gap: {{SIZE}}{{UNIT}};',
997 - '{{WRAPPER}} .eel-sub-heading.top i, {{WRAPPER}} .eel-sub-heading.top svg, {{WRAPPER}} .eel-sub-heading.top img' => 'margin-bottom: {{SIZE}}{{UNIT}};',
998 - ],
999 - 'condition' => [
1000 - 'sub_heading_type' => [ 'icon', 'image' ],
1001 - ],
1002 - ]
1003 - );
1004 -
1005 - $this->add_control(
1006 - 'subtext_icon_size',
1007 - [
1008 - 'label' => esc_html__( 'Icon Size', 'easy-elements' ),
1009 - 'type' => \Elementor\Controls_Manager::SLIDER,
1010 - 'range' => [
1011 - 'px' => [
1012 - 'min' => 6,
1013 - 'max' => 100,
1014 - ],
1015 - ],
1016 - 'selectors' => [
1017 - '{{WRAPPER}} .eel-sub-heading i, {{WRAPPER}} .eel-sub-heading svg' => 'font-size: {{SIZE}}{{UNIT}};',
1018 - ],
1019 - 'description' => esc_html__( 'Adjust the icon size in pixels for the subheading icon.', 'easy-elements' ),
1020 - 'condition' => [
1021 - 'sub_heading_type' => 'icon',
1022 - ],
1023 - ]
1024 - );
1025 -
1026 - $this->add_responsive_control(
1027 - 'subtext_image_size',
1028 - [
1029 - 'label' => esc_html__( 'Image Width', 'easy-elements' ),
1030 - 'type' => \Elementor\Controls_Manager::SLIDER,
1031 - 'size_units' => [ 'px', 'em', '%' ],
1032 - 'range' => [
1033 - 'px' => [
1034 - 'min' => 10,
1035 - 'max' => 300,
1036 - ],
1037 - '%' => [
1038 - 'min' => 1,
1039 - 'max' => 100,
1040 - ],
1041 - ],
1042 - 'selectors' => [
1043 - '{{WRAPPER}} .eel-sub-heading img' => 'width: {{SIZE}}{{UNIT}}; height: auto;',
1044 - ],
1045 - 'description' => esc_html__( 'Adjust the image width. Height stays auto to keep aspect ratio (override below).', 'easy-elements' ),
1046 - 'condition' => [
1047 - 'sub_heading_type' => 'image',
1048 - ],
1049 - ]
1050 - );
1051 -
1052 - $this->add_responsive_control(
1053 - 'subtext_image_height',
1054 - [
1055 - 'label' => esc_html__( 'Image Height', 'easy-elements' ),
1056 - 'type' => \Elementor\Controls_Manager::SLIDER,
1057 - 'size_units' => [ 'px', 'em', '%' ],
1058 - 'range' => [
1059 - 'px' => [
1060 - 'min' => 10,
1061 - 'max' => 300,
1062 - ],
1063 - ],
1064 - 'selectors' => [
1065 - '{{WRAPPER}} .eel-sub-heading img' => 'height: {{SIZE}}{{UNIT}};',
1066 - ],
1067 - 'description' => esc_html__( 'Optional. Set a fixed height. Leave empty to keep auto height.', 'easy-elements' ),
1068 - 'condition' => [
1069 - 'sub_heading_type' => 'image',
1070 - ],
1071 - ]
1072 - );
1073 -
1074 - $this->add_responsive_control(
1075 - 'subtext_image_radius',
1076 - [
1077 - 'label' => esc_html__( 'Image Border Radius', 'easy-elements' ),
1078 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1079 - 'size_units' => [ 'px', '%' ],
1080 - 'selectors' => [
1081 - '{{WRAPPER}} .eel-sub-heading img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1082 - ],
1083 - 'condition' => [
1084 - 'sub_heading_type' => 'image',
1085 - ],
1086 - ]
1087 - );
1088 -
1089 - $this->add_control(
1090 - 'sub_heading_box_heading',
1091 - [
1092 - 'label' => esc_html__( 'Box', 'easy-elements' ),
1093 - 'type' => Controls_Manager::HEADING,
1094 - 'separator' => 'before',
1095 - ]
1096 - );
1097 -
1098 - $this->add_group_control(
1099 - \Elementor\Group_Control_Border::get_type(),
1100 - [
1101 - 'name' => 'subtext_border',
1102 - 'label' => esc_html__( 'Border', 'easy-elements' ),
1103 - 'selector' => '{{WRAPPER}} .eel-sub-heading',
1104 - ]
1105 - );
1106 -
1107 - $this->add_responsive_control(
1108 - 'subtext_border_radius',
1109 - [
1110 - 'label' => esc_html__( 'Border Radius', 'easy-elements' ),
1111 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1112 - 'size_units' => [ 'px', '%', 'em' ],
1113 - 'selectors' => [
1114 - '{{WRAPPER}} .eel-sub-heading' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1115 - ],
1116 - ]
1117 - );
1118 -
1119 - $this->add_responsive_control(
1120 - 'subtext_padding',
1121 - [
1122 - 'label' => esc_html__( 'Padding', 'easy-elements' ),
1123 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1124 - 'size_units' => [ 'px', '%', 'em' ],
1125 - 'selectors' => [
1126 - '{{WRAPPER}} .eel-sub-heading' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1127 - ],
1128 - ]
1129 - );
1130 -
1131 - $this->add_control(
1132 - 'sub_heading_margin',
1133 - [
1134 - 'label' => esc_html__( 'Margin', 'easy-elements' ),
1135 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1136 - 'size_units' => [ 'px', '%', 'em' ],
1137 - 'selectors' => [
1138 - '{{WRAPPER}} .eel-sub-heading' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1139 - ],
1140 - ]
1141 - );
1142 -
1143 - $this->end_controls_section();
1144 -
1145 -
1146 - // Highlight
1147 - $this->start_controls_section(
1148 - 'section_highlight_style',
1149 - [
1150 - 'label' => esc_html__('Highlight', 'easy-elements'),
1151 - 'tab' => Controls_Manager::TAB_STYLE,
1152 - ]
1153 - );
1154 -
1155 - $this->add_control(
1156 - 'highlight_help',
1157 - [
1158 - 'type' => Controls_Manager::RAW_HTML,
1159 - 'raw' => esc_html__( 'Wrap part of the heading text in double curly braces to highlight it. Example: "Heading {{Here}}" highlights "Here".', 'easy-elements' ),
1160 - 'content_classes' => 'elementor-panel-alert elementor-panel-alert-info',
1161 - ]
1162 - );
1163 -
1164 - $this->add_control(
1165 - 'highlight_color',
1166 - [
1167 - 'label' => esc_html__('Color', 'easy-elements'),
1168 - 'type' => Controls_Manager::COLOR,
1169 - 'selectors' => [
1170 - '{{WRAPPER}} .e-e-heading .e-e-title span' => 'color: {{VALUE}};',
1171 - ],
1172 - ]
1173 - );
1174 -
1175 - $this->add_group_control(
1176 - \Elementor\Group_Control_Background::get_type(),
1177 - [
1178 - 'name' => 'background_highlight',
1179 - 'label' => esc_html__( 'Background', 'easy-elements' ),
1180 - 'types' => [ 'classic', 'gradient' ],
1181 - 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title span',
1182 - ]
1183 - );
1184 -
1185 - $this->add_group_control(
1186 - Group_Control_Typography::get_type(),
1187 - [
1188 - 'name' => 'highlight_typography',
1189 - 'label' => esc_html__('Highlight Typography', 'easy-elements'),
1190 - 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title span',
1191 - ]
1192 - );
1193 -
1194 - $this->add_responsive_control(
1195 - 'highlight_padding',
1196 - [
1197 - 'label' => esc_html__( 'Padding', 'easy-elements' ),
1198 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1199 - 'size_units' => [ 'px', '%', 'em' ],
1200 - 'selectors' => [
1201 - '{{WRAPPER}} .e-e-heading .e-e-title span' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1202 - ],
1203 - ]
1204 - );
1205 -
1206 - $this->add_control(
1207 - 'highlight_margin',
1208 - [
1209 - 'label' => esc_html__( 'Margin', 'easy-elements' ),
1210 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1211 - 'size_units' => [ 'px', '%', 'em' ],
1212 - 'selectors' => [
1213 - '{{WRAPPER}} .e-e-heading .e-e-title span' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1214 - ],
1215 - ]
1216 - );
1217 -
1218 - $this->add_responsive_control(
1219 - 'hithlight_border_radius',
1220 - [
1221 - 'label' => esc_html__( 'Border Radius', 'easy-elements' ),
1222 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1223 - 'size_units' => [ 'px', '%', 'em' ],
1224 - 'selectors' => [
1225 - '{{WRAPPER}} .e-e-heading .e-e-title span' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1226 - ],
1227 - ]
1228 - );
1229 -
1230 - $this->end_controls_section();
1231 -
1232 - // Description
1233 - $this->start_controls_section(
1234 - 'section_description_style',
1235 - [
1236 - 'label' => esc_html__('Description', 'easy-elements'),
1237 - 'tab' => Controls_Manager::TAB_STYLE,
1238 - ]
1239 - );
1240 - $this->add_control(
1241 - 'description_color',
1242 - [
1243 - 'label' => esc_html__('Color', 'easy-elements'),
1244 - 'type' => Controls_Manager::COLOR,
1245 - 'selectors' => [
1246 - '{{WRAPPER}} .e-e-heading .e-e-description' => 'color: {{VALUE}};',
1247 - ],
1248 - ]
1249 - );
1250 - $this->add_group_control(
1251 - Group_Control_Typography::get_type(),
1252 - [
1253 - 'name' => 'description_typography',
1254 - 'label' => esc_html__('Typography', 'easy-elements'),
1255 - 'selector' => '{{WRAPPER}} .e-e-heading .e-e-description',
1256 - ]
1257 - );
1258 - $this->add_responsive_control(
1259 - 'description_margin',
1260 - [
1261 - 'label' => esc_html__('Margin', 'easy-elements'),
1262 - 'type' => Controls_Manager::DIMENSIONS,
1263 - 'size_units' => ['px', 'em', '%'],
1264 - 'selectors' => [
1265 - '{{WRAPPER}} .e-e-heading .e-e-description' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1266 - ],
1267 - ]
1268 - );
1269 - $this->add_responsive_control(
1270 - 'description_padding',
1271 - [
1272 - 'label' => esc_html__('Padding', 'easy-elements'),
1273 - 'type' => Controls_Manager::DIMENSIONS,
1274 - 'size_units' => ['px', 'em', '%'],
1275 - 'selectors' => [
1276 - '{{WRAPPER}} .e-e-heading .e-e-description' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1277 - ],
1278 - ]
1279 - );
1280 - $this->end_controls_section();
1281 -
1282 -
1283 - // =====================================================================
1284 - // WaterMark Style
1285 - // =====================================================================
1286 - $this->start_controls_section(
1287 - 'water_mark_style_section',
1288 - [
1289 - 'label' => esc_html__('WaterMark', 'easy-elements'),
1290 - 'tab' => \Elementor\Controls_Manager::TAB_STYLE,
1291 - 'condition' => [
1292 - 'water_mark!' => '',
1293 - ],
1294 - ]
1295 - );
1296 -
1297 - $this->add_group_control(
1298 - Group_Control_Typography::get_type(),
1299 - [
1300 - 'name' => 'water_mark_typography',
1301 - 'label' => esc_html__('Typography', 'easy-elements'),
1302 - 'selector' => '{{WRAPPER}} .eel-watermark',
1303 - // phpcs:ignore WordPressVIPMinimum.Performance.WPQueryParams.PostNotIn_exclude
1304 - 'exclude' => ['font_size'],
1305 - ]
1306 - );
1307 -
1308 - // Kept for back-compat with widgets saved before Typography group was added.
1309 - $this->add_responsive_control(
1310 - 'water_mark_font_size',
1311 - [
1312 - 'label' => esc_html__('Font Size', 'easy-elements'),
1313 - 'type' => \Elementor\Controls_Manager::SLIDER,
1314 - 'size_units' => ['px', 'em', 'rem', '%'],
1315 - 'range' => [
1316 - 'px' => ['min' => 10, 'max' => 300],
1317 - 'em' => ['min' => 0.5, 'max' => 20],
1318 - 'rem' => ['min' => 0.5, 'max' => 20],
1319 - '%' => ['min' => 10, 'max' => 500],
1320 - ],
1321 - 'default' => [
1322 - 'size' => '',
1323 - 'unit' => 'px',
1324 - ],
1325 - 'selectors' => [
1326 - '{{WRAPPER}} .eel-watermark' => 'font-size: {{SIZE}}{{UNIT}};',
1327 - ],
1328 - ]
1329 - );
1330 -
1331 - $this->add_control(
1332 - '_mark_color',
1333 - [
1334 - 'label' => esc_html__('Text Color', 'easy-elements'),
1335 - 'type' => \Elementor\Controls_Manager::COLOR,
1336 - 'default' => '',
1337 - 'selectors' => [
1338 - '{{WRAPPER}} .eel-watermark' => 'color: {{VALUE}};',
1339 - ],
1340 - ]
1341 - );
1342 -
1343 - $this->add_control(
1344 - 'water_mark_color',
1345 - [
1346 - 'label' => esc_html__('Stroke Color', 'easy-elements'),
1347 - 'type' => \Elementor\Controls_Manager::COLOR,
1348 - 'default' => 'rgba(0, 0, 0, 0.3)',
1349 - 'selectors' => [
1350 - '{{WRAPPER}} .eel-watermark' => '-webkit-text-stroke-color: {{VALUE}}; text-stroke-color: {{VALUE}};',
1351 - ],
1352 - ]
1353 - );
1354 -
1355 - $this->add_control(
1356 - 'water_mark_stroke_width',
1357 - [
1358 - 'label' => esc_html__('Stroke Width', 'easy-elements'),
1359 - 'type' => \Elementor\Controls_Manager::SLIDER,
1360 - 'size_units' => ['px', 'em'],
1361 - 'default' => [
1362 - 'size' => 1,
1363 - 'unit' => 'px',
1364 - ],
1365 - 'range' => [
1366 - 'px' => ['min' => 0, 'max' => 10, 'step' => 0.1],
1367 - 'em' => ['min' => 0, 'max' => 1, 'step' => 0.01],
1368 - ],
1369 - 'selectors' => [
1370 - '{{WRAPPER}} .eel-watermark' => '-webkit-text-stroke-width: {{SIZE}}{{UNIT}}; text-stroke-width: {{SIZE}}{{UNIT}};',
1371 - ],
1372 - ]
1373 - );
1374 -
1375 - $this->add_group_control(
1376 - \Elementor\Group_Control_Text_Shadow::get_type(),
1377 - [
1378 - 'name' => 'water_mark_text_shadow',
1379 - 'label' => esc_html__('Text Shadow', 'easy-elements'),
1380 - 'selector' => '{{WRAPPER}} .eel-watermark',
1381 - ]
1382 - );
1383 -
1384 - // Background & Box
1385 - $this->add_control(
1386 - 'water_mark_box_heading',
1387 - [
1388 - 'label' => esc_html__('Box', 'easy-elements'),
1389 - 'type' => \Elementor\Controls_Manager::HEADING,
1390 - 'separator' => 'before',
1391 - ]
1392 - );
1393 -
1394 - $this->add_group_control(
1395 - Group_Control_Background::get_type(),
1396 - [
1397 - 'name' => 'water_mark_background',
1398 - 'label' => esc_html__('Background', 'easy-elements'),
1399 - 'types' => ['classic', 'gradient'],
1400 - 'selector' => '{{WRAPPER}} .eel-watermark',
1401 - ]
1402 - );
1403 -
1404 - $this->add_group_control(
1405 - \Elementor\Group_Control_Border::get_type(),
1406 - [
1407 - 'name' => 'water_mark_border',
1408 - 'label' => esc_html__('Border', 'easy-elements'),
1409 - 'selector' => '{{WRAPPER}} .eel-watermark',
1410 - ]
1411 - );
1412 -
1413 - $this->add_responsive_control(
1414 - 'water_mark_border_radius',
1415 - [
1416 - 'label' => esc_html__('Border Radius', 'easy-elements'),
1417 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1418 - 'size_units' => ['px', '%', 'em'],
1419 - 'selectors' => [
1420 - '{{WRAPPER}} .eel-watermark' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1421 - ],
1422 - ]
1423 - );
1424 -
1425 - $this->add_responsive_control(
1426 - 'water_mark_padding',
1427 - [
1428 - 'label' => esc_html__('Padding', 'easy-elements'),
1429 - 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1430 - 'size_units' => ['px', '%', 'em'],
1431 - 'selectors' => [
1432 - '{{WRAPPER}} .eel-watermark' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1433 - ],
1434 - ]
1435 - );
1436 -
1437 - $this->add_group_control(
1438 - \Elementor\Group_Control_Box_Shadow::get_type(),
1439 - [
1440 - 'name' => 'water_mark_box_shadow',
1441 - 'label' => esc_html__('Box Shadow', 'easy-elements'),
1442 - 'selector' => '{{WRAPPER}} .eel-watermark',
1443 - ]
1444 - );
1445 -
1446 - // Position & Effects
1447 - $this->add_control(
1448 - 'water_mark_position_heading',
1449 - [
1450 - 'label' => esc_html__('Position & Effects', 'easy-elements'),
1451 - 'type' => \Elementor\Controls_Manager::HEADING,
1452 - 'separator' => 'before',
1453 - ]
1454 - );
1455 -
1456 - $this->add_responsive_control(
1457 - 'water_mark_top',
1458 - [
1459 - 'label' => esc_html__('Top / Bottom', 'easy-elements'),
1460 - 'type' => \Elementor\Controls_Manager::SLIDER,
1461 - 'size_units' => ['px', '%', 'em'],
1462 - 'range' => [
1463 - 'px' => ['min' => -500, 'max' => 500],
1464 - '%' => ['min' => -100, 'max' => 100],
1465 - 'em' => ['min' => -50, 'max' => 50],
1466 - ],
1467 - 'selectors' => [
1468 - '{{WRAPPER}} .eel-watermark' => 'top: {{SIZE}}{{UNIT}}; bottom: auto;',
1469 - ],
1470 - ]
1471 - );
1472 -
1473 - $this->add_responsive_control(
1474 - 'water_mark_left',
1475 - [
1476 - 'label' => esc_html__('Left / Right', 'easy-elements'),
1477 - 'type' => \Elementor\Controls_Manager::SLIDER,
1478 - 'size_units' => ['px', '%', 'em'],
1479 - 'range' => [
1480 - 'px' => ['min' => -500, 'max' => 500],
1481 - '%' => ['min' => 0, 'max' => 100],
1482 - 'em' => ['min' => 0, 'max' => 50],
1483 - ],
1484 - 'selectors' => [
1485 - '{{WRAPPER}} .eel-watermark' => 'left: {{SIZE}}{{UNIT}}; right: auto;',
1486 - ],
1487 - ]
1488 - );
1489 -
1490 - $this->add_responsive_control(
1491 - 'water_mark_z_index',
1492 - [
1493 - 'label' => esc_html__('Z-Index', 'easy-elements'),
1494 - 'type' => \Elementor\Controls_Manager::SLIDER,
1495 - 'default' => [
1496 - 'size' => -1,
1497 - ],
1498 - 'range' => [
1499 - 'px' => [
1500 - 'min' => -10,
1501 - 'max' => 9999,
1502 - ],
1503 - ],
1504 - 'description' => esc_html__('Use a negative value (e.g. -1) to keep the watermark behind the heading.', 'easy-elements'),
1505 - 'selectors' => [
1506 - '{{WRAPPER}} .eel-watermark' => 'z-index: {{SIZE}};',
1507 - ],
1508 - ]
1509 - );
1510 -
1511 - $this->add_responsive_control(
1512 - 'water_mark_rotation',
1513 - [
1514 - 'label' => esc_html__('Rotation', 'easy-elements'),
1515 - 'type' => \Elementor\Controls_Manager::SLIDER,
1516 - 'size_units' => ['deg'],
1517 - 'range' => [
1518 - 'deg' => ['min' => -360, 'max' => 360, 'step' => 1],
1519 - ],
1520 - 'default' => [
1521 - 'size' => '',
1522 - 'unit' => 'deg',
1523 - ],
1524 - 'selectors' => [
1525 - '{{WRAPPER}} .eel-watermark' => 'transform: translateY(-50%) rotate({{SIZE}}deg);',
1526 - ],
1527 - ]
1528 - );
1529 -
1530 - $this->add_control(
1531 - 'water_mark_opacity',
1532 - [
1533 - 'label' => esc_html__('Opacity', 'easy-elements'),
1534 - 'type' => \Elementor\Controls_Manager::SLIDER,
1535 - 'size_units' => ['%'],
1536 - 'range' => [
1537 - '%' => ['min' => 0, 'max' => 1, 'step' => 0.01],
1538 - ],
1539 - 'default' => [
1540 - 'size' => '',
1541 - 'unit' => '%',
1542 - ],
1543 - 'selectors' => [
1544 - '{{WRAPPER}} .eel-watermark' => 'opacity: {{SIZE}};',
1545 - ],
1546 - ]
1547 - );
1548 -
1549 - $this->add_control(
1550 - 'water_mark_blend_mode',
1551 - [
1552 - 'label' => esc_html__('Blend Mode', 'easy-elements'),
1553 - 'type' => \Elementor\Controls_Manager::SELECT,
1554 - 'options' => [
1555 - '' => esc_html__('Default', 'easy-elements'),
1556 - 'normal' => 'Normal',
1557 - 'multiply' => 'Multiply',
1558 - 'screen' => 'Screen',
1559 - 'overlay' => 'Overlay',
1560 - 'darken' => 'Darken',
1561 - 'lighten' => 'Lighten',
1562 - 'color-dodge' => 'Color Dodge',
1563 - 'color-burn' => 'Color Burn',
1564 - 'hard-light' => 'Hard Light',
1565 - 'soft-light' => 'Soft Light',
1566 - 'difference' => 'Difference',
1567 - 'exclusion' => 'Exclusion',
1568 - 'hue' => 'Hue',
1569 - 'saturation' => 'Saturation',
1570 - 'color' => 'Color',
1571 - 'luminosity' => 'Luminosity',
1572 - ],
1573 - 'selectors' => [
1574 - '{{WRAPPER}} .eel-watermark' => 'mix-blend-mode: {{VALUE}};',
1575 - ],
1576 - ]
1577 - );
1578 -
1579 - $this->end_controls_section();
1580 - }
1581 -
1582 - protected function render_separator( $settings ) {
1583 - if ( ! empty( $settings['separator_'] ) && in_array( $settings['separator_'], ['dotted', 'solid'], true ) ) {
1584 - echo '<div class="eel--separator-icon ' . esc_attr( $settings['separator_'] ) . '"></div>';
1585 - }
1586 -
1587 - if ( 'icon' === $settings['separator_'] && ! empty( $settings['select_icon_']['value'] ) ) {
1588 - echo '<div class="eel--separator-icon-wrap">';
1589 - \Elementor\Icons_Manager::render_icon( $settings['select_icon_'], [ 'aria-hidden' => 'true' ] );
1590 - echo '</div>';
1591 - }
1592 - if ( isset( $settings['separator_'] ) && 'image' === $settings['separator_'] && ! empty( $settings['sep_image']['url'] ) ) {
1593 - echo '<div class="eel--separator-icon-wrap">';
1594 - printf(
1595 - '<img src="%s" alt="%s" title="%s" class="eel-separator-img" loading="lazy" decoding="async" />',
1596 - esc_url( $settings['sep_image']['url'] ),
1597 - esc_attr__( 'Separator Image', 'easy-elements' ),
1598 - esc_attr__( 'Separator Image', 'easy-elements' )
1599 - );
1600 -
1601 - echo '</div>';
1602 - }
1603 - }
1604 -
1605 - protected function render() {
1606 - $settings = $this->get_settings_for_display();
1607 -
1608 - $tag = isset($settings['title_tag']) ? $settings['title_tag'] : 'h2';
1609 - $title = preg_replace_callback( '/\{\{(.*?)\}\}/', function( $matches ) {
1610 - return '<span>' . esc_html( trim( $matches[1] ) ) . '</span>';
1611 - }, $settings['title'] );
1612 -
1613 - if ( ! empty( $settings['link']['url'] ) ) {
1614 - $this->add_link_attributes( 'title_link', $settings['link'] );
1615 - $title = sprintf(
1616 - '<a %s>%s</a>',
1617 - $this->get_render_attribute_string( 'title_link' ),
1618 - $title
1619 - );
1620 - }
1621 -
1622 - $border_position = $settings['border_position'] ?? '';
1623 - $unique_id = 'eel-heading-' . $this->get_id();
1624 - $animation = isset( $settings['animation_type'] ) && ! empty($settings['animation_type']) ? $settings['animation_type'] : '';
1625 - $watermark_class = ! empty( $settings['water_mark'] ) ? 'has-watermark' : '';
1626 - ?>
1627 - <div class="e-e-heading <?php echo esc_attr( trim( $border_position . ' ' . $watermark_class ) ); ?>" <?php if(!empty($animation)) : ?>
1628 - data-eel-animation="<?php echo esc_attr($animation); ?>"
1629 - <?php endif; ?>>
1630 - <?php
1631 - $icon_direction = $settings['icon_direction'] ?? '' ;
1632 - $separator_position = ! empty( $settings['separator_position'] ) ? $settings['separator_position'] : 'default';
1633 -
1634 - if ( in_array( $separator_position, ['top'], true ) ) {
1635 - if ( ! empty( $settings['separator_'] ) ) {
1636 - $this->render_separator( $settings );
1637 - }
1638 - }
1639 -
1640 - if ( ! empty( $settings['sub_title'] ) ) : ?>
1641 - <div class="eel-sub-heading <?php echo esc_attr($icon_direction); ?> <?php echo esc_attr($settings['show_gradient_border'] == 'yes' ? 'easy_gradiant_border' : ''); ?>">
1642 - <?php
1643 - $this->add_inline_editing_attributes( 'sub_title' );
1644 - if ( 'icon' === $settings['sub_heading_type'] && ! empty( $settings['sub_heading_icon']['value'] ) ) {
1645 - \Elementor\Icons_Manager::render_icon( $settings['sub_heading_icon'], [ 'aria-hidden' => 'true' ] );
1646 - } elseif ( 'image' === $settings['sub_heading_type'] && ! empty( $settings['sub_heading_image']['url'] ) ) {
1647 - if ( ! empty( $settings['sub_heading_image']['id'] ) ) {
1648 - echo wp_get_attachment_image(
1649 - $settings['sub_heading_image']['id'],
1650 - 'full',
1651 - false,
1652 - ['alt' => $settings['sub_heading_image']['alt'] ?? '']
1653 - );
1654 - } elseif ( ! empty( $settings['sub_heading_image']['url'] ) ) {
1655 - echo '<img src="' . esc_url( $settings['sub_heading_image']['url'] ) . '" alt="">';
1656 - }
1657 - }
1658 -
1659 - ?>
1660 - <span class="elementor-inline-editing" <?php
1661 - // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1662 - echo $this->get_render_attribute_string( 'sub_title' ); ?>>
1663 - <?php
1664 - echo wp_kses_post( $settings['sub_title'] );
1665 - ?>
1666 - </span>
1667 - </div>
1668 - <?php endif;
1669 -
1670 - if ( in_array( $separator_position, ['above'], true ) ) {
1671 - if ( ! empty( $settings['separator_'] ) ) {
1672 - $this->render_separator( $settings );
1673 - }
1674 - }
1675 -
1676 - $allowed_tags = ['h1','h2','h3','h4','h5','h6','div','span'];
1677 - $tag = in_array(strtolower($tag), $allowed_tags, true) ? strtolower($tag) : 'div';
1678 -
1679 -
1680 - if ( ! empty( $title ) ) {
1681 - $gradient_class = ! empty( $settings['show_gradient_title'] ) ? ' e-e-gradient-title' : '';
1682 - $image_fill_class = ( ! empty( $settings['enable_title_image_fill'] ) ) ? ' e-e-image-fill' : '';
1683 - $tag_class = 'e-e-title elementor-inline-editing' . $gradient_class . $image_fill_class;
1684 -
1685 - // Inline editing attribute add
1686 - $this->add_inline_editing_attributes( 'title' );
1687 -
1688 - printf(
1689 - '<%1$s class="%2$s" %3$s>%4$s</%1$s>',
1690 - esc_html( $tag ),
1691 - esc_attr( $tag_class ),
1692 - // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1693 - $this->get_render_attribute_string( 'title' ),
1694 - wp_kses_post( $title )
1695 - );
1696 - }
1697 -
1698 -
1699 -
1700 - if ( in_array( $separator_position, ['below'], true ) ) {
1701 - if ( ! empty( $settings['separator_'] ) ) {
1702 - $this->render_separator( $settings );
1703 - }
1704 - }
1705 -
1706 - if ( ! empty( $settings['description'] ) ) {
1707 - $this->add_inline_editing_attributes( 'description' );
1708 - ?>
1709 - <div class="e-e-description elementor-inline-editing" <?php
1710 - // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1711 - echo $this->get_render_attribute_string( 'description' ); ?>>
1712 - <?php echo wp_kses_post( $settings['description'] ); ?>
1713 - </div>
1714 - <?php }
1715 - if ( in_array( $separator_position, ['bottom'], true ) ) {
1716 - if ( ! empty( $settings['separator_'] ) ) {
1717 - $this->render_separator( $settings );
1718 - }
1719 - }
1720 -
1721 - if ( ! empty( $settings['water_mark'] ) ) {
1722 - echo '<div class="eel-watermark">';
1723 - echo esc_html( $settings['water_mark'] );
1724 - echo '</div>';
1725 - }
1726 -
1727 - ?>
1728 - </div>
1729 - <?php }
1730 -}
1 +<?php
2 +use Elementor\Controls_Manager;
3 +use Elementor\Group_Control_Typography;
4 +use Elementor\Widget_Base;
5 +use Elementor\Group_Control_Background;
6 +
7 +if ( ! defined( 'ABSPATH' ) ) {
8 + exit;
9 +}
10 +
11 +class Easyel_Heading_Widget extends \Elementor\Widget_Base {
12 +
13 + public function get_style_depends() {
14 + $handle = 'eel-heading-style';
15 + $css_path = plugin_dir_path( __FILE__ ) . 'css/heading.css';
16 +
17 + if ( ! wp_style_is( $handle, 'registered' ) && file_exists( $css_path ) ) {
18 + wp_register_style( $handle, plugins_url( 'css/heading.css', __FILE__ ), [], defined( 'WP_DEBUG' ) && WP_DEBUG ? filemtime( $css_path ) : '1.0.0' );
19 + }
20 + return [ $handle ];
21 + }
22 +
23 + public function get_name() {
24 + return 'eel-heading';
25 + }
26 +
27 + public function get_title() {
28 + return __( 'Heading', 'easy-elements' );
29 + }
30 +
31 + public function get_icon() {
32 + return 'easyicon easyelIcon-heading';
33 + }
34 +
35 + public function get_categories() {
36 + return [ 'easyelements_category' ];
37 + }
38 + public function get_keywords() {
39 + return [ 'heading', 'title', 'link', 'click', 'text' ];
40 + }
41 +
42 + protected function register_controls() {
43 +
44 + $this->start_controls_section(
45 + 'content_section',
46 + [
47 + 'label' => esc_html__('Easy Heading Settings', 'easy-elements'),
48 + 'tab' => Controls_Manager::TAB_CONTENT,
49 + ]
50 + );
51 +
52 + $this->add_control(
53 + 'title',
54 + [
55 + 'label' => esc_html__('Heading Text', 'easy-elements'),
56 + 'type' => Controls_Manager::TEXTAREA,
57 + 'default' => esc_html__('Heading Here', 'easy-elements'),
58 + 'label_block' => true,
59 + 'description' => esc_html__('You can highlight part of the text using double curly brackets. Example: Heading {{Here}} will highlight "Here".', 'easy-elements'),
60 + ]
61 + );
62 +
63 + $this->add_control(
64 + 'show_border_title',
65 + [
66 + 'label' => esc_html__( 'Show Border', 'easy-elements' ),
67 + 'type' => \Elementor\Controls_Manager::SWITCHER,
68 + 'label_on' => esc_html__( 'Show', 'easy-elements' ),
69 + 'label_off' => esc_html__( 'Hide', 'easy-elements' ),
70 + 'return_value' => 'yes',
71 + 'default' => '',
72 + ]
73 + );
74 +
75 + $this->add_control(
76 + 'show_gradient_title',
77 + [
78 + 'label' => esc_html__( 'Gradient Text', 'easy-elements' ),
79 + 'type' => \Elementor\Controls_Manager::SWITCHER,
80 + 'label_on' => esc_html__( 'Show', 'easy-elements' ),
81 + 'label_off' => esc_html__( 'Hide', 'easy-elements' ),
82 + 'return_value' => 'yes',
83 + 'default' => '',
84 + ]
85 + );
86 +
87 + $this->add_control(
88 + 'border_position',
89 + [
90 + 'label' => esc_html__( 'Border Position', 'easy-elements' ),
91 + 'type' => \Elementor\Controls_Manager::SELECT,
92 + 'default' => 'eel_title_start',
93 + 'options' => [
94 + 'eel_title_start' => esc_html__( 'Only Start Title', 'easy-elements' ),
95 + 'eel_title_end' => esc_html__( 'Only Title End', 'easy-elements' ),
96 + 'eel_full_title_start' => esc_html__( 'Full Title Part Start', 'easy-elements' ),
97 + 'eel_full_title_end' => esc_html__( 'Full Title Part End', 'easy-elements' ),
98 + ],
99 + 'condition' => [
100 + 'show_border_title' => 'yes',
101 + ],
102 + ]
103 + );
104 +
105 +
106 + $this->add_control(
107 + 'border_color',
108 + [
109 + 'label' => esc_html__('Border Color', 'easy-elements'),
110 + 'type' => Controls_Manager::COLOR,
111 + 'selectors' => [
112 + '{{WRAPPER}} .eel_full_title_end, {{WRAPPER}} .eel_title_end .e-e-title, {{WRAPPER}} .eel_full_title_start, {{WRAPPER}} .eel_title_start .e-e-title' => 'border-color: {{VALUE}};',
113 + ],
114 + 'condition' => [
115 + 'show_border_title' => 'yes',
116 + ],
117 + ]
118 + );
119 +
120 + $this->add_responsive_control(
121 + 'title_border_padding',
122 + [
123 + 'label' => esc_html__( 'Padding', 'easy-elements' ),
124 + 'type' => \Elementor\Controls_Manager::DIMENSIONS,
125 + 'size_units' => [ 'px', '%', 'em' ],
126 + 'selectors' => [
127 + '{{WRAPPER}} .eel_full_title_end, {{WRAPPER}} .eel_title_end .e-e-title, {{WRAPPER}} .eel_full_title_start, {{WRAPPER}} .eel_title_start .e-e-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
128 + ],
129 + 'condition' => [
130 + 'show_border_title' => 'yes',
131 + ],
132 + ]
133 + );
134 +
135 +
136 + $this->add_control(
137 + 'link',
138 + [
139 + 'label' => __( 'Link', 'easy-elements' ),
140 + 'type' => \Elementor\Controls_Manager::URL,
141 + 'placeholder' => 'https://your-link.com',
142 + 'default' => [
143 + 'url' => '',
144 + 'is_external' => false,
145 + 'nofollow' => false,
146 + ],
147 + 'show_external' => true,
148 + 'description' => esc_html__( 'Set a URL to make the heading clickable. Supports opening in a new tab and nofollow attribute.', 'easy-elements' ),
149 + ]
150 + );
151 +
152 + $this->add_control(
153 + 'title_tag',
154 + [
155 + 'label' => esc_html__('Select Tag', 'easy-elements'),
156 + 'type' => Controls_Manager::SELECT,
157 + 'default' => 'h2',
158 + 'options' => [
159 + 'h1' => 'H1',
160 + 'h2' => 'H2',
161 + 'h3' => 'H3',
162 + 'h4' => 'H4',
163 + 'h5' => 'H5',
164 + 'h6' => 'H6',
165 + 'div' => 'div',
166 + ],
167 + ]
168 + );
169 +
170 + $this->add_control(
171 + 'description',
172 + [
173 + 'label' => esc_html__('Description', 'easy-elements'),
174 + 'type' => Controls_Manager::TEXTAREA,
175 + 'label_block' => true,
176 + ]
177 + );
178 +
179 +
180 + $this->add_responsive_control(
181 + 'align',
182 + [
183 + 'label' => esc_html__('Alignment', 'easy-elements'),
184 + 'type' => Controls_Manager::CHOOSE,
185 + 'options' => [
186 + 'left' => [
187 + 'title' => esc_html__('Left', 'easy-elements'),
188 + 'icon' => 'eicon-text-align-left',
189 + ],
190 + 'center' => [
191 + 'title' => esc_html__('Center', 'easy-elements'),
192 + 'icon' => 'eicon-text-align-center',
193 + ],
194 + 'right' => [
195 + 'title' => esc_html__('Right', 'easy-elements'),
196 + 'icon' => 'eicon-text-align-right',
197 + ],
198 + 'justify' => [
199 + 'title' => esc_html__('Justify', 'easy-elements'),
200 + 'icon' => 'eicon-text-align-justify',
201 + ],
202 + ],
203 + 'toggle' => true,
204 + 'selectors' => [
205 + '{{WRAPPER}} .e-e-heading' => 'text-align: {{VALUE}}',
206 + '{{WRAPPER}} .image-heading' => 'justify-content: {{VALUE}}',
207 + ],
208 + ]
209 + );
210 +
211 + $this->end_controls_section();
212 +
213 + $this->start_controls_section(
214 + 'sub_heading_section',
215 + [
216 + 'label' => esc_html__('Sub Heading Settings', 'easy-elements'),
217 + 'tab' => Controls_Manager::TAB_CONTENT,
218 + ]
219 + );
220 +
221 + $this->add_control(
222 + 'sub_title',
223 + [
224 + 'label' => esc_html__( 'Sub Heading', 'easy-elements' ),
225 + 'type' => \Elementor\Controls_Manager::TEXTAREA,
226 + 'label_block' => true,
227 + ]
228 + );
229 +
230 + $this->add_control(
231 + 'show_gradient_border',
232 + [
233 + 'label' => esc_html__( 'Show Gradient Border', 'easy-elements' ),
234 + 'type' => \Elementor\Controls_Manager::SWITCHER,
235 + 'label_on' => esc_html__( 'Show', 'easy-elements' ),
236 + 'label_off' => esc_html__( 'Hide', 'easy-elements' ),
237 + 'return_value' => 'yes',
238 + 'default' => '',
239 + ]
240 + );
241 +
242 + $this->add_control(
243 + 'gradient_color_1',
244 + [
245 + 'label' => esc_html__( 'Gradient Color 1', 'easy-elements' ),
246 + 'type' => \Elementor\Controls_Manager::COLOR,
247 + 'default' => 'rgba(0, 0, 0, 0.15)',
248 + 'selectors' => [
249 + '{{WRAPPER}} .easy_gradiant_border::before' => '--grad-color-1: {{VALUE}};',
250 + ],
251 + 'condition' => [
252 + 'show_gradient_border' => 'yes',
253 + ],
254 + ]
255 + );
256 +
257 + $this->add_control(
258 + 'gradient_color_2',
259 + [
260 + 'label' => esc_html__( 'Gradient Color 2', 'easy-elements' ),
261 + 'type' => \Elementor\Controls_Manager::COLOR,
262 + 'default' => 'rgba(0, 0, 0, 0.30)',
263 + 'selectors' => [
264 + '{{WRAPPER}} .easy_gradiant_border::before' => '--grad-color-2: {{VALUE}};',
265 + ],
266 + 'condition' => [
267 + 'show_gradient_border' => 'yes',
268 + ],
269 + ]
270 + );
271 +
272 + $this->add_control(
273 + 'gradient_color_3',
274 + [
275 + 'label' => esc_html__( 'Gradient Color 3', 'easy-elements' ),
276 + 'type' => \Elementor\Controls_Manager::COLOR,
277 + 'default' => 'rgba(0, 0, 0, 0.50)',
278 + 'selectors' => [
279 + '{{WRAPPER}} .easy_gradiant_border::before' => '--grad-color-3: {{VALUE}};',
280 + ],
281 + 'condition' => [
282 + 'show_gradient_border' => 'yes',
283 + ],
284 + ]
285 + );
286 +
287 +
288 + $this->add_responsive_control(
289 + 'sub_gradient_border_padding',
290 + [
291 + 'label' => __('Gradient Border Padding', 'easy-elements'),
292 + 'type' => \Elementor\Controls_Manager::DIMENSIONS,
293 + 'size_units' => ['px', '%', 'em'],
294 + 'selectors' => [
295 + '{{WRAPPER}} .easy_gradiant_border' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
296 + ],
297 + 'condition' => [
298 + 'show_gradient_border' => 'yes',
299 + ],
300 + ]
301 + );
302 +
303 + $this->add_responsive_control(
304 + 'gradient_border_radius',
305 + [
306 + 'label' => esc_html__( 'Border Radius', 'easy-elements' ),
307 + 'type' => \Elementor\Controls_Manager::SLIDER,
308 + 'size_units' => [ 'px', '%' ],
309 + 'range' => [
310 + 'px' => [
311 + 'min' => 0,
312 + 'max' => 200,
313 + ],
314 + '%' => [
315 + 'min' => 0,
316 + 'max' => 100,
317 + ],
318 + ],
319 + 'default' => [
320 + 'unit' => 'px',
321 + 'size' => 40,
322 + ],
323 + 'selectors' => [
324 + '{{WRAPPER}} .easy_gradiant_border::before' => '--grad-border-radius: {{SIZE}}{{UNIT}};',
325 + ],
326 + ]
327 + );
328 +
329 +
330 + $this->add_control(
331 + 'sub_heading_type',
332 + [
333 + 'label' => esc_html__( 'Sub Heading Type', 'easy-elements' ),
334 + 'type' => \Elementor\Controls_Manager::CHOOSE,
335 + 'options' => [
336 + 'none' => [
337 + 'title' => esc_html__( 'None', 'easy-elements' ),
338 + 'icon' => 'eicon-ban',
339 + ],
340 + 'icon' => [
341 + 'title' => esc_html__( 'Icon', 'easy-elements' ),
342 + 'icon' => 'eicon-star',
343 + ],
344 + 'image' => [
345 + 'title' => esc_html__( 'Image', 'easy-elements' ),
346 + 'icon' => 'eicon-image-bold',
347 + ],
348 + ],
349 + 'default' => 'none',
350 + 'toggle' => false,
351 + ]
352 + );
353 +
354 + $this->add_control(
355 + 'sub_heading_icon',
356 + [
357 + 'label' => esc_html__( 'Select Icon', 'easy-elements' ),
358 + 'type' => \Elementor\Controls_Manager::ICONS,
359 + 'default' => [
360 + 'value' => 'fas fa-heart',
361 + 'library' => 'fa-solid',
362 + ],
363 + 'condition' => [
364 + 'sub_heading_type' => 'icon',
365 + ],
366 + ]
367 + );
368 +
369 + $this->add_control(
370 + 'sub_heading_image',
371 + [
372 + 'label' => esc_html__( 'Upload Image', 'easy-elements' ),
373 + 'type' => \Elementor\Controls_Manager::MEDIA,
374 + 'default' => [
375 + 'url' => \Elementor\Utils::get_placeholder_image_src(),
376 + ],
377 + 'condition' => [
378 + 'sub_heading_type' => 'image',
379 + ],
380 + ]
381 + );
382 +
383 + $this->add_control(
384 + 'icon_color',
385 + [
386 + 'label' => esc_html__('Color', 'easy-elements'),
387 + 'type' => Controls_Manager::COLOR,
388 + 'selectors' => [
389 + '{{WRAPPER}} .eel-sub-heading i, {{WRAPPER}} .eel-sub-heading svg' => 'color: {{VALUE}}; fill: {{VALUE}};',
390 + ],
391 + 'condition' => [
392 + 'sub_heading_type' => ['icon'],
393 + ],
394 + ]
395 + );
396 +
397 + $this->add_responsive_control(
398 + 'sub_heading_icon_margin',
399 + [
400 + 'label' => esc_html__( 'Icon Spacing', 'easy-elements' ),
401 + 'type' => \Elementor\Controls_Manager::DIMENSIONS,
402 + 'size_units' => [ 'px', '%', 'em' ],
403 + 'selectors' => [
404 + '{{WRAPPER}} .eel-sub-heading span' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
405 + ],
406 + 'condition' => [
407 + 'sub_heading_type' => ['image', 'icon'],
408 + ],
409 + ]
410 + );
411 +
412 + $this->add_control(
413 + 'icon_direction',
414 + [
415 + 'label' => esc_html__( 'Direction', 'easy-elements' ),
416 + 'type' => \Elementor\Controls_Manager::CHOOSE,
417 + 'default' => 'top',
418 + 'options' => [
419 + 'left' => [
420 + 'title' => esc_html__( 'Left', 'easy-elements' ),
421 + 'icon' => 'eicon-h-align-left',
422 + ],
423 + 'top' => [
424 + 'title' => esc_html__( 'Top', 'easy-elements' ),
425 + 'icon' => 'eicon-v-align-top',
426 + ],
427 + 'right' => [
428 + 'title' => esc_html__( 'Right', 'easy-elements' ),
429 + 'icon' => 'eicon-h-align-right',
430 + ],
431 + ],
432 + 'toggle' => false,
433 + ]
434 + );
435 + $this->end_controls_section();
436 +
437 + $this->start_controls_section(
438 + 'separator_section',
439 + [
440 + 'label' => esc_html__('Separator Settings', 'easy-elements'),
441 + 'tab' => Controls_Manager::TAB_CONTENT,
442 + ]
443 + );
444 +
445 + $this->add_control(
446 + 'separator_',
447 + [
448 + 'label' => __( 'Choose Option', 'easy-elements' ),
449 + 'type' => \Elementor\Controls_Manager::SELECT,
450 + 'options' => [
451 + 'none' => __( 'None', 'easy-elements' ),
452 + 'dotted' => __( 'Dotted', 'easy-elements' ),
453 + 'solid' => __( 'Solid', 'easy-elements' ),
454 + 'icon' => __( 'Icon', 'easy-elements' ),
455 + 'image' => __( 'Image', 'easy-elements' ),
456 + ],
457 + 'default' => 'none',
458 + ]
459 + );
460 +
461 + $this->add_control(
462 + 'solid_color',
463 + [
464 + 'label' => esc_html__('Separator Color', 'easy-elements'),
465 + 'type' => \Elementor\Controls_Manager::COLOR,
466 + 'selectors' => [
467 + '{{WRAPPER}} .eel--separator-icon.dotted::before, {{WRAPPER}} .eel--separator-icon' => 'color: {{VALUE}}; background-color: {{VALUE}};',
468 + ],
469 + 'condition' => [
470 + 'separator_' => ['solid', 'dotted'],
471 + ],
472 + ]
473 + );
474 +
475 + $this->add_control(
476 + 'select_icon_',
477 + [
478 + 'label' => esc_html__( 'Select/Upload Icon', 'easy-elements' ),
479 + 'type' => \Elementor\Controls_Manager::ICONS,
480 + 'default' => [
481 + 'value' => 'fas fa-heart',
482 + 'library' => 'fa-solid',
483 + ],
484 + 'description' => esc_html__( 'You can upload an SVG image or choose a font icon.', 'easy-elements' ),
485 + 'condition' => [
486 + 'separator_' => ['icon'],
487 + ],
488 + ]
489 + );
490 +
491 + $this->add_control(
492 + 'sep_image',
493 + [
494 + 'label' => esc_html__( 'Upload Image', 'easy-elements' ),
495 + 'type' => \Elementor\Controls_Manager::MEDIA,
496 + 'default' => [
497 + 'url' => \Elementor\Utils::get_placeholder_image_src(),
498 + ],
499 + 'condition' => [
500 + 'separator_' => 'image',
501 + ],
502 + ]
503 + );
504 +
505 + $this->add_control(
506 + 'separator_position',
507 + [
508 + 'label' => esc_html__( 'Position', 'easy-elements' ),
509 + 'type' => \Elementor\Controls_Manager::SELECT,
510 + 'default' => 'below',
511 + 'options' => [
512 + 'top' => esc_html__( 'Top', 'easy-elements' ),
513 + 'above' => esc_html__( 'Above Title', 'easy-elements' ),
514 + 'below' => esc_html__( 'Title Below', 'easy-elements' ),
515 + 'bottom' => esc_html__( 'Bottom', 'easy-elements' ),
516 + ],
517 + ]
518 + );
519 +
520 + $this->add_control(
521 + 'separator_margin',
522 + [
523 + 'label' => esc_html__( 'Margin', 'easy-elements' ),
524 + 'type' => \Elementor\Controls_Manager::DIMENSIONS,
525 + 'size_units' => [ 'px', '%', 'em' ],
526 + 'selectors' => [
527 + '{{WRAPPER}} .eel--separator-icon, {{WRAPPER}} .eel--separator-icon-wrap' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
528 + ],
529 + ]
530 + );
531 +
532 + $this->end_controls_section();
533 +
534 +
535 + $this->start_controls_section(
536 + 'water_mark_section',
537 + [
538 + 'label' => esc_html__('WaterMark Settings', 'easy-elements'),
539 + 'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
540 + ]
541 + );
542 +
543 + $this->add_control(
544 + 'water_mark',
545 + [
546 + 'label' => esc_html__('WaterMark Text', 'easy-elements'),
547 + 'type' => \Elementor\Controls_Manager::TEXTAREA,
548 + 'label_block' => 'true',
549 + ]
550 + );
551 +
552 + $this->add_control(
553 + 'water_mark_font_size',
554 + [
555 + 'label' => esc_html__('Font Size', 'easy-elements'),
556 + 'type' => \Elementor\Controls_Manager::SLIDER,
557 + 'size_units' => ['px', 'em', 'rem', '%'],
558 + 'range' => [
559 + 'px' => ['min' => 10, 'max' => 300],
560 + 'em' => ['min' => 0.5, 'max' => 20],
561 + 'rem' => ['min' => 0.5, 'max' => 20],
562 + '%' => ['min' => 10, 'max' => 500],
563 + ],
564 + 'default' => [
565 + 'size' => '',
566 + 'unit' => 'px',
567 + ],
568 + 'selectors' => [
569 + '{{WRAPPER}} .eel-watermark' => 'font-size: {{SIZE}}{{UNIT}};',
570 + ],
571 + ]
572 + );
573 +
574 + $this->add_control(
575 + '_mark_color',
576 + [
577 + 'label' => esc_html__('Color', 'easy-elements'),
578 + 'type' => \Elementor\Controls_Manager::COLOR,
579 + 'default' => '',
580 + 'selectors' => [
581 + '{{WRAPPER}} .eel-watermark' => 'color: {{VALUE}};',
582 + ],
583 + ]
584 + );
585 +
586 + $this->add_control(
587 + 'water_mark_color',
588 + [
589 + 'label' => esc_html__('Stroke Color', 'easy-elements'),
590 + 'type' => \Elementor\Controls_Manager::COLOR,
591 + 'default' => 'rgba(0, 0, 0, 0.3)',
592 + 'selectors' => [
593 + '{{WRAPPER}} .eel-watermark' => '-webkit-text-stroke-color: {{VALUE}}; text-stroke-color: {{VALUE}};',
594 + ],
595 + ]
596 + );
597 +
598 + $this->add_control(
599 + 'water_mark_stroke_width',
600 + [
601 + 'label' => esc_html__('Stroke Width (px)', 'easy-elements'),
602 + 'type' => \Elementor\Controls_Manager::SLIDER,
603 + 'default' => [
604 + 'size' => 1,
605 + 'unit' => 'px',
606 + ],
607 + 'range' => [
608 + 'px' => [
609 + 'min' => 0,
610 + 'max' => 10,
611 + ],
612 + ],
613 + 'selectors' => [
614 + '{{WRAPPER}} .eel-watermark' => '-webkit-text-stroke-width: {{SIZE}}{{UNIT}}; text-stroke-width: {{SIZE}}{{UNIT}};',
615 + ],
616 + ]
617 + );
618 +
619 + $this->add_responsive_control(
620 + 'water_mark_top',
621 + [
622 + 'label' => esc_html__('Top / Bottom', 'easy-elements'),
623 + 'type' => \Elementor\Controls_Manager::SLIDER,
624 + 'size_units' => ['px', '%', 'em'],
625 + 'range' => [
626 + 'px' => ['min' => -500, 'max' => 500],
627 + '%' => ['min' => -100, 'max' => 100],
628 + 'em' => ['min' => -50, 'max' => 50],
629 + ],
630 + 'selectors' => [
631 + '{{WRAPPER}} .eel-watermark' => 'top: {{SIZE}}{{UNIT}};',
632 + ],
633 + ]
634 + );
635 +
636 + $this->add_responsive_control(
637 + 'water_mark_left',
638 + [
639 + 'label' => esc_html__('Left / Right', 'easy-elements'),
640 + 'type' => \Elementor\Controls_Manager::SLIDER,
641 + 'size_units' => ['px', '%', 'em'],
642 + 'range' => [
643 + 'px' => ['min' => -500, 'max' => 500],
644 + '%' => ['min' => 0, 'max' => 100],
645 + 'em' => ['min' => 0, 'max' => 50],
646 + ],
647 + 'selectors' => [
648 + '{{WRAPPER}} .eel-watermark' => 'left: {{SIZE}}{{UNIT}};',
649 + ],
650 + ]
651 + );
652 +
653 + $this->add_responsive_control(
654 + 'water_mark_z_index',
655 + [
656 + 'label' => esc_html__('Z-Index', 'easy-elements'),
657 + 'type' => \Elementor\Controls_Manager::SLIDER,
658 + 'default' => [
659 + 'size' => -1,
660 + ],
661 + 'range' => [
662 + 'px' => [
663 + 'min' => 0,
664 + 'max' => 9999,
665 + ],
666 + ],
667 + 'selectors' => [
668 + '{{WRAPPER}} .eel-watermark' => 'z-index: {{SIZE}};',
669 + ],
670 + ]
671 + );
672 +
673 +
674 + $this->end_controls_section();
675 +
676 +
677 +
678 + // Heading
679 + $this->start_controls_section(
680 + 'section_heading_style',
681 + [
682 + 'label' => esc_html__('Heading', 'easy-elements'),
683 + 'tab' => Controls_Manager::TAB_STYLE,
684 + ]
685 + );
686 +
687 + $this->add_control(
688 + 'title_color',
689 + [
690 + 'label' => esc_html__('Color', 'easy-elements'),
691 + 'type' => Controls_Manager::COLOR,
692 + 'selectors' => [
693 + '{{WRAPPER}} .e-e-heading .e-e-title' => 'color: {{VALUE}};',
694 + ],
695 + 'condition' => [
696 + 'show_gradient_title' => '',
697 + ],
698 + ]
699 + );
700 +
701 + $this->add_control(
702 + 'title_color_gradient_heading',
703 + [
704 + 'label' => esc_html__('Text Gradient Color', 'easy-elements'),
705 + 'type' => Controls_Manager::HEADING,
706 + 'separator' => 'before',
707 + 'condition' => [
708 + 'show_gradient_title' => 'yes',
709 + ]
710 + ]
711 + );
712 +
713 + $this->add_group_control(
714 + Group_Control_Background::get_type(),
715 + [
716 + 'name' => 'title_gradient_color',
717 + 'label' => __( 'Title Color', 'easy-elements' ),
718 + 'types' => [ 'classic', 'gradient' ],
719 + 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title.e-e-gradient-title',
720 + 'condition' => [
721 + 'show_gradient_title' => 'yes',
722 + ],
723 + ]
724 + );
725 +
726 +
727 + $this->add_group_control(
728 + Group_Control_Typography::get_type(),
729 + [
730 + 'name' => 'title_typography',
731 + 'label' => esc_html__('Typography', 'easy-elements'),
732 + 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title',
733 + ]
734 + );
735 + $this->add_control(
736 + 'title_opacity',
737 + [
738 + 'label' => esc_html__('Opacity', 'easy-elements'),
739 + 'type' => Controls_Manager::SLIDER,
740 + 'selectors' => [
741 + '{{WRAPPER}} .e-e-heading .e-e-title' => 'opacity: {{SIZE}};',
742 + ],
743 + 'default' => [
744 + 'size' => 1,
745 + 'unit' => 'px',
746 + ],
747 + ]
748 + );
749 +
750 + $this->add_control(
751 + 'title_text_stroke',
752 + [
753 + 'label' => esc_html__('Stroke Width', 'easy-elements'),
754 + 'type' => Controls_Manager::SLIDER,
755 + 'selectors' => [
756 + '{{WRAPPER}} .e-e-heading .e-e-title' => '-webkit-text-stroke-width: {{SIZE}}{{UNIT}};',
757 + ],
758 + 'default' => [
759 + 'size' => 0,
760 + 'unit' => 'px',
761 + ],
762 + ]
763 + );
764 + $this->add_control(
765 + 'title_text_stroke_color',
766 + [
767 + 'label' => esc_html__('Stroke Color', 'easy-elements'),
768 + 'type' => Controls_Manager::COLOR,
769 + 'selectors' => [
770 + '{{WRAPPER}} .e-e-heading .e-e-title' => '-webkit-text-stroke-color: {{VALUE}};',
771 + ],
772 + 'condition' => [
773 + 'title_text_stroke[size]!' => '',
774 + ],
775 + ]
776 + );
777 + // Text Shadow
778 + $this->add_group_control(
779 + \Elementor\Group_Control_Text_Shadow::get_type(),
780 + [
781 + 'name' => 'title_text_shadow',
782 + 'label' => esc_html__('Text Shadow', 'easy-elements'),
783 + 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title',
784 + ]
785 + );
786 + // Mix Blend Mode
787 + $this->add_control(
788 + 'title_blend_mode',
789 + [
790 + 'label' => esc_html__('Blend Mode', 'easy-elements'),
791 + 'type' => Controls_Manager::SELECT,
792 + 'options' => [
793 + '' => esc_html__('Default', 'easy-elements'),
794 + 'normal' => 'Normal',
795 + 'multiply' => 'Multiply',
796 + 'screen' => 'Screen',
797 + 'overlay' => 'Overlay',
798 + 'darken' => 'Darken',
799 + 'lighten' => 'Lighten',
800 + 'color-dodge' => 'Color Dodge',
801 + 'color-burn' => 'Color Burn',
802 + 'hard-light' => 'Hard Light',
803 + 'soft-light' => 'Soft Light',
804 + 'difference' => 'Difference',
805 + 'exclusion' => 'Exclusion',
806 + 'hue' => 'Hue',
807 + 'saturation' => 'Saturation',
808 + 'color' => 'Color',
809 + 'luminosity' => 'Luminosity',
810 + ],
811 + 'selectors' => [
812 + '{{WRAPPER}} .e-e-heading .e-e-title' => 'mix-blend-mode: {{VALUE}};',
813 + ],
814 + ]
815 + );
816 + $this->add_responsive_control(
817 + 'title_margin',
818 + [
819 + 'label' => esc_html__('Margin', 'easy-elements'),
820 + 'type' => Controls_Manager::DIMENSIONS,
821 + 'size_units' => ['px', 'em', '%'],
822 + 'selectors' => [
823 + '{{WRAPPER}} .e-e-heading .e-e-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
824 + ],
825 + ]
826 + );
827 +
828 + $this->add_responsive_control(
829 + 'title_padding',
830 + [
831 + 'label' => esc_html__('Padding', 'easy-elements'),
832 + 'type' => Controls_Manager::DIMENSIONS,
833 + 'size_units' => ['px', 'em', '%'],
834 + 'selectors' => [
835 + '{{WRAPPER}} .e-e-heading .e-e-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
836 + ],
837 + ]
838 + );
839 +
840 +
841 + $this->add_control(
842 + 'title_image_fill_heading',
843 + [
844 + 'label' => esc_html__('Image Fill (Text Mask)', 'easy-elements'),
845 + 'type' => Controls_Manager::HEADING,
846 + 'separator' => 'before',
847 + ]
848 + );
849 +
850 + $this->add_control(
851 + 'enable_title_image_fill',
852 + [
853 + 'label' => esc_html__('Enable Image Fill', 'easy-elements'),
854 + 'type' => \Elementor\Controls_Manager::SWITCHER,
855 + 'label_on' => esc_html__('Yes', 'easy-elements'),
856 + 'label_off' => esc_html__('No', 'easy-elements'),
857 + 'return_value' => 'yes',
858 + 'default' => '',
859 + ]
860 + );
861 +
862 + $this->add_group_control(
863 + Group_Control_Background::get_type(),
864 + [
865 + 'name' => 'title_image_fill_bg',
866 + 'label' => esc_html__('Image Fill', 'easy-elements'),
867 + 'types' => [ 'classic' ],
868 + 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title.e-e-image-fill, {{WRAPPER}} .e-e-heading .e-e-title.e-e-image-fill div',
869 + 'fields_options' => [
870 + 'background' => [
871 + 'default' => 'classic',
872 + ],
873 + 'classic' => [
874 + 'types' => [ 'image' ],
875 + ],
876 + ],
877 + 'condition' => [
878 + 'enable_title_image_fill' => 'yes',
879 + ],
880 + ]
881 + );
882 +
883 + $this->add_control(
884 + 'title_image_fill_note',
885 + [
886 + 'type' => Controls_Manager::RAW_HTML,
887 + 'raw' => __('Tip: Apply this only when you want the text to be filled with an image (the image will appear inside the text).', 'easy-elements'),
888 + 'content_classes' => 'elementor-panel-alert elementor-panel-alert-info',
889 + ]
890 + );
891 +
892 + $this->end_controls_section();
893 +
894 + //Sub Heading
895 + $this->start_controls_section(
896 + 'section_sub_heading_style',
897 + [
898 + 'label' => esc_html__('Sub Heading', 'easy-elements'),
899 + 'tab' => Controls_Manager::TAB_STYLE,
900 + ]
901 + );
902 +
903 + $this->add_control(
904 + 'sub_heading_color',
905 + [
906 + 'label' => esc_html__('Color', 'easy-elements'),
907 + 'type' => Controls_Manager::COLOR,
908 + 'selectors' => [
909 + '{{WRAPPER}} .e-e-heading .eel-sub-heading span' => 'color: {{VALUE}};',
910 + ],
911 + ]
912 + );
913 +
914 + $this->add_group_control(
915 + \Elementor\Group_Control_Background::get_type(),
916 + [
917 + 'name' => 'background_subtext',
918 + 'types' => [ 'classic', 'gradient' ],
919 + 'selector' => '{{WRAPPER}} .eel-sub-heading.top',
920 + 'condition' => [
921 + 'icon_direction' => 'top',
922 + ],
923 + ]
924 + );
925 +
926 + $this->add_group_control(
927 + \Elementor\Group_Control_Background::get_type(),
928 + [
929 + 'name' => 'background_subtext_top',
930 + 'types' => [ 'classic', 'gradient' ],
931 + 'selector' => '{{WRAPPER}} .eel-sub-heading',
932 + 'condition' => [
933 + 'icon_direction' => ['left', 'right'],
934 + ],
935 + ]
936 + );
937 +
938 + $this->add_group_control(
939 + Group_Control_Typography::get_type(),
940 + [
941 + 'name' => 'sub_heading_typography',
942 + 'label' => esc_html__('Typography', 'easy-elements'),
943 + 'selector' => '{{WRAPPER}} .e-e-heading .eel-sub-heading span',
944 + ]
945 + );
946 +
947 + $this->add_group_control(
948 + \Elementor\Group_Control_Border::get_type(),
949 + [
950 + 'name' => 'subtext_border',
951 + 'label' => esc_html__( 'Border', 'easy-elements' ),
952 + 'selector' => '{{WRAPPER}} .eel-sub-heading',
953 + ]
954 + );
955 +
956 + $this->add_control(
957 + 'subtext_icon_size',
958 + [
959 + 'label' => esc_html__( 'Icon Size', 'easy-elements' ),
960 + 'type' => \Elementor\Controls_Manager::SLIDER,
961 + 'range' => [
962 + 'px' => [
963 + 'min' => 6,
964 + 'max' => 100,
965 + ],
966 + ],
967 + 'selectors' => [
968 + '{{WRAPPER}} .eel-sub-heading i, {{WRAPPER}} .eel-sub-heading svg' => 'font-size: {{SIZE}}{{UNIT}};',
969 + ],
970 + 'description' => esc_html__( 'Adjust the icon size in pixels for the subheading icon.', 'easy-elements' ),
971 + 'condition' => [
972 + 'sub_heading_type' => 'icon',
973 + ],
974 + ]
975 + );
976 +
977 + $this->add_responsive_control(
978 + 'subtext_border_radius',
979 + [
980 + 'label' => esc_html__( 'Border Radius', 'easy-elements' ),
981 + 'type' => \Elementor\Controls_Manager::DIMENSIONS,
982 + 'size_units' => [ 'px', '%', 'em' ],
983 + 'selectors' => [
984 + '{{WRAPPER}} .eel-sub-heading' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
985 + ],
986 + ]
987 + );
988 +
989 + $this->add_responsive_control(
990 + 'subtext_padding',
991 + [
992 + 'label' => esc_html__( 'Padding', 'easy-elements' ),
993 + 'type' => \Elementor\Controls_Manager::DIMENSIONS,
994 + 'size_units' => [ 'px', '%', 'em' ],
995 + 'selectors' => [
996 + '{{WRAPPER}} .eel-sub-heading' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
997 + ],
998 + ]
999 + );
1000 +
1001 + $this->add_control(
1002 + 'sub_heading_margin',
1003 + [
1004 + 'label' => esc_html__( 'Margin', 'easy-elements' ),
1005 + 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1006 + 'size_units' => [ 'px', '%', 'em' ],
1007 + 'selectors' => [
1008 + '{{WRAPPER}} .eel-sub-heading' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1009 + ],
1010 + ]
1011 + );
1012 +
1013 + $this->end_controls_section();
1014 +
1015 +
1016 + // Highlight
1017 + $this->start_controls_section(
1018 + 'section_highlight_style',
1019 + [
1020 + 'label' => esc_html__('Highlight', 'easy-elements'),
1021 + 'tab' => Controls_Manager::TAB_STYLE,
1022 + ]
1023 + );
1024 + $this->add_control(
1025 + 'highlight_color',
1026 + [
1027 + 'label' => esc_html__('Color', 'easy-elements'),
1028 + 'type' => Controls_Manager::COLOR,
1029 + 'selectors' => [
1030 + '{{WRAPPER}} .e-e-heading .e-e-title span' => 'color: {{VALUE}};',
1031 + ],
1032 + ]
1033 + );
1034 +
1035 + $this->add_group_control(
1036 + \Elementor\Group_Control_Background::get_type(),
1037 + [
1038 + 'name' => 'background_highlight',
1039 + 'types' => [ 'classic', 'gradient' ],
1040 + 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title span',
1041 + ]
1042 + );
1043 +
1044 + $this->add_group_control(
1045 + Group_Control_Typography::get_type(),
1046 + [
1047 + 'name' => 'highlight_typography',
1048 + 'label' => esc_html__('Highlight Typography', 'easy-elements'),
1049 + 'selector' => '{{WRAPPER}} .e-e-heading .e-e-title span',
1050 + ]
1051 + );
1052 +
1053 + $this->add_responsive_control(
1054 + 'highlight_padding',
1055 + [
1056 + 'label' => esc_html__( 'Padding', 'easy-elements' ),
1057 + 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1058 + 'size_units' => [ 'px', '%', 'em' ],
1059 + 'selectors' => [
1060 + '{{WRAPPER}} .e-e-heading .e-e-title span' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1061 + ],
1062 + ]
1063 + );
1064 +
1065 + $this->add_control(
1066 + 'highlight_margin',
1067 + [
1068 + 'label' => esc_html__( 'Margin', 'easy-elements' ),
1069 + 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1070 + 'size_units' => [ 'px', '%', 'em' ],
1071 + 'selectors' => [
1072 + '{{WRAPPER}} .e-e-heading .e-e-title span' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1073 + ],
1074 + ]
1075 + );
1076 +
1077 + $this->add_responsive_control(
1078 + 'hithlight_border_radius',
1079 + [
1080 + 'label' => esc_html__( 'Border Radius', 'easy-elements' ),
1081 + 'type' => \Elementor\Controls_Manager::DIMENSIONS,
1082 + 'size_units' => [ 'px', '%', 'em' ],
1083 + 'selectors' => [
1084 + '{{WRAPPER}} .e-e-heading .e-e-title span' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1085 + ],
1086 + ]
1087 + );
1088 +
1089 + $this->end_controls_section();
1090 +
1091 + // Description
1092 + $this->start_controls_section(
1093 + 'section_description_style',
1094 + [
1095 + 'label' => esc_html__('Description', 'easy-elements'),
1096 + 'tab' => Controls_Manager::TAB_STYLE,
1097 + ]
1098 + );
1099 + $this->add_control(
1100 + 'description_color',
1101 + [
1102 + 'label' => esc_html__('Color', 'easy-elements'),
1103 + 'type' => Controls_Manager::COLOR,
1104 + 'selectors' => [
1105 + '{{WRAPPER}} .e-e-heading .e-e-description' => 'color: {{VALUE}};',
1106 + ],
1107 + ]
1108 + );
1109 + $this->add_group_control(
1110 + Group_Control_Typography::get_type(),
1111 + [
1112 + 'name' => 'description_typography',
1113 + 'label' => esc_html__('Title Typography', 'easy-elements'),
1114 + 'selector' => '{{WRAPPER}} .e-e-heading .e-e-description',
1115 + ]
1116 + );
1117 + $this->add_responsive_control(
1118 + 'description_margin',
1119 + [
1120 + 'label' => esc_html__('Margin', 'easy-elements'),
1121 + 'type' => Controls_Manager::DIMENSIONS,
1122 + 'size_units' => ['px', 'em', '%'],
1123 + 'selectors' => [
1124 + '{{WRAPPER}} .e-e-heading .e-e-description' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1125 + ],
1126 + ]
1127 + );
1128 + $this->add_responsive_control(
1129 + 'description_padding',
1130 + [
1131 + 'label' => esc_html__('Padding', 'easy-elements'),
1132 + 'type' => Controls_Manager::DIMENSIONS,
1133 + 'size_units' => ['px', 'em', '%'],
1134 + 'selectors' => [
1135 + '{{WRAPPER}} .e-e-heading .e-e-description' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1136 + ],
1137 + ]
1138 + );
1139 + $this->end_controls_section();
1140 + }
1141 +
1142 + protected function render_separator( $settings ) {
1143 + if ( ! empty( $settings['separator_'] ) && in_array( $settings['separator_'], ['dotted', 'solid'], true ) ) {
1144 + echo '<div class="eel--separator-icon ' . esc_attr( $settings['separator_'] ) . '"></div>';
1145 + }
1146 +
1147 + if ( 'icon' === $settings['separator_'] && ! empty( $settings['select_icon_']['value'] ) ) {
1148 + echo '<div class="eel--separator-icon-wrap">';
1149 + \Elementor\Icons_Manager::render_icon( $settings['select_icon_'], [ 'aria-hidden' => 'true' ] );
1150 + echo '</div>';
1151 + }
1152 + if ( isset( $settings['separator_'] ) && 'image' === $settings['separator_'] && ! empty( $settings['sep_image']['url'] ) ) {
1153 + echo '<div class="eel--separator-icon-wrap">';
1154 + printf(
1155 + '<img src="%s" alt="%s" title="%s" class="eel-separator-img" loading="lazy" decoding="async" />',
1156 + esc_url( $settings['sep_image']['url'] ),
1157 + esc_attr__( 'Separator Image', 'easy-elements' ),
1158 + esc_attr__( 'Separator Image', 'easy-elements' )
1159 + );
1160 +
1161 + echo '</div>';
1162 + }
1163 + }
1164 +
1165 + protected function render() {
1166 + $settings = $this->get_settings_for_display();
1167 +
1168 + $tag = isset($settings['title_tag']) ? $settings['title_tag'] : 'h2';
1169 + $title = preg_replace_callback( '/\{\{(.*?)\}\}/', function( $matches ) {
1170 + return '<span>' . esc_html( trim( $matches[1] ) ) . '</span>';
1171 + }, $settings['title'] );
1172 +
1173 + if ( ! empty( $settings['link']['url'] ) ) {
1174 + $this->add_link_attributes( 'title_link', $settings['link'] );
1175 + $title = sprintf(
1176 + '<a %s>%s</a>',
1177 + $this->get_render_attribute_string( 'title_link' ),
1178 + $title
1179 + );
1180 + }
1181 +
1182 + $border_position = $settings['border_position'] ?? '';
1183 + $unique_id = 'eel-heading-' . $this->get_id();
1184 + $animation = isset( $settings['animation_type'] ) && ! empty($settings['animation_type']) ? $settings['animation_type'] : '';
1185 + ?>
1186 + <div class="e-e-heading <?php echo esc_attr($border_position); ?>" <?php if(!empty($animation)) : ?>
1187 + data-eel-animation="<?php echo esc_attr($animation); ?>"
1188 + <?php endif; ?>>
1189 + <?php
1190 + $icon_direction = $settings['icon_direction'] ?? '' ;
1191 + $separator_position = ! empty( $settings['separator_position'] ) ? $settings['separator_position'] : 'default';
1192 +
1193 + if ( in_array( $separator_position, ['top'], true ) ) {
1194 + if ( ! empty( $settings['separator_'] ) ) {
1195 + $this->render_separator( $settings );
1196 + }
1197 + }
1198 +
1199 + if ( ! empty( $settings['sub_title'] ) ) : ?>
1200 + <div class="eel-sub-heading <?php echo esc_attr($icon_direction); ?> <?php echo esc_attr($settings['show_gradient_border'] == 'yes' ? 'easy_gradiant_border' : ''); ?>">
1201 + <?php
1202 + if ( 'icon' === $settings['sub_heading_type'] && ! empty( $settings['sub_heading_icon']['value'] ) ) {
1203 + \Elementor\Icons_Manager::render_icon( $settings['sub_heading_icon'], [ 'aria-hidden' => 'true' ] );
1204 + } elseif ( 'image' === $settings['sub_heading_type'] && ! empty( $settings['sub_heading_image']['url'] ) ) {
1205 + if ( ! empty( $settings['sub_heading_image']['id'] ) ) {
1206 + echo wp_get_attachment_image(
1207 + $settings['sub_heading_image']['id'],
1208 + 'full',
1209 + false,
1210 + ['alt' => $settings['sub_heading_image']['alt'] ?? '']
1211 + );
1212 + } elseif ( ! empty( $settings['sub_heading_image']['url'] ) ) {
1213 + echo '<img src="' . esc_url( $settings['sub_heading_image']['url'] ) . '" alt="">';
1214 + }
1215 + } ?>
1216 + <span>
1217 + <?php
1218 + echo wp_kses_post( $settings['sub_title'] );
1219 + ?>
1220 + </span>
1221 + </div>
1222 + <?php endif;
1223 +
1224 + if ( in_array( $separator_position, ['above'], true ) ) {
1225 + if ( ! empty( $settings['separator_'] ) ) {
1226 + $this->render_separator( $settings );
1227 + }
1228 + }
1229 +
1230 + $allowed_tags = ['h1','h2','h3','h4','h5','h6','div','span'];
1231 + $tag = in_array(strtolower($tag), $allowed_tags, true) ? strtolower($tag) : 'div';
1232 +
1233 +
1234 + if ( ! empty( $title ) ) {
1235 + $gradient_class = ! empty( $settings['show_gradient_title'] ) ? ' e-e-gradient-title' : '';
1236 + $image_fill_class = ( ! empty( $settings['enable_title_image_fill'] ) ) ? ' e-e-image-fill' : '';
1237 + $tag_class = 'e-e-title' . $gradient_class . $image_fill_class;
1238 +
1239 + printf(
1240 + '<%1$s class="%2$s" %3$s>%4$s</%1$s>',
1241 + esc_html( $tag ),
1242 + esc_attr( $tag_class ),
1243 + esc_attr( $this->get_render_attribute_string( 'title' ) ),
1244 + wp_kses_post( $title )
1245 + );
1246 + }
1247 +
1248 +
1249 + if ( in_array( $separator_position, ['below'], true ) ) {
1250 + if ( ! empty( $settings['separator_'] ) ) {
1251 + $this->render_separator( $settings );
1252 + }
1253 + }
1254 +
1255 + if ( ! empty( $settings['description'] ) ) {
1256 + ?>
1257 + <div class="e-e-description">
1258 + <?php echo wp_kses_post( $settings['description'] ); ?>
1259 + </div>
1260 + <?php }
1261 + if ( in_array( $separator_position, ['bottom'], true ) ) {
1262 + if ( ! empty( $settings['separator_'] ) ) {
1263 + $this->render_separator( $settings );
1264 + }
1265 + }
1266 +
1267 + if ( ! empty( $settings['water_mark'] ) ) {
1268 + echo '<div class="eel-watermark">';
1269 + echo esc_html( $settings['water_mark'] );
1270 + echo '</div>';
1271 + }
1272 +
1273 + ?>
1274 + </div>
1275 + <?php }
1276 +}
1277 +?>