A Step-by-Step Guide to Use Team Member Block – Ninja Gutenberg Block

If you have already installed Ninja Gutenberg Block, you can use the Team Member Block in just few click. We have created the advanced feature of using and customizing the Team Member section of your Website Withoiut typing a single line of code! 

Adding Team Members Block

You can add the Team Member block on your page/post in two ways: clicking on the Block Inserter Buttn and Search NB Team Member or on any block type /nb and select NB Team Member. 

Using Block Inserter. 
Using Shortcut

After inserting the Team Member Block of Ninja Gutenberg Blocks, you will get the following screen. 

Team Member Block Initialization

From the above scene, you cna change anything you want. 
Image: If you want to change the image, you can click the image icon and Select an Image. 

Adding an Image to the Team Member Block

Name: You can Type your Team Member’s Name

Adding Name to your Team Member Block

On the most rith side of your editor, while selecting the Team Member Block, you can see lots of options. 

Team Member Block, Options

From the Name Settings, you can change the Name’s font size and color. 

Name Settings

You can select any of the 11 most used color or click on the color wheel/Custom Color Picker to set your personalised color. To reset the color / set it to the default color, press the Clear button. You can choose the font size from the Font Size option. 

Name Setting of Ninja Gutenberg Blocks

Designation: You can add your Team Member’s Designation on the Designation field. Also, you can change the font color and font size if you want. 

Changing the Designation/Post Name of a team member

There are a number of options for the social icons. You can Show or hide the icons, show or hide the top border of the icons, change the background color , borde color, icon color and font size of the social icons. 

Social Setting of Team Member Block

You can change the color settings of the social icons.

Changing Social Icons’ colors 

Adding Social Links:  You can add social sites’ links in a very efficient way. Just click on the icon and add your URL. If you do not wish to show any of the social media icons, you can keep the URL blank and you will not see the social media button in the frontend. 

Adding Link to a Social Icon

Box Color: You can change the container’s border color and the background color. 

Changing the container’s border and background color. 

Multiple Team Members: If you want to add 2/3 teambers in the same row you can do that by adding a column. On the top of the Team Member Block Setting, you can find the option to add multiple team member option. 

Adding Multiple Team Members

Single Team Member Examples

Team member Block




Ninja Gutenberg Blocks

Allan P. Randall

Senior Architect

Ninja Block tem member

Toussaint L’Hiver

Software Engineer

Dual Team Member Examples

Ninja Gutenberg Block

Ulrich Schmitt

SEO Expert

Ninja Gutenberg Block

Yvonne Pfaff

Web Designer

Ninja Gutenberg Block

Ebba Ingveldardóttir

Fashion Designer

Ninja Gutenberg Block

Ageo Aranda Moreno

Chief of Operations

Three in one Row Team Members Examples

Ninja Gutenberg Block

Maclovio U. Sarabia

Sr. JavaScript Engineer

Ninja Gutenberg Block

Claire W. Wooley

Central Integration Developer

Ninja Gutenberg Block

Camille C. Hinson

Marketing Executive 

gutenberg ninja block

Maureen Lovell

Central Team Synergist

Ninja Gutenberg Blocks - Members

Cristiano Harvey

Customer Markets Supervisor

Ninja Gutenberg Blocks - Members

Suzannah Hardin

Senior Brand Specialist

You can also use custom CSS for your team block to make the blocks look even better customized. If you have any query or suggestions, do not hesitate to contact GutenDev in the comment section below; We are always ready to resolve your issues.