From a7f03524a8266cb14ac90e536434cff0ed87379f Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Fri, 7 May 2021 15:24:33 -0400 Subject: [PATCH 01/17] Add header & footer patterns. --- lib/block-patterns.php | 219 ++++++++++++++++++++++++++++++++++++++++- 1 file changed, 218 insertions(+), 1 deletion(-) diff --git a/lib/block-patterns.php b/lib/block-patterns.php index 4b7cdcc4b209c6..f37eb458822e7f 100644 --- a/lib/block-patterns.php +++ b/lib/block-patterns.php @@ -11,6 +11,8 @@ function register_gutenberg_patterns() { // Register categories used for block patterns. register_block_pattern_category( 'query', array( 'label' => __( 'Query', 'gutenberg' ) ) ); + register_block_pattern_category( 'page-header', array( 'label' => __( 'Page Header', 'gutenberg' ) ) ); + register_block_pattern_category( 'page-footer', array( 'label' => __( 'Page Footer', 'gutenberg' ) ) ); // Initial Query block patterns. register_block_pattern( @@ -182,6 +184,222 @@ function register_gutenberg_patterns() { ', ) ); + + // Initial Template Part block patterns. + register_block_pattern( + 'template-part/header-site-title-navigation', + array( + 'title' => __( 'Header with title and navigation', 'gutenberg' ), + 'categories' => array( 'page-header' ), + 'blockTypes' => array( 'core/template-part/header' ), + 'content' => ' + + ', + ) + ); + + register_block_pattern( + 'template-part/header-two-navigation-areas', + array( + 'title' => __( 'Header with two navigation areas and logo', 'gutenberg' ), + 'categories' => array( 'page-header' ), + 'blockTypes' => array( 'core/template-part/header' ), + 'content' => ' +
+
+ + +
+ + +
+
+ ', + ) + ); + + register_block_pattern( + 'template-part/header-with-social-links', + array( + 'title' => __( 'Header with social links', 'gutenberg' ), + 'categories' => array( 'page-header' ), + 'blockTypes' => array( 'core/template-part/header' ), + 'content' => ' +
+
+ + +
+ + +
+ +
+
+ ', + ) + ); + + register_block_pattern( + 'template-part/header-large-image', + array( + 'title' => __( 'Header with large image', 'gutenberg' ), + 'categories' => array( 'page-header' ), + 'blockTypes' => array( 'core/template-part/header' ), + 'content' => ' +
+
+
+ + + +
+
+ + + + + + + +
+
+

' . esc_html__( 'A stable climate, a sustainable diverse life, and a source of culture.', 'default' ) . '

+ + + + +
+
+ + + +
+
+ ', + ) + ); + + register_block_pattern( + 'template-part/footer-navigation-credit', + array( + 'title' => __( 'Footer with navigation and credit line', 'gutenberg' ), + 'categories' => array( 'page-footer' ), + 'blockTypes' => array( 'core/template-part/footer' ), + 'content' => ' +
+
+ + +
+

' . esc_html__( 'Proudly powered by WordPress', 'default' ) . '

+
+
+ ', + ) + ); + + register_block_pattern( + 'template-part/footer-centered-navigation', + array( + 'title' => __( 'Centered footer with navigation', 'gutenberg' ), + 'categories' => array( 'page-footer' ), + 'blockTypes' => array( 'core/template-part/footer' ), + 'content' => ' + + + + +

' . esc_html__( 'Powered by WordPress', 'default' ) . '

+ + ', + ) + ); + + register_block_pattern( + 'template-part/footer-latest-posts', + array( + 'title' => __( 'Footer with latest posts', 'gutenberg' ), + 'categories' => array( 'page-footer' ), + 'blockTypes' => array( 'core/template-part/footer' ), + 'content' => ' +
+ + + + + + + +
+
+ + +
+

' . esc_html__( '© 2021 Nature, The Earth', 'default' ) . '

+
+
+ + + +
+ ', + ) + ); + + register_block_pattern( + 'template-part/footer-modern', + array( + 'title' => __( 'Modern footer with description and logo', 'gutenberg' ), + 'categories' => array( 'page-footer' ), + 'blockTypes' => array( 'core/template-part/footer' ), + 'content' => ' +
+
+

ABOUT US

+ + +

' . esc_html__( 'Shape & Form has been around since 2003. Its current iteration includes a photography blog, an art gallery dedicated to found geometric shapes, and a store that sells t-shirts.', 'default' ) . '

+ + + + + +

' . esc_html__( '© Shape & Form', 'default' ) . '

+
+ + +
+ + +
+
+ ', + ) + ); + + // Initial block pattern to be used with block transformations with patterns. + register_block_pattern( + 'social-links/shared-background-color', + array( + 'title' => __( 'Social links with a shared background color', 'gutenberg' ), + 'categories' => array( 'buttons' ), + 'blockTypes' => array( 'core/social-links' ), + 'viewportWidth' => 500, + 'content' => ' + + ', + ) + ); } /** @@ -235,7 +453,6 @@ function update_core_patterns() { } } - add_action( 'init', function() { From 723e53e2fa9a1a9739245d319b17cdf48bd5db27 Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Fri, 14 May 2021 09:51:54 -0400 Subject: [PATCH 02/17] Cleanup, add another header pattern. --- lib/block-patterns.php | 38 ++++++++++++++++++++++++++++++++------ 1 file changed, 32 insertions(+), 6 deletions(-) diff --git a/lib/block-patterns.php b/lib/block-patterns.php index f37eb458822e7f..161fab1f104f0c 100644 --- a/lib/block-patterns.php +++ b/lib/block-patterns.php @@ -210,14 +210,14 @@ function register_gutenberg_patterns() { 'categories' => array( 'page-header' ), 'blockTypes' => array( 'core/template-part/header' ), 'content' => ' -
-
+
+
- -
+ +
', ) @@ -287,14 +287,40 @@ function register_gutenberg_patterns() { ) ); + register_block_pattern( + 'template-part/header-large-image', + array( + 'title' => __( 'Header with large image', 'gutenberg' ), + 'categories' => array( 'page-header' ), + 'blockTypes' => array( 'core/template-part/header' ), + 'content' => ' +
+ + + + + + + + + + + + + +
+ ', + ) + ); + register_block_pattern( 'template-part/footer-navigation-credit', array( 'title' => __( 'Footer with navigation and credit line', 'gutenberg' ), 'categories' => array( 'page-footer' ), 'blockTypes' => array( 'core/template-part/footer' ), - 'content' => ' -
+ 'content' => ' +
From 66f7d34520605a097a69c442b574c1cd815b13ad Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Fri, 14 May 2021 11:02:49 -0400 Subject: [PATCH 03/17] Smal fixes. --- lib/block-patterns.php | 47 +++++++++++++++++++++++++++++++++++------- 1 file changed, 40 insertions(+), 7 deletions(-) diff --git a/lib/block-patterns.php b/lib/block-patterns.php index 161fab1f104f0c..6388a089ded443 100644 --- a/lib/block-patterns.php +++ b/lib/block-patterns.php @@ -271,7 +271,7 @@ function register_gutenberg_patterns() {
-

' . esc_html__( 'A stable climate, a sustainable diverse life, and a source of culture.', 'default' ) . '

+

' . esc_html__( 'Our natural environment provides endless opportunities for adventure.', 'default' ) . '

@@ -288,9 +288,9 @@ function register_gutenberg_patterns() { ); register_block_pattern( - 'template-part/header-large-image', + 'template-part/header-tagline-and-image', array( - 'title' => __( 'Header with large image', 'gutenberg' ), + 'title' => __( 'Header with tagline and image', 'gutenberg' ), 'categories' => array( 'page-header' ), 'blockTypes' => array( 'core/template-part/header' ), 'content' => ' @@ -313,6 +313,30 @@ function register_gutenberg_patterns() { ) ); + register_block_pattern( + 'template-part/modern-header-with-image-on-the-right', + array( + 'title' => __( 'Modern header with image on the right', 'gutenberg' ), + 'categories' => array( 'page-header' ), + 'blockTypes' => array( 'core/template-part/header' ), + 'content' => ' +
+ + + + + + + + + + + +
+ ', + ) + ); + register_block_pattern( 'template-part/footer-navigation-credit', array( @@ -339,12 +363,21 @@ function register_gutenberg_patterns() { 'categories' => array( 'page-footer' ), 'blockTypes' => array( 'core/template-part/footer' ), 'content' => ' + + + + + +

' . esc_html__( 'Powered by WordPress', 'default' ) . '

- ', ) ); @@ -359,7 +392,7 @@ function register_gutenberg_patterns() {
- + @@ -386,8 +419,8 @@ function register_gutenberg_patterns() { 'title' => __( 'Modern footer with description and logo', 'gutenberg' ), 'categories' => array( 'page-footer' ), 'blockTypes' => array( 'core/template-part/footer' ), - 'content' => ' -
+ 'content' => ' +

ABOUT US

From ab074c3c1fabd467de127db5070e65f8344c20bf Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Fri, 14 May 2021 11:11:09 -0400 Subject: [PATCH 04/17] Add social links to one of the footer patterns. --- lib/block-patterns.php | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/lib/block-patterns.php b/lib/block-patterns.php index 6388a089ded443..486336def045f3 100644 --- a/lib/block-patterns.php +++ b/lib/block-patterns.php @@ -357,9 +357,9 @@ function register_gutenberg_patterns() { ); register_block_pattern( - 'template-part/footer-centered-navigation', + 'template-part/footer-centered-navigation-social', array( - 'title' => __( 'Centered footer with navigation', 'gutenberg' ), + 'title' => __( 'Centered footer with navigation and social links', 'gutenberg' ), 'categories' => array( 'page-footer' ), 'blockTypes' => array( 'core/template-part/footer' ), 'content' => ' From 2ceb81e6a4b0d3d8fdb5b9b744d0b91b5bcbf70b Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Fri, 14 May 2021 11:39:30 -0400 Subject: [PATCH 05/17] Minor cleanup. --- lib/block-patterns.php | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/lib/block-patterns.php b/lib/block-patterns.php index 486336def045f3..c755c797544219 100644 --- a/lib/block-patterns.php +++ b/lib/block-patterns.php @@ -364,6 +364,10 @@ function register_gutenberg_patterns() { 'blockTypes' => array( 'core/template-part/footer' ), 'content' => ' + + + +
@@ -425,13 +429,13 @@ function register_gutenberg_patterns() {

ABOUT US

-

' . esc_html__( 'Shape & Form has been around since 2003. Its current iteration includes a photography blog, an art gallery dedicated to found geometric shapes, and a store that sells t-shirts.', 'default' ) . '

+

' . esc_html__( 'This website has been around since 2003. Its current iteration includes a photography blog, an art gallery dedicated to found geometric shapes, and a store that sells t-shirts.', 'default' ) . '

-

' . esc_html__( '© Shape & Form', 'default' ) . '

+

' . esc_html__( '© The Earth', 'default' ) . '

From 0f097f6dd6738998161c2b7ab8bc97336b177aaa Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Fri, 14 May 2021 12:12:59 -0400 Subject: [PATCH 06/17] Fix alignments and spacing. --- lib/block-patterns.php | 22 +++++++++++++--------- 1 file changed, 13 insertions(+), 9 deletions(-) diff --git a/lib/block-patterns.php b/lib/block-patterns.php index c755c797544219..a8b63cabd05ad4 100644 --- a/lib/block-patterns.php +++ b/lib/block-patterns.php @@ -214,7 +214,7 @@ function register_gutenberg_patterns() {
-
+
@@ -288,13 +288,13 @@ function register_gutenberg_patterns() { ); register_block_pattern( - 'template-part/header-tagline-and-image', + 'template-part/centered-header-background-color', array( - 'title' => __( 'Header with tagline and image', 'gutenberg' ), + 'title' => __( 'Centered page header with background color', 'gutenberg' ), 'categories' => array( 'page-header' ), 'blockTypes' => array( 'core/template-part/header' ), - 'content' => ' -
+ 'content' => ' +
@@ -308,8 +308,8 @@ function register_gutenberg_patterns() { -
- ', +
+ ', ) ); @@ -332,7 +332,11 @@ function register_gutenberg_patterns() { -
+ + + + +
', ) ); @@ -362,7 +366,7 @@ function register_gutenberg_patterns() { 'title' => __( 'Centered footer with navigation and social links', 'gutenberg' ), 'categories' => array( 'page-footer' ), 'blockTypes' => array( 'core/template-part/footer' ), - 'content' => ' + 'content' => ' From 042e4e7393664949a89f0591d89b44113eea6c15 Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Fri, 14 May 2021 12:19:41 -0400 Subject: [PATCH 07/17] Fix missing translation + escape function. --- lib/block-patterns.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/block-patterns.php b/lib/block-patterns.php index a8b63cabd05ad4..d8d59547e9f240 100644 --- a/lib/block-patterns.php +++ b/lib/block-patterns.php @@ -430,7 +430,7 @@ function register_gutenberg_patterns() { 'content' => '
-

ABOUT US

+

' . esc_html__( 'ABOUT US', 'default' ) . '

' . esc_html__( 'This website has been around since 2003. Its current iteration includes a photography blog, an art gallery dedicated to found geometric shapes, and a store that sells t-shirts.', 'default' ) . '

From 57b93b002e5cd4205a410ed6fd17beddf17d5bdf Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Tue, 18 May 2021 10:30:06 -0400 Subject: [PATCH 08/17] Add responsive navigation to the patterns where it makes sense. --- lib/block-patterns.php | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/lib/block-patterns.php b/lib/block-patterns.php index dd954ef5503054..1b2fcd9e48cf71 100644 --- a/lib/block-patterns.php +++ b/lib/block-patterns.php @@ -197,7 +197,7 @@ function register_gutenberg_patterns() {
-
+
', ) @@ -231,7 +231,7 @@ function register_gutenberg_patterns() { 'blockTypes' => array( 'core/template-part/header' ), 'content' => '
-
+
@@ -260,7 +260,7 @@ function register_gutenberg_patterns() { -
+
@@ -308,7 +308,7 @@ function register_gutenberg_patterns() { -
+
', ) ); From 24cff8cf3b6435cfc31555b1d760f5b55fb24a1f Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Wed, 26 May 2021 10:47:50 -0400 Subject: [PATCH 09/17] Remove custom colors from the simple patterns. --- lib/block-patterns.php | 22 ++++++++++++---------- 1 file changed, 12 insertions(+), 10 deletions(-) diff --git a/lib/block-patterns.php b/lib/block-patterns.php index ef651d58af07d1..b1d6d19c4608b2 100644 --- a/lib/block-patterns.php +++ b/lib/block-patterns.php @@ -192,12 +192,13 @@ function register_gutenberg_patterns() { 'title' => __( 'Header with title and navigation', 'gutenberg' ), 'categories' => array( 'page-header' ), 'blockTypes' => array( 'core/template-part/header' ), - 'content' => ' -