Make new WordPress installations use blocks in widget areas instead of widgets

Modifies `wp_install_defaults()` so that when you install a new WordPress site you
have block in your widget areas, not widgets.

Fixes #53324.
Props isabel_brison, hellofromtonya, andraganescu.

Built from https://develop.svn.wordpress.org/trunk@51088


git-svn-id: http://core.svn.wordpress.org/trunk@50697 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-admin/includes/upgrade.php

@@ -403,59 +403,13 @@ Commenter avatars come from <a href="https://gravatar.com">Gravatar</a>.'
 
 		// Set up default widgets for default theme.
 		update_option(
-			'widget_search',
+			'widget_block',
 			array(
-				2              => array( 'title' => '' ),
+				2              => array( 'content' => '<!-- wp:search /-->' ),
-				'_multiwidget' => 1,
+				3              => array( 'content' => '<!-- wp:group --><div class="wp-block-group"><!-- wp:heading --><h2>' . __( 'Recent Posts' ) . '</h2><!-- /wp:heading --><!-- wp:latest-posts /--></div><!-- /wp:group -->' ),
-			)
+				4              => array( 'content' => '<!-- wp:group --><div class="wp-block-group"><!-- wp:heading --><h2>' . __( 'Recent Comments' ) . '</h2><!-- /wp:heading --><!-- wp:latest-comments {"displayAvatar":false,"displayDate":false,"displayExcerpt":false} /--></div><!-- /wp:group -->' ),
-		);
+				5              => array( 'content' => '<!-- wp:group --><div class="wp-block-group"><!-- wp:heading --><h2>' . __( 'Archives' ) . '</h2><!-- /wp:heading --><!-- wp:archives /--></div><!-- /wp:group -->' ),
-		update_option(
+				6              => array( 'content' => '<!-- wp:group --><div class="wp-block-group"><!-- wp:heading --><h2>' . __( 'Categories' ) . '</h2><!-- /wp:heading --><!-- wp:categories /--></div><!-- /wp:group -->' ),
-			'widget_recent-posts',
-			array(
-				2              => array(
-					'title'  => '',
-					'number' => 5,
-				),
-				'_multiwidget' => 1,
-			)
-		);
-		update_option(
-			'widget_recent-comments',
-			array(
-				2              => array(
-					'title'  => '',
-					'number' => 5,
-				),
-				'_multiwidget' => 1,
-			)
-		);
-		update_option(
-			'widget_archives',
-			array(
-				2              => array(
-					'title'    => '',
-					'count'    => 0,
-					'dropdown' => 0,
-				),
-				'_multiwidget' => 1,
-			)
-		);
-		update_option(
-			'widget_categories',
-			array(
-				2              => array(
-					'title'        => '',
-					'count'        => 0,
-					'hierarchical' => 0,
-					'dropdown'     => 0,
-				),
-				'_multiwidget' => 1,
-			)
-		);
-		update_option(
-			'widget_meta',
-			array(
-				2              => array( 'title' => '' ),
 				'_multiwidget' => 1,
 			)
 		);
@@ -464,18 +418,18 @@ Commenter avatars come from <a href="https://gravatar.com">Gravatar</a>.'
 			array(
 				'wp_inactive_widgets' => array(),
 				'sidebar-1'           => array(
-					0 => 'search-2',
+					0 => 'block-2',
-					1 => 'recent-posts-2',
+					1 => 'block-3',
-					2 => 'recent-comments-2',
+					2 => 'block-4',
 				),
 				'sidebar-2'           => array(
-					0 => 'archives-2',
+					0 => 'block-5',
-					1 => 'categories-2',
+					1 => 'block-6',
-					2 => 'meta-2',
 				),
 				'array_version'       => 3,
 			)
 		);
