Example Block Pattern HTML for https://permanenttourist.ch/2021/02/easier-block-patterns-using-template-parts/
<!-- wp:columns {"align":"wide"} --> | |
<div class="wp-block-columns alignwide"><!-- wp:column --> | |
<div class="wp-block-column"><!-- wp:group --> | |
<div class="wp-block-group"><div class="wp-block-group__inner-container"><!-- wp:image {"sizeSlug":"large"} --> | |
<figure class="wp-block-image size-large"><img src="https://sayhello.ch/gutenberg-demo-image-do-not-delete.jpg" alt=""/></figure> | |
<!-- /wp:image --> | |
<!-- wp:heading --> | |
<h2>Lorem Ipsum</h2> | |
<!-- /wp:heading --> | |
<!-- wp:paragraph --> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | |
<!-- /wp:paragraph --> | |
<!-- wp:paragraph --> | |
<p><a href="#">Read more</a></p> | |
<!-- /wp:paragraph --></div></div> | |
<!-- /wp:group --></div> | |
<!-- /wp:column --> | |
<!-- wp:column --> | |
<div class="wp-block-column"><!-- wp:group --> | |
<div class="wp-block-group"><div class="wp-block-group__inner-container"><!-- wp:image {"sizeSlug":"large"} --> | |
<figure class="wp-block-image size-large"><img src="https://sayhello.ch/gutenberg-demo-image-do-not-delete.jpg" alt=""/></figure> | |
<!-- /wp:image --> | |
<!-- wp:heading --> | |
<h2>Lorem Ipsum</h2> | |
<!-- /wp:heading --> | |
<!-- wp:paragraph --> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | |
<!-- /wp:paragraph --> | |
<!-- wp:paragraph --> | |
<p><a href="#">Read more</a></p> | |
<!-- /wp:paragraph --></div></div> | |
<!-- /wp:group --></div> | |
<!-- /wp:column --> | |
<!-- wp:column --> | |
<div class="wp-block-column"><!-- wp:group --> | |
<div class="wp-block-group"><div class="wp-block-group__inner-container"><!-- wp:image {"sizeSlug":"large"} --> | |
<figure class="wp-block-image size-large"><img src="https://sayhello.ch/gutenberg-demo-image-do-not-delete.jpg" alt=""/></figure> | |
<!-- /wp:image --> | |
<!-- wp:heading --> | |
<h2>Lorem Ipsum</h2> | |
<!-- /wp:heading --> | |
<!-- wp:paragraph --> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | |
<!-- /wp:paragraph --> | |
<!-- wp:paragraph --> | |
<p><a href="#">Read more</a></p> | |
<!-- /wp:paragraph --></div></div> | |
<!-- /wp:group --></div> | |
<!-- /wp:column --> | |
<!-- wp:column --> | |
<div class="wp-block-column"><!-- wp:group --> | |
<div class="wp-block-group"><div class="wp-block-group__inner-container"><!-- wp:image {"sizeSlug":"large"} --> | |
<figure class="wp-block-image size-large"><img src="https://sayhello.ch/gutenberg-demo-image-do-not-delete.jpg" alt=""/></figure> | |
<!-- /wp:image --> | |
<!-- wp:heading --> | |
<h2>Lorem Ipsum</h2> | |
<!-- /wp:heading --> | |
<!-- wp:paragraph --> | |
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | |
<!-- /wp:paragraph --> | |
<!-- wp:paragraph --> | |
<p><a href="#">Read more</a></p> | |
<!-- /wp:paragraph --></div></div> | |
<!-- /wp:group --></div> | |
<!-- /wp:column --></div> | |
<!-- /wp:columns --> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment