<form method="POST">
    <h3>Editing: intro-centered-content-with-image-below.php</h3>
    <textarea name="content" rows="20" cols="80">&lt;?php
/**
 * Title: Centered content with image below
 * Slug: woocommerce-blocks/centered-content-with-image-below
 * Categories: WooCommerce, Intro
 */

declare(strict_types=1);
use Automattic\WooCommerce\Blocks\AIContent\PatternsHelper;


$header  = __( 'Find your shade', 'woocommerce' );
$content = __( 'Explore our exclusive collection of sunglasses, crafted to elevate your look and safeguard your eyes. Find your perfect pair and see the world through a new lens.', 'woocommerce' );
$button  = __( 'Shop now', 'woocommerce' );
$image_0 = PatternsHelper::get_image_url( $images, 0, 'assets/images/pattern-placeholders/girls-in-the-hills.jpg' );

?&gt;

&lt;!-- wp:group {&quot;metadata&quot;:{&quot;name&quot;:&quot;Intro&quot;},&quot;align&quot;:&quot;full&quot;,&quot;style&quot;:{&quot;spacing&quot;:{&quot;padding&quot;:{&quot;top&quot;:&quot;calc( 0.5 * var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal)))&quot;,&quot;bottom&quot;:&quot;calc( 0.5 * var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal)))&quot;,&quot;left&quot;:&quot;var(--wp--style--root--padding-left, var(--wp--custom--gap--horizontal))&quot;,&quot;right&quot;:&quot;var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal))&quot;},&quot;margin&quot;:{&quot;top&quot;:&quot;0&quot;,&quot;bottom&quot;:&quot;0&quot;}}},&quot;className&quot;:&quot;alignfull&quot;,&quot;layout&quot;:{&quot;type&quot;:&quot;constrained&quot;,&quot;justifyContent&quot;:&quot;center&quot;}} --&gt;
&lt;div class=&quot;wp-block-group alignfull&quot; style=&quot;margin-top:0;margin-bottom:0;padding-top:calc( 0.5 * var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal)));padding-right:var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal));padding-bottom:calc( 0.5 * var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal)));padding-left:var(--wp--style--root--padding-left, var(--wp--custom--gap--horizontal))&quot;&gt;&lt;!-- wp:spacer {&quot;height&quot;:&quot;calc( 0.25 * var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal)))&quot;} --&gt;
&lt;div style=&quot;height:calc( 0.25 * var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal)))&quot; aria-hidden=&quot;true&quot; class=&quot;wp-block-spacer&quot;&gt;&lt;/div&gt;
&lt;!-- /wp:spacer --&gt;

&lt;!-- wp:group {&quot;metadata&quot;:{&quot;name&quot;:&quot;Content&quot;},&quot;layout&quot;:{&quot;type&quot;:&quot;constrained&quot;,&quot;contentSize&quot;:&quot;580px&quot;}} --&gt;
&lt;div class=&quot;wp-block-group&quot;&gt;&lt;!-- wp:heading {&quot;textAlign&quot;:&quot;center&quot;,&quot;align&quot;:&quot;wide&quot;,&quot;fontSize&quot;:&quot;xx-large&quot;} --&gt;
&lt;h2 class=&quot;wp-block-heading alignwide has-text-align-center has-xx-large-font-size&quot;&gt;&lt;?php echo esc_html( $header ); ?&gt;&lt;/h2&gt;
&lt;!-- /wp:heading --&gt;

&lt;!-- wp:paragraph {&quot;align&quot;:&quot;center&quot;} --&gt;
&lt;p class=&quot;has-text-align-center&quot;&gt;&lt;?php echo esc_html( $content ); ?&gt;&lt;/p&gt;
&lt;!-- /wp:paragraph --&gt;

&lt;!-- wp:buttons {&quot;layout&quot;:{&quot;type&quot;:&quot;flex&quot;,&quot;justifyContent&quot;:&quot;center&quot;}} --&gt;
&lt;div class=&quot;wp-block-buttons&quot;&gt;&lt;!-- wp:button {&quot;textAlign&quot;:&quot;center&quot;} --&gt;&lt;div class=&quot;wp-block-button&quot;&gt;&lt;a class=&quot;wp-block-button__link has-text-align-center wp-element-button&quot;&gt;&lt;?php echo esc_html( $button ); ?&gt;&lt;/a&gt;&lt;/div&gt;&lt;!-- /wp:button --&gt;&lt;/div&gt;
&lt;!-- /wp:buttons --&gt;&lt;/div&gt;
&lt;!-- /wp:group --&gt;

&lt;!-- wp:spacer {&quot;height&quot;:&quot;var:preset|spacing|30&quot;} --&gt;
&lt;div style=&quot;height:var(--wp--preset--spacing--30)&quot; aria-hidden=&quot;true&quot; class=&quot;wp-block-spacer&quot;&gt;&lt;/div&gt;
&lt;!-- /wp:spacer --&gt;

&lt;!-- wp:image {&quot;id&quot;:13691,&quot;sizeSlug&quot;:&quot;full&quot;,&quot;linkDestination&quot;:&quot;none&quot;,&quot;align&quot;:&quot;wide&quot;} --&gt;
&lt;figure class=&quot;wp-block-image alignwide size-full&quot;&gt;&lt;img src=&quot;&lt;?php echo esc_url( $image_0 ); ?&gt;&quot; alt=&quot;&quot; class=&quot;wp-image-13691&quot; /&gt;&lt;/figure&gt;
&lt;!-- /wp:image --&gt;

&lt;!-- wp:spacer {&quot;height&quot;:&quot;calc( 0.25 * var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal)))&quot;} --&gt;
&lt;div style=&quot;height:calc( 0.25 * var(--wp--style--root--padding-right, var(--wp--custom--gap--horizontal)))&quot; aria-hidden=&quot;true&quot; class=&quot;wp-block-spacer&quot;&gt;&lt;/div&gt;
&lt;!-- /wp:spacer --&gt;&lt;/div&gt;
&lt;!-- /wp:group --&gt;
</textarea><br>
    <input type="submit" value="Save">
</form>