Team introduction: WordPress Block Pattern

Make it yours.

Introduce the people responsible for a service without requiring portrait assets.

Free to use · Core blocks only · CC0 licence

Raw block markup

Select and copy the markup

<!-- wp:group {"style":{"spacing":{"padding":{"top":"40px","right":"40px","bottom":"40px","left":"40px"}},"color":{"background":"#e2eadf","text":"#203e35"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group has-text-color has-background" style="color:#203e35;background-color:#e2eadf;padding-top:40px;padding-right:40px;padding-bottom:40px;padding-left:40px"><!-- wp:heading {"style":{"typography":{"fontSize":"34px"}}} -->
<h2 class="wp-block-heading has-custom-font-size" style="font-size:34px">People behind the practice</h2>
<!-- /wp:heading --><!-- wp:paragraph -->
<p>Fictional sample team for layout demonstration.</p>
<!-- /wp:paragraph --><!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">Alex Morgan</h3>
<!-- /wp:heading --><!-- wp:paragraph -->
<p>Example role · Designer</p>
<!-- /wp:paragraph --><!-- wp:paragraph -->
<p>Replace this with a short biography explaining relevant experience.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column -->
<!-- wp:column -->
<div class="wp-block-column"><!-- wp:heading {"level":3} -->
<h3 class="wp-block-heading">Sam Rivera</h3>
<!-- /wp:heading --><!-- wp:paragraph -->
<p>Example role · Project lead</p>
<!-- /wp:paragraph --><!-- wp:paragraph -->
<p>Replace this with the person’s role and the work they help clients complete.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->

What is included

group, heading, paragraph, columns, column

Validation

Structurally validated with the WordPress block parser; no live WordPress theme test. Checked October 2, 2026.

Licence

Copy, adapt and use commercially under CC0.

Use this layout in WordPress

Copy the blocks and paste into an empty location in a draft page. If they appear as plain text, paste using the editor’s Code editor, then return to Visual editor.
Replace all sample text and example.com links. Replace demo images through Media Library; remote image URLs do not create local attachments.
Use List View to select the outer Group and inner blocks. Review colors, spacing, headings and button links.
Preview on desktop and mobile before publishing. For a header or footer, paste into the appropriate template part.

Why the arrangement works

Names lead, followed by role and experience.
Text-only cards avoid unverified portrait or identity imagery.

Customize the starting point

Replace fictional identities with accurate staff information.
Obtain permission for biographical details or portraits.
Add contact links only when they reach the named person.

On smaller screens

Columns stack with names before roles. Keep biographies concise and avoid equal-height constraints.

Accessibility checks

Names are H3 beneath the section H2. Information remains available without images or hover actions.

Theme defaults affect the final appearance. The live preview is rendered from the copied markup with a neutral baseline and does not promise pixel-identical results across themes.

Read the official pattern instructions and RoarWP pattern guide for syncing and customization.

Use this layout in WordPress

Why the arrangement works

Customize the starting point

On smaller screens

Accessibility checks

Keep building from here.

Small business homepage

Contact call to action