PluginProbe
Elementor Website Builder – more than just a page builder / 3.11.2
Elementor Website Builder – more than just a page builder v3.11.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/heading.php +59 -304 4.1.43.11.2 View file →
@@ -6,12 +6,8 @@
6 6 }
7 7
8 8 use Elementor\Core\Kits\Documents\Tabs\Global_Colors;
9 9 use Elementor\Core\Kits\Documents\Tabs\Global_Typography;
10 -use Elementor\Modules\ContentSanitizer\Interfaces\Sanitizable;
11 -use Elementor\Core\Utils\Hints;
12 -use Elementor\Core\Admin\Admin_Notices;
13 -use Elementor\Modules\Promotions\Controls\Promotion_Control;
14 10
15 11 /**
16 12 * Elementor heading widget.
17 13 *
@@ -18,9 +14,9 @@
18 14 * Elementor widget that displays an eye-catching headlines.
19 15 *
20 16 * @since 1.0.0
21 17 */
22 -class Widget_Heading extends Widget_Base implements Sanitizable {
18 +class Widget_Heading extends Widget_Base {
23 19
24 20 /**
25 21 * Get widget name.
26 22 *
@@ -92,78 +88,9 @@
92 88 public function get_keywords() {
93 89 return [ 'heading', 'title', 'text' ];
94 90 }
95 91
96 - protected function is_dynamic_content(): bool {
97 - return false;
98 - }
99 -
100 92 /**
101 - * Get style dependencies.
102 - *
103 - * Retrieve the list of style dependencies the widget requires.
104 - *
105 - * @since 3.24.0
106 - * @access public
107 - *
108 - * @return array Widget style dependencies.
109 - */
110 - public function get_style_depends(): array {
111 - return [ 'widget-heading' ];
112 - }
113 -
114 - public function has_widget_inner_wrapper(): bool {
115 - return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
116 - }
117 -
118 - /**
119 - * Remove data attributes from the html.
120 - *
121 - * @param string $content Heading title.
122 - * @return string
123 - */
124 - public function sanitize( $content ): string {
125 - $allowed_tags = wp_kses_allowed_html( 'post' );
126 - $allowed_tags_for_heading = [];
127 - $non_allowed_tags = [ 'img' ];
128 -
129 - foreach ( $allowed_tags as $tag => $attributes ) {
130 - if ( in_array( $tag, $non_allowed_tags, true ) ) {
131 - continue;
132 - }
133 -
134 - $filtered_attributes = array_filter( $attributes, function( $attribute ) {
135 - return ! substr( $attribute, 0, 5 ) === 'data-';
136 - }, ARRAY_FILTER_USE_KEY );
137 -
138 - $allowed_tags_for_heading[ $tag ] = $filtered_attributes;
139 - }
140 -
141 - return wp_kses( $content, $allowed_tags_for_heading );
142 - }
143 -
144 - /**
145 - * Get widget upsale data.
146 - *
147 - * Retrieve the widget promotion data.
148 - *
149 - * @since 3.18.0
150 - * @access protected
151 - *
152 - * @return array Widget promotion data.
153 - */
154 - protected function get_upsale_data() {
155 - return [
156 - 'condition' => ! Utils::has_pro(),
157 - 'image' => esc_url( ELEMENTOR_ASSETS_URL . 'images/go-pro.svg' ),
158 - 'image_alt' => esc_attr__( 'Upgrade', 'elementor' ),
159 - 'description' => esc_html__( 'Create captivating headings that rotate with the Animated Headline Widget.', 'elementor' ),
160 - 'upgrade_url' => esc_url( 'https://go.elementor.com/go-pro-heading-widget/' ),
161 - 'upgrade_text' => esc_html__( 'Upgrade Now', 'elementor' ),
162 - ];
163 - }
164 -
165 - /**
166 93 * Register heading widget controls.
167 94 *
168 95 * Adds different input fields to allow the user to change and customize the widget settings.
169 96 *
@@ -173,9 +100,9 @@
173 100 protected function register_controls() {
174 101 $this->start_controls_section(
175 102 'section_title',
176 103 [
177 - 'label' => esc_html__( 'Heading', 'elementor' ),
104 + 'label' => esc_html__( 'Title', 'elementor' ),
178 105 ]
179 106 );
180 107
181 108 $this->add_control(
@@ -182,11 +109,8 @@
182 109 'title',
183 110 [
184 111 'label' => esc_html__( 'Title', 'elementor' ),
185 112 'type' => Controls_Manager::TEXTAREA,
186 - 'ai' => [
187 - 'type' => 'text',
188 - ],
189 113 'dynamic' => [
190 114 'active' => true,
191 115 ],
192 116 'placeholder' => esc_html__( 'Enter your title', 'elementor' ),
@@ -204,8 +128,9 @@
204 128 ],
205 129 'default' => [
206 130 'url' => '',
207 131 ],
132 + 'separator' => 'before',
208 133 ]
209 134 );
210 135
211 136 $this->add_control(
@@ -212,8 +137,9 @@
212 137 'size',
213 138 [
214 139 'label' => esc_html__( 'Size', 'elementor' ),
215 140 'type' => Controls_Manager::SELECT,
141 + 'default' => 'default',
216 142 'options' => [
217 143 'default' => esc_html__( 'Default', 'elementor' ),
218 144 'small' => esc_html__( 'Small', 'elementor' ),
219 145 'medium' => esc_html__( 'Medium', 'elementor' ),
@@ -220,12 +146,8 @@
220 146 'large' => esc_html__( 'Large', 'elementor' ),
221 147 'xl' => esc_html__( 'XL', 'elementor' ),
222 148 'xxl' => esc_html__( 'XXL', 'elementor' ),
223 149 ],
224 - 'default' => 'default',
225 - 'condition' => [
226 - 'size!' => 'default', // a workaround to hide the control, unless it's in use (not default).
227 - ],
228 150 ]
229 151 );
230 152
231 153 $this->add_control(
@@ -247,20 +169,8 @@
247 169 'default' => 'h2',
248 170 ]
249 171 );
250 172
251 - $this->maybe_add_ally_heading_hint();
252 -
253 - $this->end_controls_section();
254 -
255 - $this->start_controls_section(
256 - 'section_title_style',
257 - [
258 - 'label' => esc_html__( 'Heading', 'elementor' ),
259 - 'tab' => Controls_Manager::TAB_STYLE,
260 - ]
261 - );
262 -
263 173 $this->add_responsive_control(
264 174 'align',
265 175 [
266 176 'label' => esc_html__( 'Alignment', 'elementor' ),
@@ -265,10 +175,10 @@
265 175 [
266 176 'label' => esc_html__( 'Alignment', 'elementor' ),
267 177 'type' => Controls_Manager::CHOOSE,
268 178 'options' => [
269 - 'start' => [
270 - 'title' => esc_html__( 'Start', 'elementor' ),
179 + 'left' => [
180 + 'title' => esc_html__( 'Left', 'elementor' ),
271 181 'icon' => 'eicon-text-align-left',
272 182 ],
273 183 'center' => [
274 184 'title' => esc_html__( 'Center', 'elementor' ),
@@ -273,10 +183,10 @@
273 183 'center' => [
274 184 'title' => esc_html__( 'Center', 'elementor' ),
275 185 'icon' => 'eicon-text-align-center',
276 186 ],
277 - 'end' => [
278 - 'title' => esc_html__( 'End', 'elementor' ),
187 + 'right' => [
188 + 'title' => esc_html__( 'Right', 'elementor' ),
279 189 'icon' => 'eicon-text-align-right',
280 190 ],
281 191 'justify' => [
282 192 'title' => esc_html__( 'Justified', 'elementor' ),
@@ -282,21 +192,48 @@
282 192 'title' => esc_html__( 'Justified', 'elementor' ),
283 193 'icon' => 'eicon-text-align-justify',
284 194 ],
285 195 ],
286 - 'classes' => 'elementor-control-start-end',
287 - 'selectors_dictionary' => [
288 - 'left' => is_rtl() ? 'end' : 'start',
289 - 'right' => is_rtl() ? 'start' : 'end',
290 - ],
291 196 'default' => '',
292 197 'selectors' => [
293 198 '{{WRAPPER}}' => 'text-align: {{VALUE}};',
294 199 ],
295 - 'separator' => 'after',
296 200 ]
297 201 );
298 202
203 + $this->add_control(
204 + 'view',
205 + [
206 + 'label' => esc_html__( 'View', 'elementor' ),
207 + 'type' => Controls_Manager::HIDDEN,
208 + 'default' => 'traditional',
209 + ]
210 + );
211 +
212 + $this->end_controls_section();
213 +
214 + $this->start_controls_section(
215 + 'section_title_style',
216 + [
217 + 'label' => esc_html__( 'Title', 'elementor' ),
218 + 'tab' => Controls_Manager::TAB_STYLE,
219 + ]
220 + );
221 +
222 + $this->add_control(
223 + 'title_color',
224 + [
225 + 'label' => esc_html__( 'Text Color', 'elementor' ),
226 + 'type' => Controls_Manager::COLOR,
227 + 'global' => [
228 + 'default' => Global_Colors::COLOR_PRIMARY,
229 + ],
230 + 'selectors' => [
231 + '{{WRAPPER}} .elementor-heading-title' => 'color: {{VALUE}};',
232 + ],
233 + ]
234 + );
235 +
299 236 $this->add_group_control(
300 237 Group_Control_Typography::get_type(),
301 238 [
302 239 'name' => 'typography',
@@ -329,96 +266,28 @@
329 266 'label' => esc_html__( 'Blend Mode', 'elementor' ),
330 267 'type' => Controls_Manager::SELECT,
331 268 'options' => [
332 269 '' => esc_html__( 'Normal', 'elementor' ),
333 - 'multiply' => esc_html__( 'Multiply', 'elementor' ),
334 - 'screen' => esc_html__( 'Screen', 'elementor' ),
335 - 'overlay' => esc_html__( 'Overlay', 'elementor' ),
336 - 'darken' => esc_html__( 'Darken', 'elementor' ),
337 - 'lighten' => esc_html__( 'Lighten', 'elementor' ),
338 - 'color-dodge' => esc_html__( 'Color Dodge', 'elementor' ),
339 - 'saturation' => esc_html__( 'Saturation', 'elementor' ),
340 - 'color' => esc_html__( 'Color', 'elementor' ),
341 - 'difference' => esc_html__( 'Difference', 'elementor' ),
342 - 'exclusion' => esc_html__( 'Exclusion', 'elementor' ),
343 - 'hue' => esc_html__( 'Hue', 'elementor' ),
344 - 'luminosity' => esc_html__( 'Luminosity', 'elementor' ),
270 + 'multiply' => 'Multiply',
271 + 'screen' => 'Screen',
272 + 'overlay' => 'Overlay',
273 + 'darken' => 'Darken',
274 + 'lighten' => 'Lighten',
275 + 'color-dodge' => 'Color Dodge',
276 + 'saturation' => 'Saturation',
277 + 'color' => 'Color',
278 + 'difference' => 'Difference',
279 + 'exclusion' => 'Exclusion',
280 + 'hue' => 'Hue',
281 + 'luminosity' => 'Luminosity',
345 282 ],
346 283 'selectors' => [
347 284 '{{WRAPPER}} .elementor-heading-title' => 'mix-blend-mode: {{VALUE}}',
348 285 ],
286 + 'separator' => 'none',
349 287 ]
350 288 );
351 289
352 - $this->add_control(
353 - 'separator',
354 - [
355 - 'type' => Controls_Manager::DIVIDER,
356 - ]
357 - );
358 -
359 - $this->start_controls_tabs( 'title_colors' );
360 -
361 - $this->start_controls_tab(
362 - 'title_colors_normal',
363 - [
364 - 'label' => esc_html__( 'Normal', 'elementor' ),
365 - ]
366 - );
367 -
368 - $this->add_control(
369 - 'title_color',
370 - [
371 - 'label' => esc_html__( 'Text Color', 'elementor' ),
372 - 'type' => Controls_Manager::COLOR,
373 - 'global' => [
374 - 'default' => Global_Colors::COLOR_PRIMARY,
375 - ],
376 - 'selectors' => [
377 - '{{WRAPPER}} .elementor-heading-title' => 'color: {{VALUE}};',
378 - ],
379 - ]
380 - );
381 -
382 - $this->end_controls_tab();
383 -
384 - $this->start_controls_tab(
385 - 'title_colors_hover',
386 - [
387 - 'label' => esc_html__( 'Hover', 'elementor' ),
388 - ]
389 - );
390 -
391 - $this->add_control(
392 - 'title_hover_color',
393 - [
394 - 'label' => esc_html__( 'Link Color', 'elementor' ),
395 - 'type' => Controls_Manager::COLOR,
396 - 'selectors' => [
397 - '{{WRAPPER}} .elementor-heading-title a:hover, {{WRAPPER}} .elementor-heading-title a:focus' => 'color: {{VALUE}};',
398 - ],
399 - ]
400 - );
401 -
402 - $this->add_control(
403 - 'title_hover_color_transition_duration',
404 - [
405 - 'label' => esc_html__( 'Transition Duration', 'elementor' ),
406 - 'type' => Controls_Manager::SLIDER,
407 - 'size_units' => [ 's', 'ms', 'custom' ],
408 - 'default' => [
409 - 'unit' => 's',
410 - ],
411 - 'selectors' => [
412 - '{{WRAPPER}} .elementor-heading-title a' => 'transition-duration: {{SIZE}}{{UNIT}};',
413 - ],
414 - ]
415 - );
416 -
417 - $this->end_controls_tab();
418 -
419 - $this->end_controls_tabs();
420 -
421 290 $this->end_controls_section();
422 291 }
423 292
424 293 /**
@@ -439,15 +308,13 @@
439 308 $this->add_render_attribute( 'title', 'class', 'elementor-heading-title' );
440 309
441 310 if ( ! empty( $settings['size'] ) ) {
442 311 $this->add_render_attribute( 'title', 'class', 'elementor-size-' . $settings['size'] );
443 - } else {
444 - $this->add_render_attribute( 'title', 'class', 'elementor-size-default' );
445 312 }
446 313
447 314 $this->add_inline_editing_attributes( 'title' );
448 315
449 - $title = wp_kses_post( $settings['title'] );
316 + $title = $settings['title'];
450 317
451 318 if ( ! empty( $settings['link']['url'] ) ) {
452 319 $this->add_link_attributes( 'url', $settings['link'] );
453 320
@@ -459,114 +326,8 @@
459 326 // PHPCS - the variable $title_html holds safe data.
460 327 echo $title_html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
461 328 }
462 329
463 - public function render_markdown(): string {
464 - $settings = $this->get_settings_for_display();
465 -
466 - if ( '' === $settings['title'] ) {
467 - return '';
468 - }
469 -
470 - $tag = $settings['header_size'] ?? 'h2';
471 - $level_map = [
472 - 'h1' => 1,
473 - 'h2' => 2,
474 - 'h3' => 3,
475 - 'h4' => 4,
476 - 'h5' => 5,
477 - 'h6' => 6,
478 - ];
479 - $level = $level_map[ $tag ] ?? 2;
480 - $title = Utils::html_to_plain_text( $settings['title'] );
481 -
482 - $md = str_repeat( '#', $level ) . ' ' . $title;
483 -
484 - if ( ! empty( $settings['link']['url'] ) ) {
485 - $md = str_repeat( '#', $level ) . ' [' . $title . '](' . esc_url( $settings['link']['url'] ) . ')';
486 - }
487 -
488 - return $md;
489 - }
490 -
491 - public function maybe_add_ally_heading_hint() {
492 - $notice_id = 'ally_heading_notice';
493 - $plugin_slug = 'pojo-accessibility';
494 -
495 - if ( ! Hints::should_display_hint( $notice_id ) ) {
496 - return;
497 - }
498 -
499 - $one_subscription = Hints::is_plugin_connected_to_one_subscription();
500 - $is_installed = Hints::is_plugin_installed( $plugin_slug );
501 - $is_active = Hints::is_plugin_active( $plugin_slug );
502 -
503 - if ( $is_active ) {
504 - return;
505 - }
506 -
507 - if ( $one_subscription ) {
508 - if ( ! $is_installed ) {
509 - $notice_content = esc_html__( 'Want to ensure this heading is accessible? Your ONE subscription includes Ally. Install it and scan your page.', 'elementor' );
510 - $button_text = esc_html__( 'Install now', 'elementor' );
511 - $button_url = Hints::get_plugin_install_url( $plugin_slug );
512 - $campaign_data = [
513 - 'name' => 'elementor_ea11y_campaign',
514 - 'campaign' => 'acc-scanner-plg-heading-one-install',
515 - 'source' => 'editor-heading-widget-one-install',
516 - 'medium' => 'editor-one',
517 - ];
518 - } elseif ( ! $is_active ) {
519 - $notice_content = esc_html__( 'Keep your content accessible. Activate Ally, included in ONE, to scan this page.', 'elementor' );
520 - $button_text = esc_html__( 'Activate now', 'elementor' );
521 - $button_url = Hints::get_plugin_activate_url( $plugin_slug );
522 - $campaign_data = [
523 - 'name' => 'elementor_ea11y_campaign',
524 - 'campaign' => 'acc-scanner-plg-heading-one-activate',
525 - 'source' => 'editor-heading-widget-one-non-activate',
526 - 'medium' => 'editor-one',
527 - ];
528 - }
529 - } else {
530 - $notice_content = esc_html__( 'Make sure your page is structured with accessibility in mind. Ally helps detect and fix common issues across your site.', 'elementor' );
531 - if ( ! $is_installed ) {
532 - $button_text = esc_html__( 'Install now', 'elementor' );
533 - $button_url = Hints::get_plugin_install_url( $plugin_slug );
534 - } elseif ( ! $is_active ) {
535 - $button_text = esc_html__( 'Activate now', 'elementor' );
536 - $button_url = Hints::get_plugin_activate_url( $plugin_slug );
537 - }
538 - $campaign_data = [
539 - 'name' => 'elementor_ea11y_campaign',
540 - 'campaign' => 'acc-scanner-plg-heading',
541 - 'source' => 'editor-heading-widget',
542 - 'medium' => 'editor',
543 - ];
544 - }
545 -
546 - $notice_heading = esc_html__( 'Accessible structure matters', 'elementor' );
547 -
548 - $this->add_control(
549 - $notice_id,
550 - [
551 - 'type' => Controls_Manager::RAW_HTML,
552 - 'raw' => Hints::get_notice_template( [
553 - 'display' => ! Hints::is_dismissed( $notice_id ),
554 - 'heading' => $notice_heading,
555 - 'type' => 'info',
556 - 'content' => $notice_content,
557 - 'icon' => true,
558 - 'dismissible' => $notice_id,
559 - 'button_text' => $button_text,
560 - 'button_event' => $notice_id,
561 - 'button_data' => [
562 - 'action_url' => Admin_Notices::add_plg_campaign_data( $button_url, $campaign_data ),
563 - ],
564 - ], true ),
565 - ]
566 - );
567 - }
568 -
569 330 /**
570 331 * Render heading widget output in the editor.
571 332 *
572 333 * Written as a Backbone JavaScript template and used to generate the live preview.
@@ -576,21 +337,15 @@
576 337 */
577 338 protected function content_template() {
578 339 ?>
579 340 <#
580 - let title = elementor.helpers.sanitize( settings.title, { ALLOW_DATA_ATTR: false } );
341 + var title = settings.title;
581 342
582 - if ( '' !== settings.link?.url ) {
583 - title = '<a href="' + elementor.helpers.sanitizeUrl( settings.link?.url ) + '">' + title + '</a>';
343 + if ( '' !== settings.link.url ) {
344 + title = '<a href="' + settings.link.url + '">' + title + '</a>';
584 345 }
585 346
586 - view.addRenderAttribute( 'title', 'class', [ 'elementor-heading-title' ] );
587 -
588 - if ( '' !== settings.size ) {
589 - view.addRenderAttribute( 'title', 'class', [ 'elementor-size-' + settings.size ] );
590 - } else {
591 - view.addRenderAttribute( 'title', 'class', [ 'elementor-size-default' ] );
592 - }
347 + view.addRenderAttribute( 'title', 'class', [ 'elementor-heading-title', 'elementor-size-' + settings.size ] );
593 348
594 349 view.addInlineEditingAttributes( 'title' );
595 350
596 351 var headerSizeTag = elementor.helpers.validateHTMLTag( settings.header_size ),