+
 		if ( ! is_multisite() ) {
 			update_user_meta( $user_id, 'show_welcome_panel', 1 );
 		} elseif ( ! is_super_admin( $user_id ) && ! metadata_exists( 'user', $user_id, 'show_welcome_panel' ) ) {

wp-content/themes/twentytwentyone/assets/css/ie.css

@@ -7360,12 +7360,60 @@ h1.page-title {
 	clear: both;
 }
 
-.widget-title {
+.widget h1 {
-	font-size: 1.125rem;
 	font-weight: 700;
 	line-height: 1.4;
 }
 
+.widget h2 {
+	font-weight: 700;
+	line-height: 1.4;
+}
+
+.widget h3 {
+	font-weight: 700;
+	line-height: 1.4;
+}
+
+.widget h4 {
+	font-weight: 700;
+	line-height: 1.4;
+}
+
+.widget h5 {
+	font-weight: 700;
+	line-height: 1.4;
+}
+
+.widget h6 {
+	font-weight: 700;
+	line-height: 1.4;
+}
+
+.widget h1 {
+	font-size: 1.25rem;
+}
+
+.widget h2 {
+	font-size: 1.125rem;
+}
+
+.widget h3 {
+	font-size: 1rem;
+}
+
+.widget h4 {
+	font-size: 1rem;
+}
+
+.widget h5 {
+	font-size: 1rem;
+}
+
+.widget h6 {
+	font-size: 1rem;
+}
+
 .search-form {
 	display: flex;
 	flex-wrap: wrap;

wp-content/themes/twentytwentyone/assets/sass/06-components/widgets.scss

@@ -75,10 +75,41 @@
 	}
 }
 
-.widget-title {
+.widget {
-	font-size: var(--global--font-size-sm);
+
-	font-weight: var(--widget--font-weight-title);
+	h1,
-	line-height: var(--widget--line-height-title);
+	h2,
+	h3,
+	h4,
+	h5,
+	h6 {
+		font-weight: var(--widget--font-weight-title);
+		line-height: var(--widget--line-height-title);
+	}
+
+	h1 {
+		font-size: var(--global--font-size-md);
+	}
+
+	h2 {
+		font-size: var(--global--font-size-sm);
+	}
+
+	h3 {
+		font-size: var(--global--font-size-xs);
+	}
+
+	h4 {
+		font-size: var(--global--font-size-xs);
+	}
+
+	h5 {
+		font-size: var(--global--font-size-xs);
+	}
+
+	h6 {
+		font-size: var(--global--font-size-xs);
+	}
 }
 
 // Search widget styles

wp-content/themes/twentytwentyone/style-rtl.css

@@ -5444,12 +5444,40 @@ h1.page-title {
 	clear: both;
 }
 
-.widget-title {
+.widget h1,
-	font-size: var(--global--font-size-sm);
+.widget h2,
+.widget h3,
+.widget h4,
+.widget h5,
+.widget h6 {
 	font-weight: var(--widget--font-weight-title);
 	line-height: var(--widget--line-height-title);
 }
 
+.widget h1 {
+	font-size: var(--global--font-size-md);
+}
+
+.widget h2 {
+	font-size: var(--global--font-size-sm);
+}
+
+.widget h3 {
+	font-size: var(--global--font-size-xs);
+}
+
+.widget h4 {
+	font-size: var(--global--font-size-xs);
+}
+
+.widget h5 {
+	font-size: var(--global--font-size-xs);
+}
+
+.widget h6 {
+	font-size: var(--global--font-size-xs);
+}
+
 .search-form {
 	display: flex;
 	flex-wrap: wrap;

wp-content/themes/twentytwentyone/style.css

@@ -5480,12 +5480,40 @@ h1.page-title {
 	clear: both;
 }
 
-.widget-title {
+.widget h1,
-	font-size: var(--global--font-size-sm);
+.widget h2,
+.widget h3,
+.widget h4,
+.widget h5,
+.widget h6 {
 	font-weight: var(--widget--font-weight-title);
 	line-height: var(--widget--line-height-title);
 }
 
+.widget h1 {
+	font-size: var(--global--font-size-md);
+}
+
+.widget h2 {
+	font-size: var(--global--font-size-sm);
+}
+
+.widget h3 {
+	font-size: var(--global--font-size-xs);
+}
+
+.widget h4 {
+	font-size: var(--global--font-size-xs);
+}
+
+.widget h5 {
+	font-size: var(--global--font-size-xs);
+}
+
+.widget h6 {
+	font-size: var(--global--font-size-xs);
+}
+
 .search-form {
 	display: flex;
 	flex-wrap: wrap;

wp-includes/version.php

@@ -13,7 +13,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '5.8-alpha-51087';
+$wp_version = '5.8-alpha-51088';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.