PluginProbe
Elementor Website Builder – more than just a page builder / 3.4.3
Elementor Website Builder – more than just a page builder v3.4.3
4.3.0-beta3 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 All 452 releases
← All changes | includes/managers/icons.php +120 -123 4.1.33.4.3 View file →
@@ -1,10 +1,10 @@
1 1 <?php
2 2 namespace Elementor;
3 3
4 -use Elementor\Core\Files\File_Types\Svg;
5 -use Elementor\Core\Page_Assets\Data_Managers\Font_Icon_Svg\Manager as Font_Icon_Svg_Data_Manager;
6 -use Elementor\Utils;
4 +use Elementor\Core\Page_Assets\Data_Managers\Font_Icon_Svg as Font_Icon_Svg_Data_Manager;
5 +use Elementor\Core\Page_Assets\Managers\Font_Icon_Svg\Manager as Font_Icon_Svg_Manager;
6 +use Elementor\Core\Files\Assets\Svg\Svg_Handler;
7 7
8 8 if ( ! defined( 'ABSPATH' ) ) {
9 9 exit; // Exit if accessed directly.
10 10 }
@@ -22,11 +22,8 @@
22 22
23 23 const FONT_ICON_SVG_CLASS_NAME = 'e-font-icon-svg';
24 24
25 25 const LOAD_FA4_SHIM_OPTION_KEY = 'elementor_load_fa4_shim';
26 -
27 - const ELEMENTOR_ICONS_VERSION = '5.49.0';
28 -
29 26 /**
30 27 * Tabs.
31 28 *
32 29 * Holds the list of all the tabs.
@@ -39,47 +36,16 @@
39 36 private static $tabs;
40 37
41 38 private static $data_manager;
42 39
40 + private static $font_icon_svg_symbols = [];
41 +
43 42 private static function get_needs_upgrade_option() {
44 43 return get_option( 'elementor_' . self::NEEDS_UPDATE_OPTION, null );
45 44 }
46 45
47 46 /**
48 - * @param array $icon
49 - * @param array $attributes
50 - * @param string $tag
51 - * @return bool|mixed|string
52 - */
53 - public static function try_get_icon_html( $icon, $attributes = [], $tag = 'i' ) {
54 - if ( empty( $icon['library'] ) ) {
55 - return '';
56 - }
57 -
58 - return static::get_icon_html( $icon, $attributes, $tag );
59 - }
60 -
61 - /**
62 - * @param array $icon
63 - * @param array $attributes
64 - * @param string $tag
65 - * @return bool|mixed|string
66 - */
67 - private static function get_icon_html( array $icon, array $attributes, $tag ) {
68 - /**
69 - * When the library value is svg it means that it's a SVG media attachment uploaded by the user.
70 - * Otherwise, it's the name of the font family that the icon belongs to.
71 - */
72 - if ( 'svg' === $icon['library'] ) {
73 - $output = self::render_uploaded_svg_icon( $icon['value'] );
74 - } else {
75 - $output = self::render_font_icon( $icon, $attributes, $tag );
76 - }
77 - return $output;
78 - }
79 -
80 - /**
81 - * Register styles
47 + * register styles
82 48 *
83 49 * Used to register all icon types stylesheets so they could be enqueued later by widgets
84 50 */
85 51 public function register_styles() {
@@ -93,9 +59,9 @@
93 59 }
94 60 $dependencies = [];
95 61 if ( ! empty( $icon_type['enqueue'] ) ) {
96 62 foreach ( (array) $icon_type['enqueue'] as $font_css_url ) {
97 - if ( ! in_array( $font_css_url, array_keys( $shared_styles ), true ) ) {
63 + if ( ! in_array( $font_css_url, array_keys( $shared_styles ) ) ) {
98 64 $style_handle = 'elementor-icons-shared-' . count( $shared_styles );
99 65 wp_register_style(
100 66 $style_handle,
101 67 $font_css_url,
@@ -178,9 +144,8 @@
178 144 }
179 145
180 146 /**
181 147 * Get Icon Manager Tabs
182 - *
183 148 * @return array
184 149 */
185 150 public static function get_icon_manager_tabs() {
186 151 if ( self::is_font_icon_inline_svg() && ! Plugin::$instance->editor->is_edit_mode() && ! Plugin::$instance->preview->is_preview_mode() ) {
@@ -199,13 +164,12 @@
199 164 * @param array $additional_tabs Additional icon manager tabs. Default is an empty array.
200 165 */
201 166 $additional_tabs = apply_filters( 'elementor/icons_manager/additional_tabs', $additional_tabs );
202 167
203 - return array_replace( self::$tabs, $additional_tabs );
168 + return array_merge( self::$tabs, $additional_tabs );
204 169 }
205 170
206 171 public static function enqueue_shim() {
207 - //phpcs:ignore WordPress.WP.EnqueuedResourceParameters.NotInFooter
208 172 wp_enqueue_script(
209 173 'font-awesome-4-shim',
210 174 self::get_fa_asset_url( 'v4-shims', 'js' ),
211 175 [],
@@ -230,9 +194,9 @@
230 194
231 195 private static function get_fa_asset_url( $filename, $ext_type = 'css', $add_suffix = true ) {
232 196 static $is_test_mode = null;
233 197 if ( null === $is_test_mode ) {
234 - $is_test_mode = Utils::is_script_debug() || Utils::is_elementor_tests();
198 + $is_test_mode = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG || defined( 'ELEMENTOR_TESTS' ) && ELEMENTOR_TESTS;
235 199 }
236 200 $url = ELEMENTOR_ASSETS_URL . 'lib/font-awesome/' . $ext_type . '/' . $filename;
237 201 if ( ! $is_test_mode && $add_suffix ) {
238 202 $url .= '.min';
@@ -253,24 +217,49 @@
253 217
254 218 return array_values( array_merge( $tabs, self::get_icon_manager_tabs() ) );
255 219 }
256 220
221 + /**
222 + * is_font_awesome_inline
223 + *
224 + * @return bool
225 + */
257 226 private static function is_font_icon_inline_svg() {
258 227 return Plugin::$instance->experiments->is_feature_active( 'e_font_icon_svg' );
259 228 }
260 229
261 230 /**
262 - * @deprecated 3.8.0
231 + * render_svg_symbols
232 + *
263 233 */
264 - public static function render_svg_symbols() {}
234 + public static function render_svg_symbols() {
235 + if ( ! self::$font_icon_svg_symbols ) {
236 + return;
237 + }
265 238
239 + $svg = '<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">';
240 +
241 + foreach ( self::$font_icon_svg_symbols as $symbol_id => $symbol ) {
242 + $svg .= '<symbol id="' . $symbol_id . '" viewBox="0 0 ' . esc_attr( $symbol['width'] ) . ' ' . esc_attr( $symbol['height'] ) . '">';
243 + $svg .= '<path d="' . esc_attr( $symbol['path'] ) . '"></path>';
244 + $svg .= '</symbol>';
245 + }
246 +
247 + $svg .= '</svg>';
248 +
249 + Utils::print_unescaped_internal_string( $svg );
250 + }
251 +
266 252 public static function get_icon_svg_data( $icon ) {
267 - return self::$data_manager->get_font_icon_svg_data( $icon );
253 + $font_family_manager = Font_Icon_Svg_Manager::get_font_family_manager( $icon['font_family'] );
254 +
255 + $config = $font_family_manager::get_config( $icon );
256 +
257 + return self::$data_manager->get_asset_data( $config );
268 258 }
269 259
270 260 /**
271 261 * Get font awesome svg.
272 - *
273 262 * @param $icon array [ 'value' => string, 'library' => string ]
274 263 *
275 264 * @return bool|mixed|string
276 265 */
@@ -281,22 +270,31 @@
281 270 if ( ! $icon_data['path'] ) {
282 271 return '';
283 272 }
284 273
274 + // Add the icon data to the symbols array for later use in page rendering process.
275 + if ( ! in_array( $icon_data['key'], self::$font_icon_svg_symbols, true ) ) {
276 + self::$font_icon_svg_symbols[ $icon_data['key'] ] = $icon_data;
277 + }
278 +
285 279 if ( ! empty( $attributes['class'] ) && ! is_array( $attributes['class'] ) ) {
286 280 $attributes['class'] = [ $attributes['class'] ];
287 281 }
288 282
289 283 $attributes['class'][] = self::FONT_ICON_SVG_CLASS_NAME;
290 - $attributes['class'][] = 'e-' . $icon_data['key'];
291 - $attributes['viewBox'] = '0 0 ' . $icon_data['width'] . ' ' . $icon_data['height'];
292 - $attributes['xmlns'] = 'http://www.w3.org/2000/svg';
293 284
294 - return (
295 - '<svg ' . Utils::render_html_attributes( $attributes ) . '>' .
296 - '<path d="' . esc_attr( $icon_data['path'] ) . '"></path>' .
297 - '</svg>'
298 - );
285 + /**
286 + * If in edit mode inline the full svg, otherwise use the symbol.
287 + * Will be displayed only after page update or widget "blur".
288 + */
289 + if ( Plugin::$instance->editor->is_edit_mode() ) {
290 + return '<svg xmlns="http://www.w3.org/2000/svg" ' . Utils::render_html_attributes( $attributes ) . '
291 + viewBox="0 0 ' . esc_attr( $icon_data['width'] ) . ' ' . esc_attr( $icon_data['height'] ) . '">
292 + <path d="' . esc_attr( $icon_data['path'] ) . '"></path>
293 + </svg>';
294 + }
295 +
296 + return '<svg ' . Utils::render_html_attributes( $attributes ) . '><use xlink:href="#' . esc_attr( $icon_data['key'] ) . '" /></svg>';
299 297 }
300 298
301 299 public static function render_uploaded_svg_icon( $value ) {
302 300 if ( ! isset( $value['id'] ) ) {
@@ -302,9 +300,9 @@
302 300 if ( ! isset( $value['id'] ) ) {
303 301 return '';
304 302 }
305 303
306 - return Svg::get_inline_svg( $value['id'] );
304 + return Svg_Handler::get_inline_svg( $value['id'] );
307 305 }
308 306
309 307 public static function render_font_icon( $icon, $attributes = [], $tag = 'i' ) {
310 308 $icon_types = self::get_icon_manager_tabs();
@@ -314,9 +312,9 @@
314 312 }
315 313
316 314 $content = '';
317 315
318 - $font_icon_svg_family = self::is_font_icon_inline_svg() ? Font_Icon_Svg_Data_Manager::get_font_family( $icon['library'] ) : '';
316 + $font_icon_svg_family = self::is_font_icon_inline_svg() ? Font_Icon_Svg_Manager::get_font_family( $icon['library'] ) : '';
319 317
320 318 if ( $font_icon_svg_family ) {
321 319 $icon['font_family'] = $font_icon_svg_family;
322 320
@@ -329,12 +327,14 @@
329 327
330 328 if ( ! $content ) {
331 329 if ( empty( $attributes['class'] ) ) {
332 330 $attributes['class'] = $icon['value'];
333 - } elseif ( is_array( $attributes['class'] ) ) {
331 + } else {
332 + if ( is_array( $attributes['class'] ) ) {
334 333 $attributes['class'][] = $icon['value'];
335 - } else {
336 - $attributes['class'] .= ' ' . $icon['value'];
334 + } else {
335 + $attributes['class'] .= ' ' . $icon['value'];
336 + }
337 337 }
338 338 }
339 339
340 340 return '<' . $tag . ' ' . Utils::render_html_attributes( $attributes ) . '>' . $content . '</' . $tag . '>';
@@ -343,13 +343,12 @@
343 343 /**
344 344 * Render Icon
345 345 *
346 346 * Used to render Icon for \Elementor\Controls_Manager::ICONS
347 + * @param array $icon Icon Type, Icon value
348 + * @param array $attributes Icon HTML Attributes
349 + * @param string $tag Icon HTML tag, defaults to <i>
347 350 *
348 - * @param array $icon Icon Type, Icon value.
349 - * @param array $attributes Icon HTML Attributes.
350 - * @param string $tag Icon HTML tag, defaults to <i>.
351 - *
352 351 * @return mixed|string
353 352 */
354 353 public static function render_icon( $icon, $attributes = [], $tag = 'i' ) {
355 354 if ( empty( $icon['library'] ) ) {
@@ -355,10 +354,20 @@
355 354 if ( empty( $icon['library'] ) ) {
356 355 return false;
357 356 }
358 357
359 - $output = static::get_icon_html( $icon, $attributes, $tag );
358 + $output = '';
360 359
360 + /**
361 + * When the library value is svg it means that it's a SVG media attachment uploaded by the user.
362 + * Otherwise, it's the name of the font family that the icon belongs to.
363 + */
364 + if ( 'svg' === $icon['library'] ) {
365 + $output = self::render_uploaded_svg_icon( $icon['value'] );
366 + } else {
367 + $output = self::render_font_icon( $icon, $attributes, $tag );
368 + }
369 +
361 370 Utils::print_unescaped_internal_string( $output );
362 371
363 372 return true;
364 373 }
@@ -365,9 +374,9 @@
365 374
366 375 /**
367 376 * Font Awesome 4 to font Awesome 5 Value Migration
368 377 *
369 - * Used to convert string value of Icon control to array value of Icons control
378 + * used to convert string value of Icon control to array value of Icons control
370 379 * ex: 'fa fa-star' => [ 'value' => 'fas fa-star', 'library' => 'fa-solid' ]
371 380 *
372 381 * @param $value
373 382 *
@@ -381,9 +390,9 @@
381 390 'library' => '',
382 391 ];
383 392 }
384 393 if ( false === $migration_dictionary ) {
385 - $migration_dictionary = json_decode( Utils::file_get_contents( ELEMENTOR_ASSETS_PATH . 'lib/font-awesome/migration/mapping.js' ), true );
394 + $migration_dictionary = json_decode( file_get_contents( ELEMENTOR_ASSETS_PATH . 'lib/font-awesome/migration/mapping.js' ), true );
386 395 }
387 396 if ( isset( $migration_dictionary[ $value ] ) ) {
388 397 return $migration_dictionary[ $value ];
389 398 }
@@ -394,15 +403,14 @@
394 403 ];
395 404 }
396 405
397 406 /**
398 - * On_import_migration
407 + * on_import_migration
408 + * @param array $element settings array
409 + * @param string $old_control old control id
410 + * @param string $new_control new control id
411 + * @param bool $remove_old boolean weather to remove old control or not
399 412 *
400 - * @param array $element settings array.
401 - * @param string $old_control old control id.
402 - * @param string $new_control new control id.
403 - * @param bool $remove_old boolean whether to remove old control or not.
404 - *
405 413 * @return array
406 414 */
407 415 public static function on_import_migration( array $element, $old_control = '', $new_control = '', $remove_old = false ) {
408 416
@@ -422,9 +430,9 @@
422 430 }
423 431
424 432 $element['settings'][ $new_control ] = $new_value;
425 433
426 - // remove old value
434 + //remove old value
427 435 if ( $remove_old ) {
428 436 unset( $element['settings'][ $old_control ] );
429 437 }
430 438
@@ -430,8 +438,12 @@
430 438
431 439 return $element;
432 440 }
433 441
442 + /**
443 + * is_migration_allowed
444 + * @return bool
445 + */
434 446 public static function is_migration_allowed() {
435 447 static $migration_allowed = false;
436 448 if ( false === $migration_allowed ) {
437 449 $migration_allowed = null === self::get_needs_upgrade_option();
@@ -438,9 +450,9 @@
438 450
439 451 /**
440 452 * Is icon migration allowed.
441 453 *
442 - * Filters whether the icons migration allowed.
454 + * Filters whther the icons migration allowed.
443 455 *
444 456 * @param bool $migration_allowed Is icon migration is allowed.
445 457 */
446 458 $migration_allowed = apply_filters( 'elementor/icons_manager/migration_allowed', $migration_allowed );
@@ -450,10 +462,9 @@
450 462
451 463 /**
452 464 * Register_Admin Settings
453 465 *
454 - * Adds Font Awesome migration / update admin settings
455 - *
466 + * adds Font Awesome migration / update admin settings
456 467 * @param Settings $settings
457 468 */
458 469 public function register_admin_settings( Settings $settings ) {
459 470 $settings->add_field(
@@ -463,9 +474,9 @@
463 474 [
464 475 'label' => esc_html__( 'Load Font Awesome 4 Support', 'elementor' ),
465 476 'field_args' => [
466 477 'type' => 'select',
467 - 'std' => '',
478 + 'std' => 'yes',
468 479 'options' => [
469 480 '' => esc_html__( 'No', 'elementor' ),
470 481 'yes' => esc_html__( 'Yes', 'elementor' ),
471 482 ],
@@ -481,29 +492,28 @@
481 492 $settings->add_section( 'fontawesome4_migration', 'fontawesome4_migration', [
482 493 'callback' => function() {
483 494 echo '<h2>' . esc_html__( 'Font Awesome Upgrade', 'elementor' ) . '</h2>';
484 495 echo '<p>' . // PHPCS - Plain Text
485 - esc_html__( 'Access 1,500+ amazing Font Awesome 5 icons and enjoy faster performance and design flexibility.', 'elementor' ) . '<br>' . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
486 - esc_html__( 'By upgrading, whenever you edit a page containing a Font Awesome 4 icon, Elementor will convert it to the new Font Awesome 5 icon.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
496 + __( 'Access 1,500+ amazing Font Awesome 5 icons and enjoy faster performance and design flexibility.', 'elementor' ) . '<br>' . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
497 + __( 'By upgrading, whenever you edit a page containing a Font Awesome 4 icon, Elementor will convert it to the new Font Awesome 5 icon.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
487 498 '</p><p><strong>' .
488 - esc_html__( 'Please note that the upgrade process may cause some of the previously used Font Awesome 4 icons to look a bit different due to minor design changes made by Font Awesome.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
499 + __( 'Please note that the upgrade process may cause some of the previously used Font Awesome 4 icons to look a bit different due to minor design changes made by Font Awesome.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
489 500 '</strong></p><p>' .
490 - esc_html__( 'The upgrade process includes a database update', 'elementor' ) . ' - ' . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
491 - esc_html__( 'We highly recommend backing up your database before performing this upgrade.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
501 + __( 'The upgrade process includes a database update', 'elementor' ) . ' - ' . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
502 + __( 'We highly recommend backing up your database before performing this upgrade.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
492 503 '</p>' .
493 - esc_html__( 'This action is not reversible and cannot be undone by rolling back to previous versions.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
504 + __( 'This action is not reversible and cannot be undone by rolling back to previous versions.', 'elementor' ) . // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
494 505 '</p>';
495 506 },
496 507 'fields' => [
497 508 [
498 - 'label' => esc_html__( 'Font Awesome Upgrade', 'elementor' ),
509 + 'label' => esc_html__( 'Font Awesome Upgrade', 'elementor' ),
499 510 'field_args' => [
500 511 'type' => 'raw_html',
501 - 'html' => sprintf( '<span data-action="%s" data-_nonce="%s" data-redirect-url="%s" class="button" id="elementor_upgrade_fa_button">%s</span>',
512 + 'html' => sprintf( '<span data-action="%s" data-_nonce="%s" class="button" id="elementor_upgrade_fa_button">%s</span>',
502 513 self::NEEDS_UPDATE_OPTION . '_upgrade',
503 514 wp_create_nonce( self::NEEDS_UPDATE_OPTION ),
504 - esc_url( $this->get_upgrade_redirect_url() ),
505 - esc_html__( 'Upgrade To Font Awesome 5', 'elementor' )
515 + __( 'Upgrade To Font Awesome 5', 'elementor' )
506 516 ),
507 517 ],
508 518 ],
509 519 ],
@@ -510,51 +520,20 @@
510 520 ] );
511 521 }
512 522
513 523 /**
514 - * Get redirect URL when upgrading font awesome.
515 - *
516 - * @return string
517 - */
518 - public function get_upgrade_redirect_url() {
519 -
520 - if ( ! wp_verify_nonce( Utils::get_super_global_value( $_GET, '_wpnonce' ), 'tools-page-from-editor' ) ) {
521 - return '';
522 - }
523 -
524 - $document_id = ! empty( $_GET['redirect_to_document'] ) ? absint( $_GET['redirect_to_document'] ) : null;
525 -
526 - if ( ! $document_id ) {
527 - return '';
528 - }
529 -
530 - $document = Plugin::$instance->documents->get( $document_id );
531 -
532 - if ( ! $document ) {
533 - return '';
534 - }
535 -
536 - return $document->get_edit_url();
537 - }
538 -
539 - /**
540 524 * Ajax Upgrade to FontAwesome 5
541 525 */
542 526 public function ajax_upgrade_to_fa5() {
543 527 check_ajax_referer( self::NEEDS_UPDATE_OPTION, '_nonce' );
544 528
545 - if ( ! current_user_can( 'manage_options' ) ) {
546 - wp_send_json_error( 'Permission denied' );
547 - }
548 -
549 529 delete_option( 'elementor_' . self::NEEDS_UPDATE_OPTION );
550 530
551 - wp_send_json_success( [ 'message' => esc_html__( 'Hurray! The upgrade process to Font Awesome 5 was completed successfully.', 'elementor' ) ] );
531 + wp_send_json_success( [ 'message' => '<p>' . esc_html__( 'Hurray! The upgrade process to Font Awesome 5 was completed successfully.', 'elementor' ) . '</p>' ] );
552 532 }
553 533
554 534 /**
555 535 * Add Update Needed Flag
556 - *
557 536 * @param array $settings
558 537 *
559 538 * @return array;
560 539 */
@@ -570,9 +549,9 @@
570 549 $current_filter = current_filter();
571 550 $load_shim = get_option( self::LOAD_FA4_SHIM_OPTION_KEY, false );
572 551 if ( 'elementor/editor/after_enqueue_styles' === $current_filter ) {
573 552 self::enqueue_shim();
574 - } elseif ( 'yes' === $load_shim ) {
553 + } else if ( 'yes' === $load_shim ) {
575 554 self::enqueue_shim();
576 555 }
577 556 }
578 557 }
@@ -586,8 +565,24 @@
586 565 return [];
587 566 }
588 567
589 568 /**
569 + * @since 3.0.0
570 + * @deprecated 3.0.0
571 + */
572 + public function register_ajax_actions() {
573 + _deprecated_function( __METHOD__, '3.0.0' );
574 + }
575 +
576 + /**
577 + * @since 3.0.0.
578 + * @deprecated 3.0.0
579 + */
580 + public function ajax_enable_svg_uploads() {
581 + _deprecated_function( __METHOD__, '3.0.0' );
582 + }
583 +
584 + /**
590 585 * Icons Manager constructor
591 586 */
592 587 public function __construct() {
593 588 if ( is_admin() ) {
@@ -596,8 +591,10 @@
596 591 }
597 592
598 593 if ( self::is_font_icon_inline_svg() ) {
599 594 self::$data_manager = new Font_Icon_Svg_Data_Manager();
595 +
596 + add_action( 'wp_footer', [ $this, 'render_svg_symbols' ], 10 );
600 597 }
601 598
602 599 add_action( 'elementor/frontend/after_enqueue_styles', [ $this, 'enqueue_fontawesome_css' ] );
603 600 add_action( 'elementor/frontend/after_register_styles', [ $this, 'register_styles' ] );