Team

Team Block allows displaying team members with a descriptive block. You can display a team with their name, pictures, designation, social links, etc.

How To Add The Team Block

Open a page or a post and click on the plus icon to add a new block and look for the Team or you can search for it if it doesn’t pop up quickly for you.
Be default, you'll get the below design-

How To Configure The Team Block

To configure the Team block, switch to the ‘Content’ tab.

General

Number of Team Member Boxes: Increase or decrease the number of Team members to display.
Stack on: You can stack the boxes on tablet and mobile
Gutter: You can set the gutter between the boxes to small, medium, large, etc.
Box Shadow: You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.
Border Width: Set a width for the border from here.
Border Radius: You can give border-radius to the box from here.
Padding: You can give padding to the content from here.
Column Background: You can choose a background for a column in the block as color, gradient, or image from here.

Content

Here you can enable/disable the following elements of the block

Image
Name
Designation
Description
Social icons

Image

Image Shape: Select the style of image as square, circle, or normal.
Image Size: Select a size for the image as full, medium, large, or thumbnail.
Image Width: Select the width for the image.

By hovering on social icons such as Twitter, Facebook you can give URLs to them.

Hide Social Icons: You can enable/disable the display of social icons.
Social Icon color: You can choose the color of social icons.Icon size - You can choose the size of social icons.
Icon Size: You can also set the size of the icon.

How To Style The Team Block

Switch to the ‘Style’ tab to customize every element of the Team block.

Typography

Under the Typography tab, options for font size, font-weight, color, and line-height are available for Title, Designation, Description, and Social Icon.

Spacing

Spacing tab offer options to customize the spacing for Title Bottom Spacing, Designation Bottom Spacing, Description Bottom Spacing, Inter Social Icon Spacing, Image Margin Top, and Image Margin Bottom.