PluginProbe
Elementor Website Builder – more than just a page builder / 3.5.0-dev9
Elementor Website Builder – more than just a page builder v3.5.0-dev9
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/image-carousel.php +65 -375 4.2.0-beta23.5.0-dev9 View file →
@@ -5,9 +5,8 @@
5 5 exit; // Exit if accessed directly.
6 6 }
7 7
8 8 use Elementor\Core\Kits\Documents\Tabs\Global_Colors;
9 -use Elementor\Modules\Promotions\Controls\Promotion_Control;
10 9
11 10 /**
12 11 * Elementor image carousel widget.
13 12 *
@@ -73,66 +72,9 @@
73 72 public function get_keywords() {
74 73 return [ 'image', 'photo', 'visual', 'carousel', 'slider' ];
75 74 }
76 75
77 - protected function is_dynamic_content(): bool {
78 - return false;
79 - }
80 -
81 76 /**
82 - * Get style dependencies.
83 - *
84 - * Retrieve the list of style dependencies the widget requires.
85 - *
86 - * @since 3.24.0
87 - * @access public
88 - *
89 - * @return array Widget style dependencies.
90 - */
91 - public function get_style_depends(): array {
92 - return [ 'e-swiper', 'widget-image-carousel' ];
93 - }
94 -
95 - /**
96 - * Get script dependencies.
97 - *
98 - * Retrieve the list of script dependencies the widget requires.
99 - *
100 - * @since 3.27.0
101 - * @access public
102 - *
103 - * @return array Widget script dependencies.
104 - */
105 - public function get_script_depends(): array {
106 - return [ 'swiper' ];
107 - }
108 -
109 - public function has_widget_inner_wrapper(): bool {
110 - return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
111 - }
112 -
113 - /**
114 - * Get widget upsale data.
115 - *
116 - * Retrieve the widget promotion data.
117 - *
118 - * @since 3.18.0
119 - * @access protected
120 - *
121 - * @return array Widget promotion data.
122 - */
123 - protected function get_upsale_data() {
124 - return [
125 - 'condition' => ! Utils::has_pro(),
126 - 'image' => esc_url( ELEMENTOR_ASSETS_URL . 'images/go-pro.svg' ),
127 - 'image_alt' => esc_attr__( 'Upgrade', 'elementor' ),
128 - 'description' => esc_html__( 'Gain complete freedom to design every slide with Elementor"s Pro Carousel.', 'elementor' ),
129 - 'upgrade_url' => esc_url( 'https://go.elementor.com/go-pro-image-carousel-widget/' ),
130 - 'upgrade_text' => esc_html__( 'Upgrade Now', 'elementor' ),
131 - ];
132 - }
133 -
134 - /**
135 77 * Register image carousel widget controls.
136 78 *
137 79 * Adds different input fields to allow the user to change and customize the widget settings.
138 80 *
@@ -147,17 +89,8 @@
147 89 ]
148 90 );
149 91
150 92 $this->add_control(
151 - 'carousel_name',
152 - [
153 - 'label' => esc_html__( 'Carousel Name', 'elementor' ),
154 - 'type' => Controls_Manager::TEXT,
155 - 'default' => esc_html__( 'Image Carousel', 'elementor' ),
156 - ]
157 - );
158 -
159 - $this->add_control(
160 93 'carousel',
161 94 [
162 95 'label' => esc_html__( 'Add Images', 'elementor' ),
163 96 'type' => Controls_Manager::GALLERY,
@@ -172,8 +105,9 @@
172 105 $this->add_group_control(
173 106 Group_Control_Image_Size::get_type(),
174 107 [
175 108 'name' => 'thumbnail', // Usage: `{name}_size` and `{name}_custom_dimension`, in this case `thumbnail_size` and `thumbnail_custom_dimension`.
109 + 'separator' => 'none',
176 110 ]
177 111 );
178 112
179 113 $slides_to_show = range( 1, 10 );
@@ -187,13 +121,8 @@
187 121 'options' => [
188 122 '' => esc_html__( 'Default', 'elementor' ),
189 123 ] + $slides_to_show,
190 124 'frontend_available' => true,
191 - 'render_type' => 'template',
192 - 'selectors' => [
193 - '{{WRAPPER}}' => '--e-image-carousel-slides-to-show: {{VALUE}}',
194 - ],
195 - 'content_classes' => 'elementor-control-field-select-small',
196 125 ]
197 126 );
198 127
199 128 $this->add_responsive_control(
@@ -208,9 +137,8 @@
208 137 'condition' => [
209 138 'slides_to_show!' => '1',
210 139 ],
211 140 'frontend_available' => true,
212 - 'content_classes' => 'elementor-control-field-select-small',
213 141 ]
214 142 );
215 143
216 144 $this->add_control(
@@ -242,118 +170,8 @@
242 170 ]
243 171 );
244 172
245 173 $this->add_control(
246 - 'navigation_previous_icon',
247 - [
248 - 'label' => esc_html__( 'Previous Arrow Icon', 'elementor' ),
249 - 'type' => Controls_Manager::ICONS,
250 - 'fa4compatibility' => 'icon',
251 - 'skin' => 'inline',
252 - 'label_block' => false,
253 - 'skin_settings' => [
254 - 'inline' => [
255 - 'none' => [
256 - 'label' => 'Default',
257 - 'icon' => 'eicon-chevron-left',
258 - ],
259 - 'icon' => [
260 - 'icon' => 'eicon-star',
261 - ],
262 - ],
263 - ],
264 - 'recommended' => [
265 - 'fa-regular' => [
266 - 'arrow-alt-circle-left',
267 - 'caret-square-left',
268 - ],
269 - 'fa-solid' => [
270 - 'angle-double-left',
271 - 'angle-left',
272 - 'arrow-alt-circle-left',
273 - 'arrow-circle-left',
274 - 'arrow-left',
275 - 'caret-left',
276 - 'caret-square-left',
277 - 'chevron-circle-left',
278 - 'chevron-left',
279 - 'long-arrow-alt-left',
280 - ],
281 - ],
282 - 'conditions' => [
283 - 'relation' => 'or',
284 - 'terms' => [
285 - [
286 - 'name' => 'navigation',
287 - 'operator' => '=',
288 - 'value' => 'both',
289 - ],
290 - [
291 - 'name' => 'navigation',
292 - 'operator' => '=',
293 - 'value' => 'arrows',
294 - ],
295 - ],
296 - ],
297 - ]
298 - );
299 -
300 - $this->add_control(
301 - 'navigation_next_icon',
302 - [
303 - 'label' => esc_html__( 'Next Arrow Icon', 'elementor' ),
304 - 'type' => Controls_Manager::ICONS,
305 - 'fa4compatibility' => 'icon',
306 - 'skin' => 'inline',
307 - 'label_block' => false,
308 - 'skin_settings' => [
309 - 'inline' => [
310 - 'none' => [
311 - 'label' => 'Default',
312 - 'icon' => 'eicon-chevron-right',
313 - ],
314 - 'icon' => [
315 - 'icon' => 'eicon-star',
316 - ],
317 - ],
318 - ],
319 - 'recommended' => [
320 - 'fa-regular' => [
321 - 'arrow-alt-circle-right',
322 - 'caret-square-right',
323 - ],
324 - 'fa-solid' => [
325 - 'angle-double-right',
326 - 'angle-right',
327 - 'arrow-alt-circle-right',
328 - 'arrow-circle-right',
329 - 'arrow-right',
330 - 'caret-right',
331 - 'caret-square-right',
332 - 'chevron-circle-right',
333 - 'chevron-right',
334 - 'long-arrow-alt-right',
335 - ],
336 - ],
337 - 'conditions' => [
338 - 'relation' => 'or',
339 - 'terms' => [
340 - [
341 - 'name' => 'navigation',
342 - 'operator' => '=',
343 - 'value' => 'both',
344 - ],
345 - [
346 - 'name' => 'navigation',
347 - 'operator' => '=',
348 - 'value' => 'arrows',
349 - ],
350 - ],
351 - ],
352 - ]
353 - );
354 -
355 - $this->add_control(
356 174 'link_to',
357 175 [
358 176 'label' => esc_html__( 'Link', 'elementor' ),
359 177 'type' => Controls_Manager::SELECT,
@@ -370,15 +188,13 @@
370 188 'link',
371 189 [
372 190 'label' => esc_html__( 'Link', 'elementor' ),
373 191 'type' => Controls_Manager::URL,
192 + 'placeholder' => esc_html__( 'https://your-link.com', 'elementor' ),
374 193 'condition' => [
375 194 'link_to' => 'custom',
376 195 ],
377 196 'show_label' => false,
378 - 'dynamic' => [
379 - 'active' => true,
380 - ],
381 197 ]
382 198 );
383 199
384 200 $this->add_control(
@@ -385,14 +201,8 @@
385 201 'open_lightbox',
386 202 [
387 203 'label' => esc_html__( 'Lightbox', 'elementor' ),
388 204 'type' => Controls_Manager::SELECT,
389 - 'description' => sprintf(
390 - /* translators: 1: Link open tag, 2: Link close tag. */
391 - esc_html__( 'Manage your site’s lightbox settings in the %1$sLightbox panel%2$s.', 'elementor' ),
392 - '<a href="javascript: $e.run( \'panel/global/open\' ).then( () => $e.route( \'panel/global/settings-lightbox\' ) )">',
393 - '</a>'
394 - ),
395 205 'default' => 'default',
396 206 'options' => [
397 207 'default' => esc_html__( 'Default', 'elementor' ),
398 208 'yes' => esc_html__( 'Yes', 'elementor' ),
@@ -418,8 +228,17 @@
418 228 ],
419 229 ]
420 230 );
421 231
232 + $this->add_control(
233 + 'view',
234 + [
235 + 'label' => esc_html__( 'View', 'elementor' ),
236 + 'type' => Controls_Manager::HIDDEN,
237 + 'default' => 'traditional',
238 + ]
239 + );
240 +
422 241 $this->end_controls_section();
423 242
424 243 $this->start_controls_section(
425 244 'section_additional_options',
@@ -428,25 +247,17 @@
428 247 ]
429 248 );
430 249
431 250 $this->add_control(
432 - 'lazyload',
433 - [
434 - 'label' => esc_html__( 'Lazyload', 'elementor' ),
435 - 'type' => Controls_Manager::SWITCHER,
436 - 'frontend_available' => true,
437 - ]
438 - );
439 -
440 - $this->add_control(
441 251 'autoplay',
442 252 [
443 253 'label' => esc_html__( 'Autoplay', 'elementor' ),
444 - 'type' => Controls_Manager::SWITCHER,
445 - 'label_on' => esc_html__( 'Yes', 'elementor' ),
446 - 'label_off' => esc_html__( 'No', 'elementor' ),
447 - 'return_value' => 'yes',
254 + 'type' => Controls_Manager::SELECT,
448 255 'default' => 'yes',
256 + 'options' => [
257 + 'yes' => esc_html__( 'Yes', 'elementor' ),
258 + 'no' => esc_html__( 'No', 'elementor' ),
259 + ],
449 260 'frontend_available' => true,
450 261 ]
451 262 );
452 263
@@ -453,13 +264,14 @@
453 264 $this->add_control(
454 265 'pause_on_hover',
455 266 [
456 267 'label' => esc_html__( 'Pause on Hover', 'elementor' ),
457 - 'type' => Controls_Manager::SWITCHER,
458 - 'label_on' => esc_html__( 'Yes', 'elementor' ),
459 - 'label_off' => esc_html__( 'No', 'elementor' ),
460 - 'return_value' => 'yes',
268 + 'type' => Controls_Manager::SELECT,
461 269 'default' => 'yes',
270 + 'options' => [
271 + 'yes' => esc_html__( 'Yes', 'elementor' ),
272 + 'no' => esc_html__( 'No', 'elementor' ),
273 + ],
462 274 'condition' => [
463 275 'autoplay' => 'yes',
464 276 ],
465 277 'render_type' => 'none',
@@ -470,13 +282,14 @@
470 282 $this->add_control(
471 283 'pause_on_interaction',
472 284 [
473 285 'label' => esc_html__( 'Pause on Interaction', 'elementor' ),
474 - 'type' => Controls_Manager::SWITCHER,
475 - 'label_on' => esc_html__( 'Yes', 'elementor' ),
476 - 'label_off' => esc_html__( 'No', 'elementor' ),
477 - 'return_value' => 'yes',
286 + 'type' => Controls_Manager::SELECT,
478 287 'default' => 'yes',
288 + 'options' => [
289 + 'yes' => esc_html__( 'Yes', 'elementor' ),
290 + 'no' => esc_html__( 'No', 'elementor' ),
291 + ],
479 292 'condition' => [
480 293 'autoplay' => 'yes',
481 294 ],
482 295 'frontend_available' => true,
@@ -501,13 +314,14 @@
501 314 $this->add_control(
502 315 'infinite',
503 316 [
504 317 'label' => esc_html__( 'Infinite Loop', 'elementor' ),
505 - 'type' => Controls_Manager::SWITCHER,
506 - 'label_on' => esc_html__( 'Yes', 'elementor' ),
507 - 'label_off' => esc_html__( 'No', 'elementor' ),
508 - 'return_value' => 'yes',
318 + 'type' => Controls_Manager::SELECT,
509 319 'default' => 'yes',
320 + 'options' => [
321 + 'yes' => esc_html__( 'Yes', 'elementor' ),
322 + 'no' => esc_html__( 'No', 'elementor' ),
323 + ],
510 324 'frontend_available' => true,
511 325 ]
512 326 );
513 327
@@ -593,17 +407,17 @@
593 407 ],
594 408 ]
595 409 );
596 410
597 - $this->add_responsive_control(
411 + $this->add_control(
598 412 'arrows_size',
599 413 [
600 414 'label' => esc_html__( 'Size', 'elementor' ),
601 415 'type' => Controls_Manager::SLIDER,
602 - 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
603 416 'range' => [
604 417 'px' => [
605 - 'max' => 100,
418 + 'min' => 20,
419 + 'max' => 60,
606 420 ],
607 421 ],
608 422 'selectors' => [
609 423 '{{WRAPPER}} .elementor-swiper-button.elementor-swiper-button-prev, {{WRAPPER}} .elementor-swiper-button.elementor-swiper-button-next' => 'font-size: {{SIZE}}{{UNIT}};',
@@ -620,9 +434,8 @@
620 434 'label' => esc_html__( 'Color', 'elementor' ),
621 435 'type' => Controls_Manager::COLOR,
622 436 'selectors' => [
623 437 '{{WRAPPER}} .elementor-swiper-button.elementor-swiper-button-prev, {{WRAPPER}} .elementor-swiper-button.elementor-swiper-button-next' => 'color: {{VALUE}};',
624 - '{{WRAPPER}} .elementor-swiper-button.elementor-swiper-button-prev svg, {{WRAPPER}} .elementor-swiper-button.elementor-swiper-button-next svg' => 'fill: {{VALUE}};',
625 438 ],
626 439 'condition' => [
627 440 'navigation' => [ 'arrows', 'both' ],
628 441 ],
@@ -631,9 +444,9 @@
631 444
632 445 $this->add_control(
633 446 'heading_style_dots',
634 447 [
635 - 'label' => esc_html__( 'Pagination', 'elementor' ),
448 + 'label' => esc_html__( 'Dots', 'elementor' ),
636 449 'type' => Controls_Manager::HEADING,
637 450 'separator' => 'before',
638 451 'condition' => [
639 452 'navigation' => [ 'dots', 'both' ],
@@ -657,37 +470,17 @@
657 470 ],
658 471 ]
659 472 );
660 473
661 - $this->add_responsive_control(
662 - 'dots_gap',
663 - [
664 - 'label' => esc_html__( 'Space Between Dots', 'elementor' ),
665 - 'type' => Controls_Manager::SLIDER,
666 - 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
667 - 'range' => [
668 - 'px' => [
669 - 'max' => 20,
670 - ],
671 - ],
672 - 'selectors' => [
673 - '{{WRAPPER}} .swiper-pagination-bullet' => '--swiper-pagination-bullet-horizontal-gap: {{SIZE}}{{UNIT}}; --swiper-pagination-bullet-vertical-gap: {{SIZE}}{{UNIT}};',
674 - ],
675 - 'condition' => [
676 - 'navigation' => [ 'dots', 'both' ],
677 - ],
678 - ]
679 - );
680 -
681 - $this->add_responsive_control(
474 + $this->add_control(
682 475 'dots_size',
683 476 [
684 477 'label' => esc_html__( 'Size', 'elementor' ),
685 478 'type' => Controls_Manager::SLIDER,
686 - 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
687 479 'range' => [
688 480 'px' => [
689 - 'max' => 20,
481 + 'min' => 5,
482 + 'max' => 10,
690 483 ],
691 484 ],
692 485 'selectors' => [
693 486 '{{WRAPPER}} .swiper-pagination-bullet' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
@@ -698,28 +491,13 @@
698 491 ]
699 492 );
700 493
701 494 $this->add_control(
702 - 'dots_inactive_color',
495 + 'dots_color',
703 496 [
704 497 'label' => esc_html__( 'Color', 'elementor' ),
705 498 'type' => Controls_Manager::COLOR,
706 499 'selectors' => [
707 - // The opacity property will override the default inactive dot color which is opacity 0.2.
708 - '{{WRAPPER}} .swiper-pagination-bullet:not(.swiper-pagination-bullet-active)' => 'background: {{VALUE}}; opacity: 1',
709 - ],
710 - 'condition' => [
711 - 'navigation' => [ 'dots', 'both' ],
712 - ],
713 - ]
714 - );
715 -
716 - $this->add_control(
717 - 'dots_color',
718 - [
719 - 'label' => esc_html__( 'Active Color', 'elementor' ),
720 - 'type' => Controls_Manager::COLOR,
721 - 'selectors' => [
722 500 '{{WRAPPER}} .swiper-pagination-bullet' => 'background: {{VALUE}};',
723 501 ],
724 502 'condition' => [
725 503 'navigation' => [ 'dots', 'both' ],
@@ -780,14 +558,13 @@
780 558 ],
781 559 ]
782 560 );
783 561
784 - $this->add_responsive_control(
562 + $this->add_control(
785 563 'image_spacing_custom',
786 564 [
787 565 'label' => esc_html__( 'Image Spacing', 'elementor' ),
788 566 'type' => Controls_Manager::SLIDER,
789 - 'size_units' => [ 'px' ],
790 567 'range' => [
791 568 'px' => [
792 569 'max' => 100,
793 570 ],
@@ -794,8 +571,9 @@
794 571 ],
795 572 'default' => [
796 573 'size' => 20,
797 574 ],
575 + 'show_label' => false,
798 576 'condition' => [
799 577 'image_spacing' => 'custom',
800 578 'slides_to_show!' => '1',
801 579 ],
@@ -812,14 +590,14 @@
812 590 'selector' => '{{WRAPPER}} .elementor-image-carousel-wrapper .elementor-image-carousel .swiper-slide-image',
813 591 ]
814 592 );
815 593
816 - $this->add_responsive_control(
594 + $this->add_control(
817 595 'image_border_radius',
818 596 [
819 597 'label' => esc_html__( 'Border Radius', 'elementor' ),
820 598 'type' => Controls_Manager::DIMENSIONS,
821 - 'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
599 + 'size_units' => [ 'px', '%' ],
822 600 'selectors' => [
823 601 '{{WRAPPER}} .elementor-image-carousel-wrapper .elementor-image-carousel .swiper-slide-image' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
824 602 ],
825 603 ]
@@ -837,16 +615,16 @@
837 615 ],
838 616 ]
839 617 );
840 618
841 - $this->add_responsive_control(
619 + $this->add_control(
842 620 'caption_align',
843 621 [
844 622 'label' => esc_html__( 'Alignment', 'elementor' ),
845 623 'type' => Controls_Manager::CHOOSE,
846 624 'options' => [
847 - 'start' => [
848 - 'title' => esc_html__( 'Start', 'elementor' ),
625 + 'left' => [
626 + 'title' => esc_html__( 'Left', 'elementor' ),
849 627 'icon' => 'eicon-text-align-left',
850 628 ],
851 629 'center' => [
852 630 'title' => esc_html__( 'Center', 'elementor' ),
@@ -851,10 +629,10 @@
851 629 'center' => [
852 630 'title' => esc_html__( 'Center', 'elementor' ),
853 631 'icon' => 'eicon-text-align-center',
854 632 ],
855 - 'end' => [
856 - 'title' => esc_html__( 'End', 'elementor' ),
633 + 'right' => [
634 + 'title' => esc_html__( 'Right', 'elementor' ),
857 635 'icon' => 'eicon-text-align-right',
858 636 ],
859 637 'justify' => [
860 638 'title' => esc_html__( 'Justified', 'elementor' ),
@@ -860,13 +638,8 @@
860 638 'title' => esc_html__( 'Justified', 'elementor' ),
861 639 'icon' => 'eicon-text-align-justify',
862 640 ],
863 641 ],
864 - 'classes' => 'elementor-control-start-end',
865 - 'selectors_dictionary' => [
866 - 'left' => is_rtl() ? 'end' : 'start',
867 - 'right' => is_rtl() ? 'start' : 'end',
868 - ],
869 642 'default' => 'center',
870 643 'selectors' => [
871 644 '{{WRAPPER}} .elementor-image-carousel-caption' => 'text-align: {{VALUE}};',
872 645 ],
@@ -903,21 +676,10 @@
903 676 'selector' => '{{WRAPPER}} .elementor-image-carousel-caption',
904 677 ]
905 678 );
906 679
907 - $this->add_responsive_control(
908 - 'caption_space',
909 - [
910 - 'label' => esc_html__( 'Spacing', 'elementor' ),
911 - 'type' => Controls_Manager::SLIDER,
912 - 'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
913 - 'selectors' => [
914 - '{{WRAPPER}} .elementor-image-carousel-caption' => 'margin-block-start: {{SIZE}}{{UNIT}};',
915 - ],
916 - ]
917 - );
680 + $this->end_controls_section();
918 681
919 - $this->end_controls_section();
920 682 }
921 683
922 684 /**
923 685 * Render image carousel widget output on the frontend.
@@ -929,10 +691,8 @@
929 691 */
930 692 protected function render() {
931 693 $settings = $this->get_settings_for_display();
932 694
933 - $lazyload = 'yes' === $settings['lazyload'];
934 -
935 695 if ( empty( $settings['carousel'] ) ) {
936 696 return;
937 697 }
938 698
@@ -944,13 +704,9 @@
944 704 if ( ! $image_url && isset( $attachment['url'] ) ) {
945 705 $image_url = $attachment['url'];
946 706 }
947 707
948 - if ( $lazyload ) {
949 - $image_html = '<img class="swiper-slide-image swiper-lazy" data-src="' . esc_attr( $image_url ) . '" alt="' . esc_attr( Control_Media::get_image_alt( $attachment ) ) . '" />';
950 - } else {
951 - $image_html = '<img class="swiper-slide-image" src="' . esc_attr( $image_url ) . '" alt="' . esc_attr( Control_Media::get_image_alt( $attachment ) ) . '" />';
952 - }
708 + $image_html = '<img class="swiper-slide-image" src="' . esc_attr( $image_url ) . '" alt="' . esc_attr( Control_Media::get_image_alt( $attachment ) ) . '" />';
953 709
954 710 $link_tag = '';
955 711
956 712 $link = $this->get_link_url( $attachment, $settings );
@@ -972,31 +728,12 @@
972 728 }
973 729
974 730 $image_caption = $this->get_image_caption( $attachment );
975 731
976 - $slide_count = $index + 1;
977 - $slide_setting_key = 'swiper_slide_' . $index;
732 + $slide_html = '<div class="swiper-slide">' . $link_tag . '<figure class="swiper-slide-inner">' . $image_html;
978 733
979 - $this->add_render_attribute( $slide_setting_key, [
980 - 'class' => 'swiper-slide',
981 - 'role' => 'group',
982 - 'aria-roledescription' => 'slide',
983 - 'aria-label' => sprintf(
984 - /* translators: 1: Slide count, 2: Total slides count. */
985 - esc_html__( '%1$s of %2$s', 'elementor' ),
986 - $slide_count,
987 - count( $settings['carousel'] )
988 - ),
989 - ] );
990 -
991 - $slide_html = '<div ' . $this->get_render_attribute_string( $slide_setting_key ) . '>' . $link_tag . '<figure class="swiper-slide-inner">' . $image_html;
992 -
993 - if ( $lazyload ) {
994 - $slide_html .= '<div class="swiper-lazy-preloader"></div>';
995 - }
996 -
997 734 if ( ! empty( $image_caption ) ) {
998 - $slide_html .= '<figcaption class="elementor-image-carousel-caption">' . wp_kses_post( $image_caption ) . '</figcaption>';
735 + $slide_html .= '<figcaption class="elementor-image-carousel-caption">' . esc_html( $image_caption ) . '</figcaption>';
999 736 }
1000 737
1001 738 $slide_html .= '</figure>';
1002 739
@@ -1013,21 +750,14 @@
1013 750 if ( empty( $slides ) ) {
1014 751 return;
1015 752 }
1016 753
1017 - $swiper_class = 'swiper';
1018 - $has_autoplay_enabled = 'yes' === $this->get_settings_for_display( 'autoplay' );
1019 -
1020 754 $this->add_render_attribute( [
1021 755 'carousel' => [
1022 756 'class' => 'elementor-image-carousel swiper-wrapper',
1023 - 'aria-live' => $has_autoplay_enabled ? 'off' : 'polite',
1024 757 ],
1025 758 'carousel-wrapper' => [
1026 - 'class' => 'elementor-image-carousel-wrapper ' . $swiper_class,
1027 - 'role' => 'region',
1028 - 'aria-roledescription' => 'carousel',
1029 - 'aria-label' => $settings['carousel_name'],
759 + 'class' => 'elementor-image-carousel-wrapper swiper-container',
1030 760 'dir' => $settings['direction'],
1031 761 ],
1032 762 ] );
1033 763
@@ -1038,27 +768,29 @@
1038 768 $this->add_render_attribute( 'carousel', 'class', 'swiper-image-stretch' );
1039 769 }
1040 770
1041 771 $slides_count = count( $settings['carousel'] );
772 +
1042 773 ?>
1043 774 <div <?php $this->print_render_attribute_string( 'carousel-wrapper' ); ?>>
1044 775 <div <?php $this->print_render_attribute_string( 'carousel' ); ?>>
1045 - <?php // PHPCS - $slides contains the slides content, all the relevant content is escaped above. ?>
776 + <?php // PHPCS - $slides contains the slides content, all the relevent content is escaped above. ?>
1046 777 <?php echo implode( '', $slides ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
1047 778 </div>
1048 779 <?php if ( 1 < $slides_count ) : ?>
780 + <?php if ( $show_dots ) : ?>
781 + <div class="swiper-pagination"></div>
782 + <?php endif; ?>
1049 783 <?php if ( $show_arrows ) : ?>
1050 - <div class="elementor-swiper-button elementor-swiper-button-prev" role="button" tabindex="0">
1051 - <?php $this->render_swiper_button( 'previous' ); ?>
784 + <div class="elementor-swiper-button elementor-swiper-button-prev">
785 + <i class="eicon-chevron-left" aria-hidden="true"></i>
786 + <span class="elementor-screen-only"><?php echo esc_html__( 'Previous', 'elementor' ); ?></span>
1052 787 </div>
1053 - <div class="elementor-swiper-button elementor-swiper-button-next" role="button" tabindex="0">
1054 - <?php $this->render_swiper_button( 'next' ); ?>
788 + <div class="elementor-swiper-button elementor-swiper-button-next">
789 + <i class="eicon-chevron-right" aria-hidden="true"></i>
790 + <span class="elementor-screen-only"><?php echo esc_html__( 'Next', 'elementor' ); ?></span>
1055 791 </div>
1056 792 <?php endif; ?>
1057 -
1058 - <?php if ( $show_dots ) : ?>
1059 - <div class="swiper-pagination"></div>
1060 - <?php endif; ?>
1061 793 <?php endif; ?>
1062 794 </div>
1063 795 <?php
1064 796 }
@@ -1068,9 +800,9 @@
1068 800 *
1069 801 * @since 1.0.0
1070 802 * @access private
1071 803 *
1072 - * @param array $attachment
804 + * @param array $attachment
1073 805 * @param object $instance
1074 806 *
1075 807 * @return array|string|false An array/string containing the attachment URL, or false if no link.
1076 808 */
@@ -1110,12 +842,8 @@
1110 842 }
1111 843
1112 844 $attachment_post = get_post( $attachment['id'] );
1113 845
1114 - if ( Utils::has_invalid_post_permissions( $attachment_post ) ) {
1115 - return '';
1116 - }
1117 -
1118 846 if ( 'caption' === $caption_type ) {
1119 847 return $attachment_post->post_excerpt;
1120 848 }
1121 849
@@ -1122,45 +850,7 @@
1122 850 if ( 'title' === $caption_type ) {
1123 851 return $attachment_post->post_title;
1124 852 }
1125 853
1126 - if ( empty( $attachment_post->post_content ) ) {
1127 - return '';
1128 - }
1129 -
1130 854 return $attachment_post->post_content;
1131 - }
1132 -
1133 - private function render_swiper_button( $type ) {
1134 - $direction = 'next' === $type ? 'right' : 'left';
1135 - $icon_settings = $this->get_settings_for_display( 'navigation_' . $type . '_icon' );
1136 -
1137 - if ( empty( $icon_settings['value'] ) ) {
1138 - $icon_settings = [
1139 - 'library' => 'eicons',
1140 - 'value' => 'eicon-chevron-' . $direction,
1141 - ];
1142 - }
1143 -
1144 - Icons_Manager::render_icon( $icon_settings, [ 'aria-hidden' => 'true' ] );
1145 - }
1146 -
1147 - public function render_markdown(): string {
1148 - $settings = $this->get_settings_for_display();
1149 - if ( empty( $settings['carousel'] ) ) {
1150 - return '';
1151 - }
1152 - $images = [];
1153 - foreach ( $settings['carousel'] as $item ) {
1154 - $url = $item['url'] ?? '';
1155 - if ( empty( $url ) ) {
1156 - continue;
1157 - }
1158 - $alt = '';
1159 - if ( ! empty( $item['id'] ) ) {
1160 - $alt = get_post_meta( $item['id'], '_wp_attachment_image_alt', true );
1161 - }
1162 - $images[] = '![' . $alt . '](' . esc_url( $url ) . ')';
1163 - }
1164 - return implode( "\n\n", $images );
1165 855 }
1166 856 }