Skip to content

Instantly share code, notes, and snippets.

@annezazu
Last active April 18, 2024 16:45
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save annezazu/d62acd2514cea558be6cea97fe28ff3c to your computer and use it in GitHub Desktop.
Save annezazu/d62acd2514cea558be6cea97fe28ff3c to your computer and use it in GitHub Desktop.
An example of a pattern with content locking implemented.
function register_block_patterns() {
if ( class_exists( 'WP_Block_Patterns_Registry' ) ) {
$content = '<!-- wp:group {"templateLock":"contentOnly","align":"wide","layout":{"type":"constrained"}} -->
<div class="wp-block-group alignwide"><!-- wp:image {"align":"wide","id":501,"sizeSlug":"full","linkDestination":"none","style":{"color":{"duotone":["#1a4548","#ffffff"]}}} -->
<figure class="wp-block-image alignwide size-full"><img src="https://s.w.org/patterns/files/2021/06/Group-17-scaled.jpg" alt="Image of a woman being carried through the air by swans." class="wp-image-501"/></figure>
<!-- /wp:image -->
<!-- wp:columns {"verticalAlignment":"center","align":"wide"} -->
<div class="wp-block-columns alignwide are-vertically-aligned-center"><!-- wp:column {"verticalAlignment":"center"} -->
<div class="wp-block-column is-vertically-aligned-center"><!-- wp:paragraph {"style":{"typography":{"lineHeight":"2"}}} -->
<p style="line-height:2"><strong>Location:</strong><br>82 Main St. Brooklyn, NY</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"center"} -->
<div class="wp-block-column is-vertically-aligned-center"><!-- wp:paragraph {"style":{"typography":{"lineHeight":"2"}}} -->
<p style="line-height:2"><strong>Date:</strong><br>October 24, 2021</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"center"} -->
<div class="wp-block-column is-vertically-aligned-center"><!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"primary","width":100,"style":{"color":{"text":"#efefef"}}} -->
<div class="wp-block-button has-custom-width wp-block-button__width-100"><a class="wp-block-button__link has-primary-background-color has-text-color has-background wp-element-button" style="color:#efefef">Purchase Tickets</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->';
register_block_pattern(
'custompattern/call-to-action-adventure',
array(
'title' => __( 'Custom Event', 'textdomain' ),
'description' => _x( 'A custom event.', 'Block pattern description', 'textdomain' ),
'content' => trim($content),
'categories' => array( 'buttons' ),
'keywords' => array( 'cta' ),
'viewportWidth' => 1400,
'blockTypes' => array( 'core/buttons' ),
)
);
}
}
add_action( 'init', 'register_block_patterns' );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment