Block Pattern

Pulvinar phasellus nec bibendum

Nulla dapibus nam ultricies a felis maecenas cursus eros elit, nascetur mauris dolor curae lorem ornare viverra accumsan orci, dignissim posuere at cum etiam convallis vestibulum volutpat.

Code

ソースコード右上のボタンをクリックするとソースコードをクリップボードにコピーすることができます。

そして、Shift + ⌘ + Vスタイルを合わせてあなたのWordPress編集画面にペーストすることで同じものを用意することができます。

					<!-- wp:group {"backgroundColor":"lightest-grey"} -->
<div class="wp-block-group has-lightest-grey-background-color has-background">
<!-- wp:columns -->
<div class="wp-block-columns">
<!-- wp:column {"width":"66.66%"} -->
<div class="wp-block-column" style="flex-basis:66.66%">
<!-- wp:heading {"level":3,"textColor":"accent-color"} -->
<h3 class="has-accent-color-color has-text-color">Pulvinar phasellus nec bibendum</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Nulla dapibus nam ultricies a felis maecenas cursus eros elit, nascetur mauris dolor curae lorem ornare viverra accumsan orci, dignissim posuere at cum etiam convallis vestibulum volutpat.</p>
<!-- /wp:paragraph -->
</div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center","width":"33.33%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:33.33%">
<!-- wp:buttons -->
<div class="wp-block-buttons">
<!-- wp:button {"backgroundColor":"accent-color","width":100,"style":{"border":{"radius":0}}} -->
<div class="wp-block-button has-custom-width wp-block-button__width-100">
<a class="wp-block-button__link has-accent-color-background-color has-background no-border-radius">Button</a>
</div>
<!-- /wp:button -->
</div>
<!-- /wp:buttons -->
</div>
<!-- /wp:column -->
</div>
<!-- /wp:columns -->
</div>
<!-- /wp:group -->
				

You can copy the code by clicking on the button in the top right corner.
Then Paste and Match Style with Shift + ⌘ + V in your WordPress editor.