Team block

The Team block introduces your team members and adds an invaluable personal touch to your website. The Team blocks have everything you need to showcase the unique skills, expertise, and personalities of your team members, no matter how many of them. Here’s how you can add the Team block to any page of your website.

  1. Choose a location where you want to add a Team block and click on the Add a block + button.
  2. In the Block library, navigate to the Team section in the left-hand vertical menu and click on the block of which the style and design suit your website needs.
  3. The block will be instantly inserted into the page.

Customizing block settings

You can show or remove any element of your Team block. To modify the block settings, click on any area of the block and then click the “gear” Block settings icon:

Screenshot_2021-06-03_at_11.19.14.png

The Block settings menu will appear.

In the Layout tab, you can instantly preview various layouts available for this block type.

In the Appearance tab, you can customize the block's content:

Screen_Shot_2021-04-05_at_11.18.14.png

  • Block style: choose the color scheme of the block (note that all elements will get updated automatically)
  • Block title
  • Person’s photo
  • Person’s bio
  • Person’s social media links and/or email
  • Primary button
  • Secondary button

Once you are happy with the block content, click Save.

 

Customizing block content settings:

In the Appearance tab, you can modify the following settings:

  • Content layout: Choose the number of items in a row (2, 3, or 4)
  • Content style: Customize the style of content in this block.
  • Add a border to the block elements.
  • Add shadow.
  • Media content settingsCustomize the appearance of your image or video by adding a B&W filter or making the images rounded (no need to edit them separately). 

Once you are done modifying the block settings, click Save to apply changes.

Editing images

To replace demo images with your own team photos or other images:

1. Click on the demo team member’s photo.

2. Click on the “picture frame” Edit Image icon:

Screenshot_2021-06-03_at_11.22.16.png

3. Follow the steps in this tutorial: Adding images.

Repeat these steps with other team photos or other images that you want to appear in this block.

Editing job titles and descriptions

You can add a short bio and job descriptions for each member in the Team block. To edit the demo content, simply click on the text element and start typing your new text.

Alternatively, you can copy and paste your existing content from the text editor you are using.

 

Duplicating block elements

If you would like to showcase more team members in this block, you can easily duplicate any of the existing elements. To do that, click on any block element you want to duplicate and then click on the Duplicate icon.

Screenshot_2021-06-03_at_11.23.55.png

The identical block element will be inserted to the right of the original element. The block layout will adjust automatically.

Moving block elements

You can move block elements in any way that meets your website goals. To move the block element, hover over it to bring up the dialog box, and click on the Move icon:

Screenshot_2021-06-03_at_11.25.18.png

Drag the element and drop it on another spot inside the block.

Note: You cannot move elements from one block to a different block.

 

Deleting block elements

You can delete any block element if you have fewer team members to display. To do this, hover over the unwanted element to bring up the dialog box, and click on the “trash can” Delete icon.

You can reverse this action by clicking Undo or pressing Ctrl-Z on your keyboard.

Remember: Click Save to save the changes you have made and Publish to make those changes live.

Other helpful articles

About block

Creating your homepage

Creating text links

Building website forms

Was this article helpful?
0 out of 0 found this helpful