Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Revisit the bundled block patterns #1103

Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 13 additions & 8 deletions src/wp-includes/block-patterns.php
Original file line number Diff line number Diff line change
Expand Up @@ -19,16 +19,21 @@ function _register_core_block_patterns_and_categories() {

if ( $should_register_core_patterns ) {
$core_block_patterns = array(
'media-text-nature',
'two-images-gallery',
'three-columns-media-text',
'quote',
'large-header-left',
'large-header-text-button',
'media-text-art',
'text-two-columns-title',
'three-columns-text',
'text-two-columns-title-offset',
'heading',
'three-images-gallery',
'text-two-columns',
'media-text-arquitecture',
'two-buttons',
'two-images',
'text-two-columns-with-images',
'text-three-columns-buttons',
'large-header',
'large-header-button',
'three-buttons',
'heading-paragraph',
'quote',
);

foreach ( $core_block_patterns as $core_block_pattern ) {
Expand Down
14 changes: 0 additions & 14 deletions src/wp-includes/block-patterns/heading-paragraph.php

This file was deleted.

16 changes: 16 additions & 0 deletions src/wp-includes/block-patterns/heading.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
<?php
/**
* Heading.
*
* @package WordPress
*/

return array(
'title' => _x( 'Heading', 'Block pattern title' ),
'categories' => array( 'text' ),
'blockTypes' => array( 'core/heading' ),
'content' => '<!-- wp:heading {"align":"wide","style":{"typography":{"fontSize":"48px","lineHeight":"1.1"}}} -->
<h2 class="alignwide" style="font-size:48px;line-height:1.1">' . esc_html__( "We're a studio in Berlin with an international practice in architecture, urban planning and interior design. We believe in sharing knowledge and promoting dialogue to increase the creative potential of collaboration." ) . '</h2>
<!-- /wp:heading -->',
'description' => _x( 'Heading text', 'Block pattern description' ),
);
14 changes: 0 additions & 14 deletions src/wp-includes/block-patterns/large-header-button.php

This file was deleted.

33 changes: 33 additions & 0 deletions src/wp-includes/block-patterns/large-header-left.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
<?php
/**
* Large header with left-aligned text.
*
* @package WordPress
*/

return array(
'title' => _x( 'Large header with left-aligned text', 'Block pattern title' ),
'categories' => array( 'header' ),
'content' => '<!-- wp:cover {"url":"https://s.w.org/images/core/5.8/forest.jpg","id":null,"dimRatio":60,"minHeight":800,"align":"full"} -->
<div class="wp-block-cover alignfull has-background-dim-60 has-background-dim" style="min-height:800px"><img class="wp-block-cover__image-background " alt="" src="https://s.w.org/images/core/5.8/forest.jpg" data-object-fit="cover"/><div class="wp-block-cover__inner-container"><!-- wp:heading {"align":"wide","style":{"color":{"text":"#ffe074"},"typography":{"fontSize":"64px"}}} -->
<h2 class="alignwide has-text-color" style="color:#ffe074;font-size:64px">' . esc_html__( 'Forest.' ) . '</h2>
<!-- /wp:heading -->

<!-- wp:columns {"align":"wide"} -->
<div class="wp-block-columns alignwide"><!-- wp:column {"width":"55%"} -->
<div class="wp-block-column" style="flex-basis:55%"><!-- wp:spacer {"height":330} -->
<div style="height:330px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer -->

<!-- wp:paragraph {"style":{"color":{"text":"#ffe074"},"typography":{"lineHeight":"1.3","fontSize":"12px"}}} -->
<p class="has-text-color" style="color:#ffe074;font-size:12px;line-height:1.3"><em>' . esc_html__( 'Even a child knows how valuable the forest is. The fresh, breathtaking smell of trees. Echoing birds flying above that dense magnitude. A stable climate, a sustainable diverse life and a source of culture. Yet, forests and other ecosystems hang in the balance, threatened to become croplands, pasture, and plantations.' ) . '</em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div></div>
<!-- /wp:cover -->',
'description' => _x( 'Cover image with quote on top', 'Block pattern description' ),
);
35 changes: 35 additions & 0 deletions src/wp-includes/block-patterns/large-header-text-button.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
<?php
/**
* Large header with text and a button.
*
* @package WordPress
*/

return array(
'title' => _x( 'Large header with text and a button.', 'Block pattern title' ),
'categories' => array( 'header' ),
'content' => '<!-- wp:cover {"url":"https://s.w.org/images/core/5.8/art-01.jpg","id":null,"hasParallax":true,"dimRatio":40,"customOverlayColor":"#000000","minHeight":100,"minHeightUnit":"vh","contentPosition":"center center","align":"full"} -->
<div class="wp-block-cover alignfull has-background-dim-40 has-background-dim has-parallax" style="background-color:#000000;background-image:url(https://s.w.org/images/core/5.8/art-01.jpg);min-height:100vh"><div class="wp-block-cover__inner-container"><!-- wp:heading {"style":{"typography":{"fontSize":"48px","lineHeight":"1.2"}},"className":"alignwide has-white-color has-text-color"} -->
<h2 class="alignwide has-white-color has-text-color" style="font-size:48px;line-height:1.2"><strong><em>' . esc_html__( 'Overseas:' ) . '</em></strong><br><strong><em>' . esc_html__( '1500 — 1960' ) . '</em></strong></h2>
<!-- /wp:heading -->

<!-- wp:columns {"align":"wide"} -->
<div class="wp-block-columns alignwide"><!-- wp:column {"width":"60%"} -->
<div class="wp-block-column" style="flex-basis:60%"><!-- wp:paragraph {"style":{"color":{"text":"#ffffff"}}} -->
<p class="has-text-color" style="color:#ffffff">' . wp_kses_post( __( 'An exhibition about the different representations of the ocean throughout time, between the sixteenth and the twentieth century. Taking place in our Open Room in <em>Floor 2</em>.' ) ) . '</p>
<!-- /wp:paragraph -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"borderRadius":0,"style":{"color":{"text":"#ffffff","background":"#000000"}},"className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-text-color has-background no-border-radius" style="background-color:#000000;color:#ffffff">' . esc_html__( 'Visit' ) . '</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div></div>
<!-- /wp:cover -->',
'description' => _x( 'Large header with background image and text and button on top', 'Block pattern description' ),
);
14 changes: 0 additions & 14 deletions src/wp-includes/block-patterns/large-header.php

This file was deleted.

21 changes: 21 additions & 0 deletions src/wp-includes/block-patterns/media-text-arquitecture.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<?php
/**
* Media and text with image on the right.
*
* @package WordPress
*/

return array(
'title' => _x( 'Media and text with image on the right', 'Block pattern title' ),
'categories' => array( 'header' ),
'content' => '<!-- wp:media-text {"align":"full","mediaId":null,"mediaType":"image","verticalAlignment":"center"} -->
<div class="wp-block-media-text alignfull is-stacked-on-mobile is-vertically-aligned-center"><figure class="wp-block-media-text__media"><img src="https://s.w.org/images/core/5.8/architecture-04.jpg" alt="' . esc_attr__( 'Close-up, abstract view of architecture.' ) . '"/></figure><div class="wp-block-media-text__content"><!-- wp:heading {"textAlign":"center","level":3,"style":{"color":{"text":"#000000"}}} -->
<h3 class="has-text-align-center has-text-color" style="color:#000000"><strong>' . esc_html__( 'Open Spaces' ) . '</strong></h3>
<!-- /wp:heading -->

<!-- wp:paragraph {"align":"center","fontSize":"extra-small"} -->
<p class="has-text-align-center has-extra-small-font-size"><a href="#">' . esc_html__( 'See case study ↗' ) . '</a></p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:media-text -->',
'description' => _x( 'Media and text block with image to the left and text to the right', 'Block pattern description' ),
);
21 changes: 21 additions & 0 deletions src/wp-includes/block-patterns/media-text-art.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<?php
/**
* Media & text with image on the right.
*
* @package WordPress
*/

return array(
'title' => _x( 'Media & text with image on the right', 'Block pattern title' ),
'categories' => array( 'header' ),
'content' => '<!-- wp:media-text {"align":"full","mediaPosition":"right","mediaId":null,"mediaLink":"#","mediaType":"image","mediaWidth":56,"verticalAlignment":"center","className":"is-style-default"} -->
<div class="wp-block-media-text alignfull has-media-on-the-right is-stacked-on-mobile is-vertically-aligned-center is-style-default" style="grid-template-columns:auto 56%"><figure class="wp-block-media-text__media"><img src="https://s.w.org/images/core/5.8/art-02.jpg" alt="' . esc_attr__( 'A green and brown rural landscape leading into a bright blue ocean and slightly cloudy sky, done in oil paints.' ) . '"/></figure><div class="wp-block-media-text__content"><!-- wp:heading {"style":{"color":{"text":"#000000"}}} -->
<h2 class="has-text-color" style="color:#000000"><strong>' . esc_html__( 'Shore with Blue Sea' ) . '</strong></h2>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.1","fontSize":"17px"},"color":{"text":"#636363"}}} -->
<p class="has-text-color" style="color:#636363;font-size:17px;line-height:1.1">' . esc_html__( 'Eleanor Harris&nbsp;(American, 1901-1942)' ) . '</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:media-text -->',
'description' => _x( 'Media and text block with image to the right and text to the left', 'Block pattern description' ),
);
28 changes: 28 additions & 0 deletions src/wp-includes/block-patterns/media-text-nature.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<?php
/**
* Media & text in a full height container.
*
* @package WordPress
*/

return array(
'title' => _x( 'Media & text in a full height container', 'Block pattern title' ),
'categories' => array( 'header' ),
'content' => '<!-- wp:cover {"customOverlayColor":"#ffffff","minHeight":100,"minHeightUnit":"vh","contentPosition":"center center","align":"full"} -->
<div class="wp-block-cover alignfull has-background-dim" style="background-color:#ffffff;min-height:100vh"><div class="wp-block-cover__inner-container"><!-- wp:media-text {"mediaId":null,"mediaLink":"https://s.w.org/images/core/5.8/soil.jpg","mediaType":"image","mediaWidth":56,"verticalAlignment":"center","imageFill":true} -->
<div class="wp-block-media-text alignwide is-stacked-on-mobile is-vertically-aligned-center is-image-fill" style="grid-template-columns:56% auto"><figure class="wp-block-media-text__media" style="background-image:url(https://s.w.org/images/core/5.8/soil.jpg);background-position:50% 50%"><img src="https://s.w.org/images/core/5.8/soil.jpg" alt="' . esc_attr__( 'Close-up of dried, cracked earth.' ) . '"/></figure><div class="wp-block-media-text__content"><!-- wp:heading {"style":{"typography":{"fontSize":"32px"},"color":{"text":"#000000"}}} -->
<h2 class="has-text-color" style="color:#000000;font-size:32px"><strong>' . esc_html__( "What's the problem?" ) . '</strong></h2>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"typography":{"fontSize":"17px"},"color":{"text":"#000000"}}} -->
<p class="has-text-color" style="color:#000000;font-size:17px">' . esc_html__( 'Trees are more important today than ever before. More than 10,000 products are reportedly made from trees. Through chemistry, the humble woodpile is yielding chemicals, plastics and fabrics that were beyond comprehension when an axe first felled a Texas tree.' ) . '</p>
<!-- /wp:paragraph -->
<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link">' . esc_html__( 'Learn more' ) . '</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div></div>
<!-- /wp:media-text --></div></div>
<!-- /wp:cover -->',
'description' => _x( 'Media and text block with image to the left and text and button to the right', 'Block pattern description' ),
);
28 changes: 22 additions & 6 deletions src/wp-includes/block-patterns/quote.php
Original file line number Diff line number Diff line change
@@ -1,14 +1,30 @@
<?php
/**
* Quote block pattern.
* Quote.
*
* @package WordPress
*/

return array(
'title' => __( 'Quote' ),
'content' => "<!-- wp:group -->\n<div class=\"wp-block-group\"><div class=\"wp-block-group__inner-container\"><!-- wp:image {\"align\":\"center\",\"width\":164,\"height\":164,\"sizeSlug\":\"large\",\"className\":\"is-style-rounded\"} -->\n<div class=\"wp-block-image is-style-rounded\"><figure class=\"aligncenter size-large is-resized\"><img src=\"https://s.w.org/images/core/5.5/don-quixote-03.jpg\" alt=\"" . __( 'Pencil drawing of Don Quixote' ) . "\" width=\"164\" height=\"164\"/></figure></div>\n<!-- /wp:image -->\n\n<!-- wp:quote {\"align\":\"center\",\"className\":\"is-style-large\"} -->\n<blockquote class=\"wp-block-quote has-text-align-center is-style-large\"><p>" . __( '"Do you see over yonder, friend Sancho, thirty or forty hulking giants? I intend to do battle with them and slay them."' ) . '</p><cite>' . __( '— Don Quixote' ) . "</cite></blockquote>\n<!-- /wp:quote -->\n\n<!-- wp:separator {\"className\":\"is-style-dots\"} -->\n<hr class=\"wp-block-separator is-style-dots\"/>\n<!-- /wp:separator --></div></div>\n<!-- /wp:group -->",
'viewportWidth' => 800,
'categories' => array( 'text' ),
'description' => _x( 'A quote and citation with an image above, and a separator at the bottom.', 'Block pattern description' ),
'title' => _x( 'Quote', 'Block pattern title' ),
'categories' => array( 'text' ),
'blockTypes' => array( 'core/quote' ),
'content' => '<!-- wp:group -->
<div class="wp-block-group"><div class="wp-block-group__inner-container"><!-- wp:separator {"className":"is-style-default"} -->
<hr class="wp-block-separator is-style-default"/>
<!-- /wp:separator -->

<!-- wp:image {"align":"center","id":null,"width":150,"height":150,"sizeSlug":"large","linkDestination":"none","className":"is-style-rounded"} -->
<div class="wp-block-image is-style-rounded"><figure class="aligncenter size-large is-resized"><img src="https://s.w.org/images/core/5.8/portrait.jpg" alt="' . esc_attr__( 'A side profile of a woman in a russet-colored turtleneck and white bag. She looks up with her eyes closed.' ) . '" width="150" height="150"/></figure></div>
<!-- /wp:image -->

<!-- wp:quote {"align":"center","className":"is-style-large"} -->
<blockquote class="wp-block-quote has-text-align-center is-style-large"><p>' . esc_html__( "\"Contributing makes me feel like I'm being useful to the planet.\"" ) . '</p><cite>' . wp_kses_post( __( '— Anna Wong, <em>Volunteer</em>' ) ) . '</cite></blockquote>
<!-- /wp:quote -->

<!-- wp:separator {"className":"is-style-default"} -->
<hr class="wp-block-separator is-style-default"/>
<!-- /wp:separator --></div></div>
<!-- /wp:group -->',
'description' => _x( 'Testimonial quote with portrait', 'Block pattern description' ),
);
Loading