From 289419326b96c50aa97e59b9a1609b8d7f0946fd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adam=20Zieli=C5=84ski?= Date: Thu, 27 Aug 2020 16:25:39 +0200 Subject: [PATCH 1/6] Fix invalid HTML structure on the widgets screen --- gutenberg.php | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/gutenberg.php b/gutenberg.php index d2eb01ecbd298d..0e4aaf7aa44749 100644 --- a/gutenberg.php +++ b/gutenberg.php @@ -188,6 +188,21 @@ function register_site_icon_url( $response ) { function gutenberg_register_widgets() { if ( gutenberg_is_experiment_enabled( 'gutenberg-widget-experiments' ) ) { register_widget( 'WP_Widget_Block' ); + // By default every widget on widgets.php is wrapped with a
. + // This means that you can sometimes end up with invalid HTML, e.g. when + // one of the widgets is a Search block. + // + // To fix the problem, let's add a filter that moves the form below the actual + // widget content. + add_filter( 'dynamic_sidebar_params', function($arg) { + if($arg[0]['widget_name'] === 'Block'){ + $arg[0]['before_form'] = ''; + $arg[0]['before_widget_content'] = '
'; + $arg[0]['after_widget_content'] = '
'; + $arg[0]['after_form'] = '
'; + } + return $arg; + } ); } } From 2e12e695d617654f8326feeaf34636a8aad87fc6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adam=20Zieli=C5=84ski?= Date: Thu, 27 Aug 2020 16:59:28 +0200 Subject: [PATCH 2/6] Hide the save button on widget blocks --- gutenberg.php | 2 +- lib/widgets-page.php | 4 ++++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/gutenberg.php b/gutenberg.php index 0e4aaf7aa44749..370a0670cda1e9 100644 --- a/gutenberg.php +++ b/gutenberg.php @@ -198,7 +198,7 @@ function gutenberg_register_widgets() { if($arg[0]['widget_name'] === 'Block'){ $arg[0]['before_form'] = ''; $arg[0]['before_widget_content'] = '
'; - $arg[0]['after_widget_content'] = '
'; + $arg[0]['after_widget_content'] = ''; $arg[0]['after_form'] = '
'; } return $arg; diff --git a/lib/widgets-page.php b/lib/widgets-page.php index 408dd217b66855..abf0a1cc540ebd 100644 --- a/lib/widgets-page.php +++ b/lib/widgets-page.php @@ -39,6 +39,10 @@ function gutenberg_widgets_init( $hook ) { if ( 'widgets.php' === $hook ) { wp_enqueue_style( 'wp-block-library' ); wp_enqueue_style( 'wp-block-library-theme' ); + wp_add_inline_style( + 'wp-block-library-theme', + '.block-widget-form .widget-control-save { display: none; }' + ); return; } if ( ! in_array( $hook, array( 'gutenberg_page_gutenberg-widgets', 'gutenberg_customizer' ), true ) ) { From dc01aa73a536be9a9812dd26a55546285c7db566 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adam=20Zieli=C5=84ski?= Date: Thu, 27 Aug 2020 17:23:32 +0200 Subject: [PATCH 3/6] Add inline CSS to both widgets.php AND the customizer --- lib/widgets-page.php | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/lib/widgets-page.php b/lib/widgets-page.php index abf0a1cc540ebd..88c681dda52f9e 100644 --- a/lib/widgets-page.php +++ b/lib/widgets-page.php @@ -36,13 +36,11 @@ class="blocks-widgets-container * @param string $hook Page. */ function gutenberg_widgets_init( $hook ) { + $inline_css = '.block-widget-form .widget-control-save { display: none; }'; if ( 'widgets.php' === $hook ) { wp_enqueue_style( 'wp-block-library' ); wp_enqueue_style( 'wp-block-library-theme' ); - wp_add_inline_style( - 'wp-block-library-theme', - '.block-widget-form .widget-control-save { display: none; }' - ); + wp_add_inline_style( 'wp-block-library-theme', $inline_css ); return; } if ( ! in_array( $hook, array( 'gutenberg_page_gutenberg-widgets', 'gutenberg_customizer' ), true ) ) { @@ -122,5 +120,6 @@ function gutenberg_widgets_init( $hook ) { wp_enqueue_script( 'wp-format-library' ); wp_enqueue_style( 'wp-edit-widgets' ); wp_enqueue_style( 'wp-format-library' ); + wp_add_inline_style( 'wp-format-library', $inline_css ); } add_action( 'admin_enqueue_scripts', 'gutenberg_widgets_init' ); From b90cd6a0794eb134d478cd5ee3e4bf0519ebf3f3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adam=20Zieli=C5=84ski?= Date: Thu, 27 Aug 2020 17:30:27 +0200 Subject: [PATCH 4/6] Only hide the save button on widgets.php --- gutenberg.php | 41 +++++++++++++++++++++++++---------------- lib/widgets-page.php | 7 ++++--- 2 files changed, 29 insertions(+), 19 deletions(-) diff --git a/gutenberg.php b/gutenberg.php index 370a0670cda1e9..3687e30d594138 100644 --- a/gutenberg.php +++ b/gutenberg.php @@ -186,23 +186,32 @@ function register_site_icon_url( $response ) { * Registers the WP_Widget_Block widget */ function gutenberg_register_widgets() { - if ( gutenberg_is_experiment_enabled( 'gutenberg-widget-experiments' ) ) { - register_widget( 'WP_Widget_Block' ); - // By default every widget on widgets.php is wrapped with a
. - // This means that you can sometimes end up with invalid HTML, e.g. when - // one of the widgets is a Search block. - // - // To fix the problem, let's add a filter that moves the form below the actual - // widget content. - add_filter( 'dynamic_sidebar_params', function($arg) { - if($arg[0]['widget_name'] === 'Block'){ - $arg[0]['before_form'] = ''; - $arg[0]['before_widget_content'] = '
'; - $arg[0]['after_widget_content'] = '
'; - $arg[0]['after_form'] = '
'; + if ( ! gutenberg_is_experiment_enabled( 'gutenberg-widget-experiments' ) ) { + return; + } + + register_widget( 'WP_Widget_Block' ); + // By default every widget on widgets.php is wrapped with a
. + // This means that you can sometimes end up with invalid HTML, e.g. when + // one of the widgets is a Search block. + // + // To fix the problem, let's add a filter that moves the form below the actual + // widget content. + global $pagenow; + if ( 'widgets.php' === $pagenow ) { + add_filter( + 'dynamic_sidebar_params', + function ( $arg ) { + if ( 'Block' === $arg[0]['widget_name'] ) { + $arg[0]['before_form'] = ''; + $arg[0]['before_widget_content'] = '
'; + $arg[0]['after_widget_content'] = '
'; + $arg[0]['after_form'] = '
'; + } + + return $arg; } - return $arg; - } ); + ); } } diff --git a/lib/widgets-page.php b/lib/widgets-page.php index 88c681dda52f9e..abf0a1cc540ebd 100644 --- a/lib/widgets-page.php +++ b/lib/widgets-page.php @@ -36,11 +36,13 @@ class="blocks-widgets-container * @param string $hook Page. */ function gutenberg_widgets_init( $hook ) { - $inline_css = '.block-widget-form .widget-control-save { display: none; }'; if ( 'widgets.php' === $hook ) { wp_enqueue_style( 'wp-block-library' ); wp_enqueue_style( 'wp-block-library-theme' ); - wp_add_inline_style( 'wp-block-library-theme', $inline_css ); + wp_add_inline_style( + 'wp-block-library-theme', + '.block-widget-form .widget-control-save { display: none; }' + ); return; } if ( ! in_array( $hook, array( 'gutenberg_page_gutenberg-widgets', 'gutenberg_customizer' ), true ) ) { @@ -120,6 +122,5 @@ function gutenberg_widgets_init( $hook ) { wp_enqueue_script( 'wp-format-library' ); wp_enqueue_style( 'wp-edit-widgets' ); wp_enqueue_style( 'wp-format-library' ); - wp_add_inline_style( 'wp-format-library', $inline_css ); } add_action( 'admin_enqueue_scripts', 'gutenberg_widgets_init' ); From 1bcbda66fa4e39aead844783a05df069f9c0229e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adam=20Zieli=C5=84ski?= Date: Thu, 27 Aug 2020 17:32:25 +0200 Subject: [PATCH 5/6] Use a named function instead of anonymous one --- gutenberg.php | 22 ++++++++++++---------- 1 file changed, 12 insertions(+), 10 deletions(-) diff --git a/gutenberg.php b/gutenberg.php index 3687e30d594138..f6c85e8e0534e5 100644 --- a/gutenberg.php +++ b/gutenberg.php @@ -201,18 +201,20 @@ function gutenberg_register_widgets() { if ( 'widgets.php' === $pagenow ) { add_filter( 'dynamic_sidebar_params', - function ( $arg ) { - if ( 'Block' === $arg[0]['widget_name'] ) { - $arg[0]['before_form'] = ''; - $arg[0]['before_widget_content'] = '
'; - $arg[0]['after_widget_content'] = '
'; - $arg[0]['after_form'] = '
'; - } - - return $arg; - } + 'gutenberg_override_sidebar_params_for_block_widget' ); } } +function gutenberg_override_sidebar_params_for_block_widget( $arg ) { + if ( 'Block' === $arg[0]['widget_name'] ) { + $arg[0]['before_form'] = ''; + $arg[0]['before_widget_content'] = '
'; + $arg[0]['after_widget_content'] = '
'; + $arg[0]['after_form'] = '
'; + } + + return $arg; +} + add_action( 'widgets_init', 'gutenberg_register_widgets' ); From c4432f5bd5aed124d2ee2e32b8f4501c17151aa8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adam=20Zieli=C5=84ski?= Date: Fri, 28 Aug 2020 10:29:39 +0200 Subject: [PATCH 6/6] Lint --- gutenberg.php | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/gutenberg.php b/gutenberg.php index f6c85e8e0534e5..e6a0c32099d909 100644 --- a/gutenberg.php +++ b/gutenberg.php @@ -206,6 +206,12 @@ function gutenberg_register_widgets() { } } +/** + * Overrides dynamic_sidebar_params to make sure Blocks are not wrapped in
tag. + * + * @param array $arg Dynamic sidebar params. + * @return array Updated dynamic sidebar params. + */ function gutenberg_override_sidebar_params_for_block_widget( $arg ) { if ( 'Block' === $arg[0]['widget_name'] ) { $arg[0]['before_form'] = '';