PluginProbe
Elementor Website Builder – more than just a page builder / 3.2.3
Elementor Website Builder – more than just a page builder v3.2.3
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.php +124 -231 4.2.23.2.3 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__( 'Image', 'elementor' );
45 + return __( 'Image', 'elementor' );
46 46 }
47 47
48 48 /**
49 49 * Get widget icon.
@@ -88,31 +88,9 @@
88 88 public function get_keywords() {
89 89 return [ 'image', 'photo', 'visual' ];
90 90 }
91 91
92 - protected function is_dynamic_content(): bool {
93 - return false;
94 - }
95 -
96 92 /**
97 - * Get style dependencies.
98 - *
99 - * Retrieve the list of style dependencies the widget requires.
100 - *
101 - * @since 3.24.0
102 - * @access public
103 - *
104 - * @return array Widget style dependencies.
105 - */
106 - public function get_style_depends(): array {
107 - return [ 'widget-image' ];
108 - }
109 -
110 - public function has_widget_inner_wrapper(): bool {
111 - return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
112 - }
113 -
114 - /**
115 93 * Register image widget controls.
116 94 *
117 95 * Adds different input fields to allow the user to change and customize the widget settings.
118 96 *
@@ -122,9 +100,9 @@
122 100 protected function register_controls() {
123 101 $this->start_controls_section(
124 102 'section_image',
125 103 [
126 - 'label' => esc_html__( 'Image', 'elementor' ),
104 + 'label' => __( 'Image', 'elementor' ),
127 105 ]
128 106 );
129 107
130 108 $this->add_control(
@@ -129,9 +107,9 @@
129 107
130 108 $this->add_control(
131 109 'image',
132 110 [
133 - 'label' => esc_html__( 'Choose Image', 'elementor' ),
111 + 'label' => __( 'Choose Image', 'elementor' ),
134 112 'type' => Controls_Manager::MEDIA,
135 113 'dynamic' => [
136 114 'active' => true,
137 115 ],
@@ -145,11 +123,34 @@
145 123 Group_Control_Image_Size::get_type(),
146 124 [
147 125 'name' => 'image', // Usage: `{name}_size` and `{name}_custom_dimension`, in this case `image_size` and `image_custom_dimension`.
148 126 'default' => 'large',
149 - 'condition' => [
150 - 'image[url]!' => '',
127 + 'separator' => 'none',
128 + ]
129 + );
130 +
131 + $this->add_responsive_control(
132 + 'align',
133 + [
134 + 'label' => __( 'Alignment', 'elementor' ),
135 + 'type' => Controls_Manager::CHOOSE,
136 + 'options' => [
137 + 'left' => [
138 + 'title' => __( 'Left', 'elementor' ),
139 + 'icon' => 'eicon-text-align-left',
140 + ],
141 + 'center' => [
142 + 'title' => __( 'Center', 'elementor' ),
143 + 'icon' => 'eicon-text-align-center',
144 + ],
145 + 'right' => [
146 + 'title' => __( 'Right', 'elementor' ),
147 + 'icon' => 'eicon-text-align-right',
148 + ],
151 149 ],
150 + 'selectors' => [
151 + '{{WRAPPER}}' => 'text-align: {{VALUE}};',
152 + ],
152 153 ]
153 154 );
154 155
155 156 $this->add_control(
@@ -154,19 +155,16 @@
154 155
155 156 $this->add_control(
156 157 'caption_source',
157 158 [
158 - 'label' => esc_html__( 'Caption', 'elementor' ),
159 + 'label' => __( 'Caption', 'elementor' ),
159 160 'type' => Controls_Manager::SELECT,
160 161 'options' => [
161 - 'none' => esc_html__( 'None', 'elementor' ),
162 - 'attachment' => esc_html__( 'Attachment Caption', 'elementor' ),
163 - 'custom' => esc_html__( 'Custom Caption', 'elementor' ),
162 + 'none' => __( 'None', 'elementor' ),
163 + 'attachment' => __( 'Attachment Caption', 'elementor' ),
164 + 'custom' => __( 'Custom Caption', 'elementor' ),
164 165 ],
165 166 'default' => 'none',
166 - 'condition' => [
167 - 'image[url]!' => '',
168 - ],
169 167 ]
170 168 );
171 169
172 170 $this->add_control(
@@ -171,14 +169,13 @@
171 169
172 170 $this->add_control(
173 171 'caption',
174 172 [
175 - 'label' => esc_html__( 'Custom Caption', 'elementor' ),
173 + 'label' => __( 'Custom Caption', 'elementor' ),
176 174 'type' => Controls_Manager::TEXT,
177 175 'default' => '',
178 - 'placeholder' => esc_html__( 'Enter your image caption', 'elementor' ),
176 + 'placeholder' => __( 'Enter your image caption', 'elementor' ),
179 177 'condition' => [
180 - 'image[url]!' => '',
181 178 'caption_source' => 'custom',
182 179 ],
183 180 'dynamic' => [
184 181 'active' => true,
@@ -188,19 +185,16 @@
188 185
189 186 $this->add_control(
190 187 'link_to',
191 188 [
192 - 'label' => esc_html__( 'Link', 'elementor' ),
189 + 'label' => __( 'Link', 'elementor' ),
193 190 'type' => Controls_Manager::SELECT,
194 191 'default' => 'none',
195 192 'options' => [
196 - 'none' => esc_html__( 'None', 'elementor' ),
197 - 'file' => esc_html__( 'Media File', 'elementor' ),
198 - 'custom' => esc_html__( 'Custom URL', 'elementor' ),
193 + 'none' => __( 'None', 'elementor' ),
194 + 'file' => __( 'Media File', 'elementor' ),
195 + 'custom' => __( 'Custom URL', 'elementor' ),
199 196 ],
200 - 'condition' => [
201 - 'image[url]!' => '',
202 - ],
203 197 ]
204 198 );
205 199
206 200 $this->add_control(
@@ -205,15 +199,15 @@
205 199
206 200 $this->add_control(
207 201 'link',
208 202 [
209 - 'label' => esc_html__( 'Link', 'elementor' ),
203 + 'label' => __( 'Link', 'elementor' ),
210 204 'type' => Controls_Manager::URL,
211 205 'dynamic' => [
212 206 'active' => true,
213 207 ],
208 + 'placeholder' => __( 'https://your-link.com', 'elementor' ),
214 209 'condition' => [
215 - 'image[url]!' => '',
216 210 'link_to' => 'custom',
217 211 ],
218 212 'show_label' => false,
219 213 ]
@@ -221,73 +215,45 @@
221 215
222 216 $this->add_control(
223 217 'open_lightbox',
224 218 [
225 - 'label' => esc_html__( 'Lightbox', 'elementor' ),
219 + 'label' => __( 'Lightbox', 'elementor' ),
226 220 'type' => Controls_Manager::SELECT,
227 - 'description' => sprintf(
228 - /* translators: 1: Link open tag, 2: Link close tag. */
229 - esc_html__( 'Manage your site’s lightbox settings in the %1$sLightbox panel%2$s.', 'elementor' ),
230 - '<a href="javascript: $e.run( \'panel/global/open\' ).then( () => $e.route( \'panel/global/settings-lightbox\' ) )">',
231 - '</a>'
232 - ),
233 221 'default' => 'default',
234 222 'options' => [
235 - 'default' => esc_html__( 'Default', 'elementor' ),
236 - 'yes' => esc_html__( 'Yes', 'elementor' ),
237 - 'no' => esc_html__( 'No', 'elementor' ),
223 + 'default' => __( 'Default', 'elementor' ),
224 + 'yes' => __( 'Yes', 'elementor' ),
225 + 'no' => __( 'No', 'elementor' ),
238 226 ],
239 227 'condition' => [
240 - 'image[url]!' => '',
241 228 'link_to' => 'file',
242 229 ],
243 230 ]
244 231 );
245 232
233 + $this->add_control(
234 + 'view',
235 + [
236 + 'label' => __( 'View', 'elementor' ),
237 + 'type' => Controls_Manager::HIDDEN,
238 + 'default' => 'traditional',
239 + ]
240 + );
241 +
246 242 $this->end_controls_section();
247 243
248 244 $this->start_controls_section(
249 245 'section_style_image',
250 246 [
251 - 'label' => esc_html__( 'Image', 'elementor' ),
247 + 'label' => __( 'Image', 'elementor' ),
252 248 'tab' => Controls_Manager::TAB_STYLE,
253 249 ]
254 250 );
255 251
256 252 $this->add_responsive_control(
257 - 'align',
258 - [
259 - 'label' => esc_html__( 'Alignment', 'elementor' ),
260 - 'type' => Controls_Manager::CHOOSE,
261 - 'options' => [
262 - 'start' => [
263 - 'title' => esc_html__( 'Start', 'elementor' ),
264 - 'icon' => 'eicon-text-align-left',
265 - ],
266 - 'center' => [
267 - 'title' => esc_html__( 'Center', 'elementor' ),
268 - 'icon' => 'eicon-text-align-center',
269 - ],
270 - 'end' => [
271 - 'title' => esc_html__( 'End', 'elementor' ),
272 - 'icon' => 'eicon-text-align-right',
273 - ],
274 - ],
275 - 'classes' => 'elementor-control-start-end',
276 - 'selectors_dictionary' => [
277 - 'left' => is_rtl() ? 'end' : 'start',
278 - 'right' => is_rtl() ? 'start' : 'end',
279 - ],
280 - 'selectors' => [
281 - '{{WRAPPER}}' => 'text-align: {{VALUE}};',
282 - ],
283 - ]
284 - );
285 -
286 - $this->add_responsive_control(
287 253 'width',
288 254 [
289 - 'label' => esc_html__( 'Width', 'elementor' ),
255 + 'label' => __( 'Width', 'elementor' ),
290 256 'type' => Controls_Manager::SLIDER,
291 257 'default' => [
292 258 'unit' => '%',
293 259 ],
@@ -296,9 +262,9 @@
296 262 ],
297 263 'mobile_default' => [
298 264 'unit' => '%',
299 265 ],
300 - 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
266 + 'size_units' => [ '%', 'px', 'vw' ],
301 267 'range' => [
302 268 '%' => [
303 269 'min' => 1,
304 270 'max' => 100,
@@ -320,9 +286,9 @@
320 286
321 287 $this->add_responsive_control(
322 288 'space',
323 289 [
324 - 'label' => esc_html__( 'Max Width', 'elementor' ),
290 + 'label' => __( 'Max Width', 'elementor' ),
325 291 'type' => Controls_Manager::SLIDER,
326 292 'default' => [
327 293 'unit' => '%',
328 294 ],
@@ -331,9 +297,9 @@
331 297 ],
332 298 'mobile_default' => [
333 299 'unit' => '%',
334 300 ],
335 - 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
301 + 'size_units' => [ '%', 'px', 'vw' ],
336 302 'range' => [
337 303 '%' => [
338 304 'min' => 1,
339 305 'max' => 100,
@@ -355,11 +321,20 @@
355 321
356 322 $this->add_responsive_control(
357 323 'height',
358 324 [
359 - 'label' => esc_html__( 'Height', 'elementor' ),
325 + 'label' => __( 'Height', 'elementor' ),
360 326 'type' => Controls_Manager::SLIDER,
361 - 'size_units' => [ 'px', '%', 'em', 'rem', 'vh', 'custom' ],
327 + 'default' => [
328 + 'unit' => 'px',
329 + ],
330 + 'tablet_default' => [
331 + 'unit' => 'px',
332 + ],
333 + 'mobile_default' => [
334 + 'unit' => 'px',
335 + ],
336 + 'size_units' => [ 'px', 'vh' ],
362 337 'range' => [
363 338 'px' => [
364 339 'min' => 1,
365 340 'max' => 500,
@@ -377,19 +352,18 @@
377 352
378 353 $this->add_responsive_control(
379 354 'object-fit',
380 355 [
381 - 'label' => esc_html__( 'Object Fit', 'elementor' ),
356 + 'label' => __( 'Object Fit', 'elementor' ),
382 357 'type' => Controls_Manager::SELECT,
383 358 'condition' => [
384 359 'height[size]!' => '',
385 360 ],
386 361 'options' => [
387 - '' => esc_html__( 'Default', 'elementor' ),
388 - 'fill' => esc_html__( 'Fill', 'elementor' ),
389 - 'cover' => esc_html__( 'Cover', 'elementor' ),
390 - 'contain' => esc_html__( 'Contain', 'elementor' ),
391 - 'scale-down' => esc_html__( 'Scale Down', 'elementor' ),
362 + '' => __( 'Default', 'elementor' ),
363 + 'fill' => __( 'Fill', 'elementor' ),
364 + 'cover' => __( 'Cover', 'elementor' ),
365 + 'contain' => __( 'Contain', 'elementor' ),
392 366 ],
393 367 'default' => '',
394 368 'selectors' => [
395 369 '{{WRAPPER}} img' => 'object-fit: {{VALUE}};',
@@ -396,35 +370,8 @@
396 370 ],
397 371 ]
398 372 );
399 373
400 - $this->add_responsive_control(
401 - 'object-position',
402 - [
403 - 'label' => esc_html__( 'Object Position', 'elementor' ),
404 - 'type' => Controls_Manager::SELECT,
405 - 'options' => [
406 - 'center center' => esc_html__( 'Center Center', 'elementor' ),
407 - 'center left' => esc_html__( 'Center Left', 'elementor' ),
408 - 'center right' => esc_html__( 'Center Right', 'elementor' ),
409 - 'top center' => esc_html__( 'Top Center', 'elementor' ),
410 - 'top left' => esc_html__( 'Top Left', 'elementor' ),
411 - 'top right' => esc_html__( 'Top Right', 'elementor' ),
412 - 'bottom center' => esc_html__( 'Bottom Center', 'elementor' ),
413 - 'bottom left' => esc_html__( 'Bottom Left', 'elementor' ),
414 - 'bottom right' => esc_html__( 'Bottom Right', 'elementor' ),
415 - ],
416 - 'default' => 'center center',
417 - 'selectors' => [
418 - '{{WRAPPER}} img' => 'object-position: {{VALUE}};',
419 - ],
420 - 'condition' => [
421 - 'height[size]!' => '',
422 - 'object-fit' => [ 'cover', 'contain', 'scale-down' ],
423 - ],
424 - ]
425 - );
426 -
427 374 $this->add_control(
428 375 'separator_panel_style',
429 376 [
430 377 'type' => Controls_Manager::DIVIDER,
@@ -435,9 +382,9 @@
435 382 $this->start_controls_tabs( 'image_effects' );
436 383
437 384 $this->start_controls_tab( 'normal',
438 385 [
439 - 'label' => esc_html__( 'Normal', 'elementor' ),
386 + 'label' => __( 'Normal', 'elementor' ),
440 387 ]
441 388 );
442 389
443 390 $this->add_control(
@@ -442,9 +389,9 @@
442 389
443 390 $this->add_control(
444 391 'opacity',
445 392 [
446 - 'label' => esc_html__( 'Opacity', 'elementor' ),
393 + 'label' => __( 'Opacity', 'elementor' ),
447 394 'type' => Controls_Manager::SLIDER,
448 395 'range' => [
449 396 'px' => [
450 397 'max' => 1,
@@ -469,9 +416,9 @@
469 416 $this->end_controls_tab();
470 417
471 418 $this->start_controls_tab( 'hover',
472 419 [
473 - 'label' => esc_html__( 'Hover', 'elementor' ),
420 + 'label' => __( 'Hover', 'elementor' ),
474 421 ]
475 422 );
476 423
477 424 $this->add_control(
@@ -476,9 +423,9 @@
476 423
477 424 $this->add_control(
478 425 'opacity_hover',
479 426 [
480 - 'label' => esc_html__( 'Opacity', 'elementor' ),
427 + 'label' => __( 'Opacity', 'elementor' ),
481 428 'type' => Controls_Manager::SLIDER,
482 429 'range' => [
483 430 'px' => [
484 431 'max' => 1,
@@ -502,13 +449,12 @@
502 449
503 450 $this->add_control(
504 451 'background_hover_transition',
505 452 [
506 - 'label' => esc_html__( 'Transition Duration', 'elementor' ) . ' (s)',
453 + 'label' => __( 'Transition Duration', 'elementor' ),
507 454 'type' => Controls_Manager::SLIDER,
508 455 'range' => [
509 456 'px' => [
510 - 'min' => 0,
511 457 'max' => 3,
512 458 'step' => 0.1,
513 459 ],
514 460 ],
@@ -520,9 +466,9 @@
520 466
521 467 $this->add_control(
522 468 'hover_animation',
523 469 [
524 - 'label' => esc_html__( 'Hover Animation', 'elementor' ),
470 + 'label' => __( 'Hover Animation', 'elementor' ),
525 471 'type' => Controls_Manager::HOVER_ANIMATION,
526 472 ]
527 473 );
528 474
@@ -541,11 +487,11 @@
541 487
542 488 $this->add_responsive_control(
543 489 'image_border_radius',
544 490 [
545 - 'label' => esc_html__( 'Border Radius', 'elementor' ),
491 + 'label' => __( 'Border Radius', 'elementor' ),
546 492 'type' => Controls_Manager::DIMENSIONS,
547 - 'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
493 + 'size_units' => [ 'px', '%' ],
548 494 'selectors' => [
549 495 '{{WRAPPER}} img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
550 496 ],
551 497 ]
@@ -566,45 +512,39 @@
566 512
567 513 $this->start_controls_section(
568 514 'section_style_caption',
569 515 [
570 - 'label' => esc_html__( 'Caption', 'elementor' ),
516 + 'label' => __( 'Caption', 'elementor' ),
571 517 'tab' => Controls_Manager::TAB_STYLE,
572 518 'condition' => [
573 - 'image[url]!' => '',
574 519 'caption_source!' => 'none',
575 520 ],
576 521 ]
577 522 );
578 523
579 - $this->add_responsive_control(
524 + $this->add_control(
580 525 'caption_align',
581 526 [
582 - 'label' => esc_html__( 'Alignment', 'elementor' ),
527 + 'label' => __( 'Alignment', 'elementor' ),
583 528 'type' => Controls_Manager::CHOOSE,
584 529 'options' => [
585 - 'start' => [
586 - 'title' => esc_html__( 'Start', 'elementor' ),
530 + 'left' => [
531 + 'title' => __( 'Left', 'elementor' ),
587 532 'icon' => 'eicon-text-align-left',
588 533 ],
589 534 'center' => [
590 - 'title' => esc_html__( 'Center', 'elementor' ),
535 + 'title' => __( 'Center', 'elementor' ),
591 536 'icon' => 'eicon-text-align-center',
592 537 ],
593 - 'end' => [
594 - 'title' => esc_html__( 'End', 'elementor' ),
538 + 'right' => [
539 + 'title' => __( 'Right', 'elementor' ),
595 540 'icon' => 'eicon-text-align-right',
596 541 ],
597 542 'justify' => [
598 - 'title' => esc_html__( 'Justified', 'elementor' ),
543 + 'title' => __( 'Justified', 'elementor' ),
599 544 'icon' => 'eicon-text-align-justify',
600 545 ],
601 546 ],
602 - 'classes' => 'elementor-control-start-end',
603 - 'selectors_dictionary' => [
604 - 'left' => is_rtl() ? 'end' : 'start',
605 - 'right' => is_rtl() ? 'start' : 'end',
606 - ],
607 547 'default' => '',
608 548 'selectors' => [
609 549 '{{WRAPPER}} .widget-image-caption' => 'text-align: {{VALUE}};',
610 550 ],
@@ -613,9 +553,9 @@
613 553
614 554 $this->add_control(
615 555 'text_color',
616 556 [
617 - 'label' => esc_html__( 'Text Color', 'elementor' ),
557 + 'label' => __( 'Text Color', 'elementor' ),
618 558 'type' => Controls_Manager::COLOR,
619 559 'default' => '',
620 560 'selectors' => [
621 561 '{{WRAPPER}} .widget-image-caption' => 'color: {{VALUE}};',
@@ -628,9 +568,9 @@
628 568
629 569 $this->add_control(
630 570 'caption_background_color',
631 571 [
632 - 'label' => esc_html__( 'Background Color', 'elementor' ),
572 + 'label' => __( 'Background Color', 'elementor' ),
633 573 'type' => Controls_Manager::COLOR,
634 574 'selectors' => [
635 575 '{{WRAPPER}} .widget-image-caption' => 'background-color: {{VALUE}};',
636 576 ],
@@ -658,26 +598,18 @@
658 598
659 599 $this->add_responsive_control(
660 600 'caption_space',
661 601 [
662 - 'label' => esc_html__( 'Spacing', 'elementor' ),
602 + 'label' => __( 'Spacing', 'elementor' ),
663 603 'type' => Controls_Manager::SLIDER,
664 - 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
665 604 'range' => [
666 605 'px' => [
606 + 'min' => 0,
667 607 'max' => 100,
668 608 ],
669 - 'em' => [
670 - 'min' => 0,
671 - 'max' => 10,
672 - ],
673 - 'rem' => [
674 - 'min' => 0,
675 - 'max' => 10,
676 - ],
677 609 ],
678 610 'selectors' => [
679 - '{{WRAPPER}} .widget-image-caption' => 'margin-block-start: {{SIZE}}{{UNIT}};',
611 + '{{WRAPPER}} .widget-image-caption' => 'margin-top: {{SIZE}}{{UNIT}};',
680 612 ],
681 613 ]
682 614 );
683 615
@@ -702,9 +634,9 @@
702 634 * Get the caption for current widget.
703 635 *
704 636 * @access private
705 637 * @since 2.3.0
706 - * @param array $settings
638 + * @param $settings
707 639 *
708 640 * @return string
709 641 */
710 642 private function get_caption( $settings ) {
@@ -735,8 +667,12 @@
735 667 if ( empty( $settings['image']['url'] ) ) {
736 668 return;
737 669 }
738 670
671 + if ( ! Plugin::$instance->experiments->is_feature_active( 'e_dom_optimization' ) ) {
672 + $this->add_render_attribute( 'wrapper', 'class', 'elementor-image' );
673 + }
674 +
739 675 $has_caption = $this->has_caption( $settings );
740 676
741 677 $link = $this->get_link_url( $settings );
742 678
@@ -752,85 +688,33 @@
752 688 if ( 'custom' !== $settings['link_to'] ) {
753 689 $this->add_lightbox_data_attributes( 'link', $settings['image']['id'], $settings['open_lightbox'] );
754 690 }
755 691 } ?>
692 + <?php if ( ! Plugin::$instance->experiments->is_feature_active( 'e_dom_optimization' ) ) { ?>
693 + <div <?php echo $this->get_render_attribute_string( 'wrapper' ); ?>>
694 + <?php } ?>
756 695 <?php if ( $has_caption ) : ?>
757 696 <figure class="wp-caption">
758 697 <?php endif; ?>
759 698 <?php if ( $link ) : ?>
760 - <a <?php $this->print_render_attribute_string( 'link' ); ?>>
699 + <a <?php echo $this->get_render_attribute_string( 'link' ); ?>>
761 700 <?php endif; ?>
762 - <?php Group_Control_Image_Size::print_attachment_image_html( $settings ); ?>
701 + <?php echo Group_Control_Image_Size::get_attachment_image_html( $settings ); ?>
763 702 <?php if ( $link ) : ?>
764 703 </a>
765 704 <?php endif; ?>
766 705 <?php if ( $has_caption ) : ?>
767 - <figcaption class="widget-image-caption wp-caption-text"><?php
768 - echo wp_kses_post( $this->get_caption( $settings ) );
769 - ?></figcaption>
706 + <figcaption class="widget-image-caption wp-caption-text"><?php echo $this->get_caption( $settings ); ?></figcaption>
770 707 <?php endif; ?>
771 708 <?php if ( $has_caption ) : ?>
772 709 </figure>
773 710 <?php endif; ?>
711 + <?php if ( ! Plugin::$instance->experiments->is_feature_active( 'e_dom_optimization' ) ) { ?>
712 + </div>
713 + <?php } ?>
774 714 <?php
775 715 }
776 716
777 - public function render_markdown(): string {
778 - $settings = $this->get_settings_for_display();
779 -
780 - if ( empty( $settings['image']['url'] ) ) {
781 - return '';
782 - }
783 -
784 - $url = esc_url( $settings['image']['url'] );
785 - $alt = $this->get_image_alt_text( $settings );
786 - $image_md = '![' . $alt . '](' . $url . ')';
787 -
788 - $link = $this->get_link_url( $settings );
789 -
790 - if ( ! empty( $link['url'] ) && $link['url'] !== $url ) {
791 - $image_md = '[' . $image_md . '](' . esc_url( $link['url'] ) . ')';
792 - }
793 -
794 - $caption = $this->get_visible_caption( $settings );
795 -
796 - if ( ! empty( $caption ) ) {
797 - $image_md .= "\n" . $caption;
798 - }
799 -
800 - return $image_md;
801 - }
802 -
803 - private function get_image_alt_text( array $settings ): string {
804 - if ( empty( $settings['image']['id'] ) ) {
805 - return '';
806 - }
807 -
808 - $attachment_id = $settings['image']['id'];
809 -
810 - $alt = get_post_meta( $attachment_id, '_wp_attachment_image_alt', true );
811 -
812 - if ( ! empty( $alt ) ) {
813 - return $alt;
814 - }
815 -
816 - $attachment = get_post( $attachment_id );
817 -
818 - if ( ! $attachment ) {
819 - return '';
820 - }
821 -
822 - return $attachment->post_title ?? '';
823 - }
824 -
825 - private function get_visible_caption( array $settings ): string {
826 - if ( ! $this->has_caption( $settings ) ) {
827 - return '';
828 - }
829 -
830 - return Utils::html_to_plain_text( $this->get_caption( $settings ) );
831 - }
832 -
833 717 /**
834 718 * Render image widget output in the editor.
835 719 *
836 720 * Written as a Backbone JavaScript template and used to generate the live preview.
@@ -887,9 +771,9 @@
887 771
888 772 var link_url;
889 773
890 774 if ( 'custom' === settings.link_to ) {
891 - link_url = settings.link?.url;
775 + link_url = settings.link.url;
892 776 }
893 777
894 778 if ( 'file' === settings.link_to ) {
895 779 link_url = settings.image.url;
@@ -894,8 +778,12 @@
894 778 if ( 'file' === settings.link_to ) {
895 779 link_url = settings.image.url;
896 780 }
897 781
782 + <?php if ( ! Plugin::$instance->experiments->is_feature_active( 'e_dom_optimization' ) ) { ?>
783 + #><div class="elementor-image{{ settings.shape ? ' elementor-image-shape-' + settings.shape : '' }}"><#
784 + <?php } ?>
785 +
898 786 var imgClass = '';
899 787
900 788 if ( '' !== settings.hover_animation ) {
901 789 imgClass = 'elementor-animation-' + settings.hover_animation;
@@ -905,9 +793,9 @@
905 793 #><figure class="wp-caption"><#
906 794 }
907 795
908 796 if ( link_url ) {
909 - #><a class="elementor-clickable" data-elementor-open-lightbox="{{ settings.open_lightbox }}" href="{{ elementor.helpers.sanitizeUrl( link_url ) }}"><#
797 + #><a class="elementor-clickable" data-elementor-open-lightbox="{{ settings.open_lightbox }}" href="{{ link_url }}"><#
910 798 }
911 799 #><img src="{{ image_url }}" class="{{ imgClass }}" /><#
912 800
913 801 if ( link_url ) {
@@ -920,8 +808,13 @@
920 808
921 809 if ( hasCaption() ) {
922 810 #></figure><#
923 811 }
812 +
813 + <?php if ( ! Plugin::$instance->experiments->is_feature_active( 'e_dom_optimization' ) ) { ?>
814 + #></div><#
815 + <?php } ?>
816 +
924 817 } #>
925 818 <?php
926 819 }
927 820
@@ -927,16 +820,16 @@
927 820
928 821 /**
929 822 * Retrieve image widget link URL.
930 823 *
931 - * @since 3.11.0
932 - * @access protected
824 + * @since 1.0.0
825 + * @access private
933 826 *
934 827 * @param array $settings
935 828 *
936 829 * @return array|string|false An array/string containing the link URL, or false if no link.
937 830 */
938 - protected function get_link_url( $settings ) {
831 + private function get_link_url( $settings ) {
939 832 if ( 'none' === $settings['link_to'] ) {
940 833 return false;
941 834 }
942 835