PluginProbe
Elementor Website Builder – more than just a page builder / 3.0.2
Elementor Website Builder – more than just a page builder v3.0.2
4.3.0-beta2 4.3.0-beta1 4.2.4 4.2.3 4.2.2 4.2.1 4.2.0 4.1.5 4.2.0-beta2 4.2.0-dev2 4.2.0-beta1 4.1.4 4.1.3 4.1.2 4.1.1 4.1.0 4.1.0-beta3 4.1.0-dev3 4.0.9 4.1.0-beta2 4.1.0-dev2 4.0.8 4.1.0-beta1 4.1.0-dev1 4.0.7 All 451 releases
← All changes | includes/widgets/counter.php +50 -419 4.2.0-dev23.0.2 View file →
@@ -41,9 +41,9 @@
41 41 *
42 42 * @return string Widget title.
43 43 */
44 44 public function get_title() {
45 - return esc_html__( 'Counter', 'elementor' );
45 + return __( 'Counter', 'elementor' );
46 46 }
47 47
48 48 /**
49 49 * Get widget icon.
@@ -86,43 +86,21 @@
86 86 public function get_keywords() {
87 87 return [ 'counter' ];
88 88 }
89 89
90 - protected function is_dynamic_content(): bool {
91 - return false;
92 - }
93 -
94 90 /**
95 - * Get style dependencies.
96 - *
97 - * Retrieve the list of style dependencies the widget requires.
98 - *
99 - * @since 3.24.0
100 - * @access public
101 - *
102 - * @return array Widget style dependencies.
103 - */
104 - public function get_style_depends(): array {
105 - return [ 'widget-counter' ];
106 - }
107 -
108 - public function has_widget_inner_wrapper(): bool {
109 - return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
110 - }
111 -
112 - /**
113 91 * Register counter widget controls.
114 92 *
115 93 * Adds different input fields to allow the user to change and customize the widget settings.
116 94 *
117 - * @since 3.1.0
95 + * @since 1.0.0
118 96 * @access protected
119 97 */
120 - protected function register_controls() {
98 + protected function _register_controls() {
121 99 $this->start_controls_section(
122 100 'section_counter',
123 101 [
124 - 'label' => esc_html__( 'Counter', 'elementor' ),
102 + 'label' => __( 'Counter', 'elementor' ),
125 103 ]
126 104 );
127 105
128 106 $this->add_control(
@@ -127,9 +105,9 @@
127 105
128 106 $this->add_control(
129 107 'starting_number',
130 108 [
131 - 'label' => esc_html__( 'Starting Number', 'elementor' ),
109 + 'label' => __( 'Starting Number', 'elementor' ),
132 110 'type' => Controls_Manager::NUMBER,
133 111 'default' => 0,
134 112 'dynamic' => [
135 113 'active' => true,
@@ -139,9 +117,9 @@
139 117
140 118 $this->add_control(
141 119 'ending_number',
142 120 [
143 - 'label' => esc_html__( 'Ending Number', 'elementor' ),
121 + 'label' => __( 'Ending Number', 'elementor' ),
144 122 'type' => Controls_Manager::NUMBER,
145 123 'default' => 100,
146 124 'dynamic' => [
147 125 'active' => true,
@@ -151,17 +129,15 @@
151 129
152 130 $this->add_control(
153 131 'prefix',
154 132 [
155 - 'label' => esc_html__( 'Number Prefix', 'elementor' ),
133 + 'label' => __( 'Number Prefix', 'elementor' ),
156 134 'type' => Controls_Manager::TEXT,
157 135 'dynamic' => [
158 136 'active' => true,
159 137 ],
160 - 'ai' => [
161 - 'active' => false,
162 - ],
163 138 'default' => '',
139 + 'placeholder' => 1,
164 140 ]
165 141 );
166 142
167 143 $this->add_control(
@@ -166,17 +142,15 @@
166 142
167 143 $this->add_control(
168 144 'suffix',
169 145 [
170 - 'label' => esc_html__( 'Number Suffix', 'elementor' ),
146 + 'label' => __( 'Number Suffix', 'elementor' ),
171 147 'type' => Controls_Manager::TEXT,
172 148 'dynamic' => [
173 149 'active' => true,
174 150 ],
175 - 'ai' => [
176 - 'active' => false,
177 - ],
178 151 'default' => '',
152 + 'placeholder' => __( 'Plus', 'elementor' ),
179 153 ]
180 154 );
181 155
182 156 $this->add_control(
@@ -181,9 +155,9 @@
181 155
182 156 $this->add_control(
183 157 'duration',
184 158 [
185 - 'label' => esc_html__( 'Animation Duration', 'elementor' ) . ' (ms)',
159 + 'label' => __( 'Animation Duration', 'elementor' ),
186 160 'type' => Controls_Manager::NUMBER,
187 161 'default' => 2000,
188 162 'min' => 100,
189 163 'step' => 100,
@@ -192,13 +166,13 @@
192 166
193 167 $this->add_control(
194 168 'thousand_separator',
195 169 [
196 - 'label' => esc_html__( 'Thousand Separator', 'elementor' ),
170 + 'label' => __( 'Thousand Separator', 'elementor' ),
197 171 'type' => Controls_Manager::SWITCHER,
198 172 'default' => 'yes',
199 - 'label_on' => esc_html__( 'Show', 'elementor' ),
200 - 'label_off' => esc_html__( 'Hide', 'elementor' ),
173 + 'label_on' => __( 'Show', 'elementor' ),
174 + 'label_off' => __( 'Hide', 'elementor' ),
201 175 ]
202 176 );
203 177
204 178 $this->add_control(
@@ -203,9 +177,9 @@
203 177
204 178 $this->add_control(
205 179 'thousand_separator_char',
206 180 [
207 - 'label' => esc_html__( 'Separator', 'elementor' ),
181 + 'label' => __( 'Separator', 'elementor' ),
208 182 'type' => Controls_Manager::SELECT,
209 183 'condition' => [
210 184 'thousand_separator' => 'yes',
211 185 ],
@@ -212,10 +186,8 @@
212 186 'options' => [
213 187 '' => 'Default',
214 188 '.' => 'Dot',
215 189 ' ' => 'Space',
216 - '_' => 'Underline',
217 - "'" => 'Apostrophe',
218 190 ],
219 191 ]
220 192 );
221 193
@@ -221,39 +193,25 @@
221 193
222 194 $this->add_control(
223 195 'title',
224 196 [
225 - 'label' => esc_html__( 'Title', 'elementor' ),
197 + 'label' => __( 'Title', 'elementor' ),
226 198 'type' => Controls_Manager::TEXT,
227 199 'label_block' => true,
228 - 'separator' => 'before',
229 200 'dynamic' => [
230 201 'active' => true,
231 202 ],
232 - 'default' => esc_html__( 'Cool Number', 'elementor' ),
203 + 'default' => __( 'Cool Number', 'elementor' ),
204 + 'placeholder' => __( 'Cool Number', 'elementor' ),
233 205 ]
234 206 );
235 207
236 208 $this->add_control(
237 - 'title_tag',
209 + 'view',
238 210 [
239 - 'label' => esc_html__( 'Title HTML Tag', 'elementor' ),
240 - 'type' => Controls_Manager::SELECT,
241 - 'options' => [
242 - 'h1' => 'H1',
243 - 'h2' => 'H2',
244 - 'h3' => 'H3',
245 - 'h4' => 'H4',
246 - 'h5' => 'H5',
247 - 'h6' => 'H6',
248 - 'div' => 'div',
249 - 'span' => 'span',
250 - 'p' => 'p',
251 - ],
252 - 'default' => 'div',
253 - 'condition' => [
254 - 'title!' => '',
255 - ],
211 + 'label' => __( 'View', 'elementor' ),
212 + 'type' => Controls_Manager::HIDDEN,
213 + 'default' => 'traditional',
256 214 ]
257 215 );
258 216
259 217 $this->end_controls_section();
@@ -258,238 +216,11 @@
258 216
259 217 $this->end_controls_section();
260 218
261 219 $this->start_controls_section(
262 - 'section_counter_style',
263 - [
264 - 'label' => esc_html__( 'Counter', 'elementor' ),
265 - 'tab' => Controls_Manager::TAB_STYLE,
266 - ]
267 - );
268 -
269 - $this->add_responsive_control(
270 - 'title_position',
271 - [
272 - 'label' => esc_html__( 'Title Position', 'elementor' ),
273 - 'type' => Controls_Manager::CHOOSE,
274 - 'options' => [
275 - 'before' => [
276 - 'title' => esc_html__( 'Before', 'elementor' ),
277 - 'icon' => 'eicon-v-align-top',
278 - ],
279 - 'after' => [
280 - 'title' => esc_html__( 'After', 'elementor' ),
281 - 'icon' => 'eicon-v-align-bottom',
282 - ],
283 - 'start' => [
284 - 'title' => esc_html__( 'Start', 'elementor' ),
285 - 'icon' => 'eicon-h-align-left',
286 - ],
287 - 'end' => [
288 - 'title' => esc_html__( 'End', 'elementor' ),
289 - 'icon' => 'eicon-h-align-right',
290 - ],
291 - ],
292 - 'selectors_dictionary' => [
293 - 'before' => 'flex-direction: column;',
294 - 'after' => 'flex-direction: column-reverse;',
295 - 'start' => 'flex-direction: row;',
296 - 'end' => 'flex-direction: row-reverse;',
297 - ],
298 - 'selectors' => [
299 - '{{WRAPPER}} .elementor-counter' => '{{VALUE}}',
300 - ],
301 - 'classes' => 'elementor-control-start-end',
302 - 'condition' => [
303 - 'title!' => '',
304 - ],
305 - ]
306 - );
307 -
308 - $this->add_responsive_control(
309 - 'title_horizontal_alignment',
310 - [
311 - 'label' => esc_html__( 'Title Horizontal Alignment', 'elementor' ),
312 - 'type' => Controls_Manager::CHOOSE,
313 - 'options' => [
314 - 'start' => [
315 - 'title' => esc_html__( 'Start', 'elementor' ),
316 - 'icon' => 'eicon-h-align-left',
317 - ],
318 - 'center' => [
319 - 'title' => esc_html__( 'Center', 'elementor' ),
320 - 'icon' => 'eicon-h-align-center',
321 - ],
322 - 'end' => [
323 - 'title' => esc_html__( 'End', 'elementor' ),
324 - 'icon' => 'eicon-h-align-right',
325 - ],
326 - ],
327 - 'separator' => 'before',
328 - 'classes' => 'elementor-control-start-end',
329 - 'selectors' => [
330 - '{{WRAPPER}} .elementor-counter-title' => 'justify-content: {{VALUE}};',
331 - ],
332 - 'condition' => [
333 - 'title!' => '',
334 - ],
335 - ]
336 - );
337 -
338 - $this->add_responsive_control(
339 - 'title_vertical_alignment',
340 - [
341 - 'label' => esc_html__( 'Title Vertical Alignment', 'elementor' ),
342 - 'type' => Controls_Manager::CHOOSE,
343 - 'options' => [
344 - 'start' => [
345 - 'title' => esc_html__( 'Top', 'elementor' ),
346 - 'icon' => 'eicon-v-align-top',
347 - ],
348 - 'center' => [
349 - 'title' => esc_html__( 'Middle', 'elementor' ),
350 - 'icon' => 'eicon-v-align-middle',
351 - ],
352 - 'end' => [
353 - 'title' => esc_html__( 'Bottom', 'elementor' ),
354 - 'icon' => 'eicon-v-align-bottom',
355 - ],
356 - ],
357 - 'selectors' => [
358 - '{{WRAPPER}} .elementor-counter-title' => 'align-items: {{VALUE}};',
359 - ],
360 - 'condition' => [
361 - 'title!' => '',
362 - 'title_position' => [ 'start', 'end' ],
363 - ],
364 - ]
365 - );
366 -
367 - $this->add_responsive_control(
368 - 'title_gap',
369 - [
370 - 'label' => esc_html__( 'Title Gap', 'elementor' ),
371 - 'type' => Controls_Manager::SLIDER,
372 - 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
373 - 'selectors' => [
374 - '{{WRAPPER}} .elementor-counter' => 'gap: {{SIZE}}{{UNIT}};',
375 - ],
376 - 'condition' => [
377 - 'title!' => '',
378 - 'title_position' => [ '', 'before', 'after' ],
379 - ],
380 - ]
381 - );
382 -
383 - $this->add_responsive_control(
384 - 'number_position',
385 - [
386 - 'label' => esc_html__( 'Number Position', 'elementor' ),
387 - 'type' => Controls_Manager::CHOOSE,
388 - 'options' => [
389 - 'start' => [
390 - 'title' => esc_html__( 'Start', 'elementor' ),
391 - 'icon' => 'eicon-h-align-left',
392 - ],
393 - 'center' => [
394 - 'title' => esc_html__( 'Center', 'elementor' ),
395 - 'icon' => 'eicon-h-align-center',
396 - ],
397 - 'end' => [
398 - 'title' => esc_html__( 'End', 'elementor' ),
399 - 'icon' => 'eicon-h-align-right',
400 - ],
401 - 'stretch' => [
402 - 'title' => esc_html__( 'Stretch', 'elementor' ),
403 - 'icon' => 'eicon-grow',
404 - ],
405 - ],
406 - 'classes' => 'elementor-control-start-end',
407 - 'selectors_dictionary' => [
408 - 'start' => 'text-align: {{VALUE}}; --counter-prefix-grow: 0; --counter-suffix-grow: 1; --counter-number-grow: 0;',
409 - 'center' => 'text-align: {{VALUE}}; --counter-prefix-grow: 1; --counter-suffix-grow: 1; --counter-number-grow: 0;',
410 - 'end' => 'text-align: {{VALUE}}; --counter-prefix-grow: 1; --counter-suffix-grow: 0; --counter-number-grow: 0;',
411 - 'stretch' => '--counter-prefix-grow: 0; --counter-suffix-grow: 0; --counter-number-grow: 1;',
412 - ],
413 - 'selectors' => [
414 - '{{WRAPPER}} .elementor-counter-number-wrapper' => '{{VALUE}}',
415 - ],
416 - 'separator' => 'before',
417 - ]
418 - );
419 -
420 - $this->add_responsive_control(
421 - 'number_alignment',
422 - [
423 - 'label' => esc_html__( 'Number Alignment', 'elementor' ),
424 - 'type' => Controls_Manager::CHOOSE,
425 - 'options' => [
426 - 'start' => [
427 - 'title' => esc_html__( 'Start', 'elementor' ),
428 - 'icon' => 'eicon-text-align-left',
429 - ],
430 - 'center' => [
431 - 'title' => esc_html__( 'Center', 'elementor' ),
432 - 'icon' => 'eicon-text-align-center',
433 - ],
434 - 'end' => [
435 - 'title' => esc_html__( 'End', 'elementor' ),
436 - 'icon' => 'eicon-text-align-right',
437 - ],
438 - ],
439 - 'classes' => 'elementor-control-start-end',
440 - 'selectors' => [
441 - '{{WRAPPER}} .elementor-counter-number' => 'text-align: {{VALUE}};',
442 - ],
443 - 'condition' => [
444 - 'number_position' => 'stretch',
445 - ],
446 - ]
447 - );
448 -
449 - $this->add_responsive_control(
450 - 'number_gap',
451 - [
452 - 'label' => esc_html__( 'Number Gap', 'elementor' ),
453 - 'type' => Controls_Manager::SLIDER,
454 - 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
455 - 'selectors' => [
456 - '{{WRAPPER}} .elementor-counter-number-wrapper' => 'gap: {{SIZE}}{{UNIT}};',
457 - ],
458 - 'conditions' => [
459 - 'relation' => 'and',
460 - 'terms' => [
461 - [
462 - 'name' => 'number_position',
463 - 'operator' => '!==',
464 - 'value' => 'stretch',
465 - ],
466 - [
467 - 'relation' => 'or',
468 - 'terms' => [
469 - [
470 - 'name' => 'prefix',
471 - 'operator' => '!==',
472 - 'value' => '',
473 - ],
474 - [
475 - 'name' => 'suffix',
476 - 'operator' => '!==',
477 - 'value' => '',
478 - ],
479 - ],
480 - ],
481 - ],
482 - ],
483 - ]
484 - );
485 -
486 - $this->end_controls_section();
487 -
488 - $this->start_controls_section(
489 220 'section_number',
490 221 [
491 - 'label' => esc_html__( 'Number', 'elementor' ),
222 + 'label' => __( 'Number', 'elementor' ),
492 223 'tab' => Controls_Manager::TAB_STYLE,
493 224 ]
494 225 );
495 226
@@ -495,9 +226,9 @@
495 226
496 227 $this->add_control(
497 228 'number_color',
498 229 [
499 - 'label' => esc_html__( 'Text Color', 'elementor' ),
230 + 'label' => __( 'Text Color', 'elementor' ),
500 231 'type' => Controls_Manager::COLOR,
501 232 'global' => [
502 233 'default' => Global_Colors::COLOR_PRIMARY,
503 234 ],
@@ -517,34 +248,15 @@
517 248 'selector' => '{{WRAPPER}} .elementor-counter-number-wrapper',
518 249 ]
519 250 );
520 251
521 - $this->add_group_control(
522 - Group_Control_Text_Stroke::get_type(),
523 - [
524 - 'name' => 'number_stroke',
525 - 'selector' => '{{WRAPPER}} .elementor-counter-number-wrapper',
526 - ]
527 - );
528 -
529 - $this->add_group_control(
530 - Group_Control_Text_Shadow::get_type(),
531 - [
532 - 'name' => 'number_shadow',
533 - 'selector' => '{{WRAPPER}} .elementor-counter-number-wrapper',
534 - ]
535 - );
536 -
537 252 $this->end_controls_section();
538 253
539 254 $this->start_controls_section(
540 255 'section_title',
541 256 [
542 - 'label' => esc_html__( 'Title', 'elementor' ),
257 + 'label' => __( 'Title', 'elementor' ),
543 258 'tab' => Controls_Manager::TAB_STYLE,
544 - 'condition' => [
545 - 'title!' => '',
546 - ],
547 259 ]
548 260 );
549 261
550 262 $this->add_control(
@@ -549,9 +261,9 @@
549 261
550 262 $this->add_control(
551 263 'title_color',
552 264 [
553 - 'label' => esc_html__( 'Text Color', 'elementor' ),
265 + 'label' => __( 'Text Color', 'elementor' ),
554 266 'type' => Controls_Manager::COLOR,
555 267 'global' => [
556 268 'default' => Global_Colors::COLOR_SECONDARY,
557 269 ],
@@ -557,11 +269,8 @@
557 269 ],
558 270 'selectors' => [
559 271 '{{WRAPPER}} .elementor-counter-title' => 'color: {{VALUE}};',
560 272 ],
561 - 'condition' => [
562 - 'title!' => '',
563 - ],
564 273 ]
565 274 );
566 275
567 276 $this->add_group_control(
@@ -571,36 +280,11 @@
571 280 'global' => [
572 281 'default' => Global_Typography::TYPOGRAPHY_SECONDARY,
573 282 ],
574 283 'selector' => '{{WRAPPER}} .elementor-counter-title',
575 - 'condition' => [
576 - 'title!' => '',
577 - ],
578 284 ]
579 285 );
580 286
581 - $this->add_group_control(
582 - Group_Control_Text_Stroke::get_type(),
583 - [
584 - 'name' => 'title_stroke',
585 - 'selector' => '{{WRAPPER}} .elementor-counter-title',
586 - 'condition' => [
587 - 'title!' => '',
588 - ],
589 - ]
590 - );
591 -
592 - $this->add_group_control(
593 - Group_Control_Text_Shadow::get_type(),
594 - [
595 - 'name' => 'title_shadow',
596 - 'selector' => '{{WRAPPER}} .elementor-counter-title',
597 - 'condition' => [
598 - 'title!' => '',
599 - ],
600 - ]
601 - );
602 -
603 287 $this->end_controls_section();
604 288 }
605 289
606 290 /**
@@ -612,47 +296,23 @@
612 296 * @access protected
613 297 */
614 298 protected function content_template() {
615 299 ?>
616 - <#
617 - view.addRenderAttribute( 'elementor-counter', 'class', 'elementor-counter' );
300 + <# view.addRenderAttribute( 'counter-title', {
301 + 'class': 'elementor-counter-title'
302 + } );
618 303
619 - view.addRenderAttribute( 'counter-number', 'class', 'elementor-counter-number-wrapper' );
620 -
621 - view.addRenderAttribute(
622 - 'counter',
623 - {
624 - 'class': 'elementor-counter-number',
625 - 'data-duration': settings.duration,
626 - 'data-to-value': settings.ending_number,
627 - 'data-from-value': settings.starting_number,
628 - }
629 - );
630 -
631 - if ( settings.thousand_separator ) {
632 - const delimiter = settings.thousand_separator_char ? settings.thousand_separator_char : ',';
633 - view.addRenderAttribute( 'counter', 'data-delimiter', delimiter );
634 - }
635 -
636 - view.addRenderAttribute( 'prefix', 'class', 'elementor-counter-number-prefix' );
637 -
638 - view.addRenderAttribute( 'suffix', 'class', 'elementor-counter-number-suffix' );
639 -
640 - view.addRenderAttribute( 'counter-title', 'class', 'elementor-counter-title' );
641 -
642 304 view.addInlineEditingAttributes( 'counter-title' );
643 -
644 - const titleTag = elementor.helpers.validateHTMLTag( settings.title_tag );
645 305 #>
646 - <div {{{ view.getRenderAttributeString( 'elementor-counter' ) }}}>
306 + <div class="elementor-counter">
307 + <div class="elementor-counter-number-wrapper">
308 + <span class="elementor-counter-number-prefix">{{{ settings.prefix }}}</span>
309 + <span class="elementor-counter-number" data-duration="{{ settings.duration }}" data-to-value="{{ settings.ending_number }}" data-delimiter="{{ settings.thousand_separator ? settings.thousand_separator_char || ',' : '' }}">{{{ settings.starting_number }}}</span>
310 + <span class="elementor-counter-number-suffix">{{{ settings.suffix }}}</span>
311 + </div>
647 312 <# if ( settings.title ) {
648 - #><{{ titleTag }} {{{ view.getRenderAttributeString( 'counter-title' ) }}}>{{{ elementor.helpers.sanitize( settings.title, { ALLOW_DATA_ATTR: false } ) }}}</{{ titleTag }}><#
313 + #><div {{{ view.getRenderAttributeString( 'counter-title' ) }}}>{{{ settings.title }}}</div><#
649 314 } #>
650 - <div {{{ view.getRenderAttributeString( 'counter-number' ) }}}>
651 - <span {{{ view.getRenderAttributeString( 'prefix' ) }}}>{{ settings.prefix }}</span>
652 - <span {{{ view.getRenderAttributeString( 'counter' ) }}}>{{ settings.starting_number }}</span>
653 - <span {{{ view.getRenderAttributeString( 'suffix' ) }}}>{{ settings.suffix }}</span>
654 - </div>
655 315 </div>
656 316 <?php
657 317 }
658 318
@@ -666,62 +326,33 @@
666 326 */
667 327 protected function render() {
668 328 $settings = $this->get_settings_for_display();
669 329
670 - $this->add_render_attribute( 'elementor-counter', 'class', 'elementor-counter' );
330 + $this->add_render_attribute( 'counter', [
331 + 'class' => 'elementor-counter-number',
332 + 'data-duration' => $settings['duration'],
333 + 'data-to-value' => $settings['ending_number'],
334 + 'data-from-value' => $settings['starting_number'],
335 + ] );
671 336
672 - $this->add_render_attribute( 'counter-number', 'class', 'elementor-counter-number-wrapper' );
673 -
674 - $this->add_render_attribute(
675 - 'counter',
676 - [
677 - 'class' => 'elementor-counter-number',
678 - 'data-duration' => $settings['duration'],
679 - 'data-to-value' => $settings['ending_number'],
680 - 'data-from-value' => $settings['starting_number'],
681 - ]
682 - );
683 -
684 337 if ( ! empty( $settings['thousand_separator'] ) ) {
685 338 $delimiter = empty( $settings['thousand_separator_char'] ) ? ',' : $settings['thousand_separator_char'];
686 339 $this->add_render_attribute( 'counter', 'data-delimiter', $delimiter );
687 340 }
688 341
689 - $this->add_render_attribute( 'prefix', 'class', 'elementor-counter-number-prefix' );
690 -
691 - $this->add_render_attribute( 'suffix', 'class', 'elementor-counter-number-suffix' );
692 -
693 342 $this->add_render_attribute( 'counter-title', 'class', 'elementor-counter-title' );
694 343
695 344 $this->add_inline_editing_attributes( 'counter-title' );
696 -
697 - $title_tag = Utils::validate_html_tag( $settings['title_tag'] );
698 345 ?>
699 - <div <?php $this->print_render_attribute_string( 'elementor-counter' ); ?>>
700 - <?php
701 - if ( $settings['title'] ) :
702 - ?><<?php Utils::print_validated_html_tag( $title_tag ); ?> <?php $this->print_render_attribute_string( 'counter-title' ); ?>><?php echo wp_kses_post( $this->get_settings_for_display( 'title' ) ); ?></<?php Utils::print_validated_html_tag( $title_tag ); ?>><?php
703 - endif;
704 - ?>
705 - <div <?php $this->print_render_attribute_string( 'counter-number' ); ?>>
706 - <span <?php $this->print_render_attribute_string( 'prefix' ); ?>><?php echo wp_kses_post( $settings['prefix'] ); ?></span>
707 - <span <?php $this->print_render_attribute_string( 'counter' ); ?>><?php echo wp_kses_post( $settings['starting_number'] ); ?></span>
708 - <span <?php $this->print_render_attribute_string( 'suffix' ); ?>><?php echo wp_kses_post( $settings['suffix'] ); ?></span>
346 + <div class="elementor-counter">
347 + <div class="elementor-counter-number-wrapper">
348 + <span class="elementor-counter-number-prefix"><?php echo $settings['prefix']; ?></span>
349 + <span <?php echo $this->get_render_attribute_string( 'counter' ); ?>><?php echo $settings['starting_number']; ?></span>
350 + <span class="elementor-counter-number-suffix"><?php echo $settings['suffix']; ?></span>
709 351 </div>
352 + <?php if ( $settings['title'] ) : ?>
353 + <div <?php echo $this->get_render_attribute_string( 'counter-title' ); ?>><?php echo $settings['title']; ?></div>
354 + <?php endif; ?>
710 355 </div>
711 356 <?php
712 - }
713 -
714 - public function render_markdown(): string {
715 - $settings = $this->get_settings_for_display();
716 - $number = $settings['ending_number'] ?? '';
717 - $prefix = $settings['prefix'] ?? '';
718 - $suffix = $settings['suffix'] ?? '';
719 - $title = Utils::html_to_plain_text( $settings['title'] ?? '' );
720 - $value = $prefix . $number . $suffix;
721 - if ( empty( $value ) && empty( $title ) ) {
722 - return '';
723 - }
724 - $parts = array_filter( [ $value, $title ] );
725 - return implode( ' - ', $parts );
726 357 }
727 358 }