Meet the Team WordPress Shortcode Plugin & Visual Composer Element

Stylish Circles

Here’re some modern examples of team members

Classic Layout in a Responsive Carousel

For the traditional type. You can specify a vertical or horizontal layout. This is the vertical layout with a wide image size.

Responsive Grid with Captions

If you have a large team, then you can display all your people in a cool grid like this. We chose here to show all the positions of each team member and zero grid gap.

Be Creative – Adjust to Any Size & Color

Below is 200×600 Avatars with White Overlays, Razzmatazz Links, 1 Pixel Gaps and Displayed as a Responsive Carousel.. Nice!

Be Simple

This one’s a 150×150 with Circular Avatars, and We’ve Selected these 3 Members to be Displayed

Be Adventurous

The shortcode is usable with other post types. Use it for your posts, pages and custom post types.

Using the Shortcode

You can use the meet_the_team shortcode using, by default, using this shortcode will display all available team members. Use these arguments below customize the display (if you have Visual Composer, you can use the Meet the Team element there, no need to memorize these paramteres)

Parameter Default Type Description
id string The ID of the Team Member to display, or multiple IDs separated by commas. Use this to display a single or a specific number of members.
team string The slug of a Team. Use this to display all team members of a group.
design vertical string The design of the team member list. Values can be vertical, horizontal or gallery. Vertical & horizontal can display an excerpt. Use gallery to display the team member photos with cool design options (more of this below).
layout grid string grid or carousel. Grid displays all of your members in multiple rows. Carousel displays your members in a single row in a responsive carousel.
links true boolean If true, links to each team member profile will be shown. Use false to hide the links.
num_per_row 2 number The number of team members to display in a single row. Used for grid & carousel layouts.
avatar_size medium string The feature image size of each member. WordPress sizes: thumbnail, medium, large or full. Or specific width x height strings such as 400×400 or 600×400. The avatars will shrink to accomodate the available width.
avatar_shape square string square or circle. If circle, the avatars will have a round border. Make sure that the avatar_size above is of square dimensions if you use circle.
gap 10 number The gap spacing between each team member in your grid / carousel.
display string A comma separated list of the details to display for each team member. The values can be name, position, avatar, description and social. Defaults to show all details. Descriptions will never be displayed in gallery designs.
post_type team_member string By default, the team_member custom post types are used, but you can also use other post types such as post and page. However, social icons and other member details will not be available for display.

If you use a gallery design, these parameters will become available:

Parameter Default Type Description
gallery_design_type half string half, bottom or full. The type of design to use for the gallery.
gallery_overlay_color #000000 hex color The color of the overlay – the background used to display the team member’s details.
gallery_overlay_opacity 0.5 float The opacity of the overlay. Value can be from 0.0 to 1.0
gallery_text_color #dddddd hex color The color of the text details
gallery_link_color #ffffff hex color The color of the links in the details
gallery_show_on hover string hover or always. Show the overlay & details only on hover, or always show the details.
gallery_text_align center string center, left or right. The alignment of the details inside the overlay.

Using the Shortcode

Stylish Circles
[meet_the_team team="your-team-slug" links="true" post_type="team_member" avatar_shape="circle" avatar_size="400x400" gallery_text_align="center" layout="grid" num_per_row="4" gap="30" design="gallery" gallery_design_type="full" gallery_overlay_color="#ffffff" gallery_overlay_opacity=".8" gallery_show_on="hover" gallery_link_color="#d64541" gallery_text_color="#576665"]
Classic Layout in a Responsive Carousel
[meet_the_team links="true" post_type="team_member" avatar_shape="square" avatar_size="500x300" gallery_text_align="center" layout="carousel" num_per_row="2" gap="40" design="vertical" gallery_design_type="half" gallery_overlay_color="#000000" gallery_overlay_opacity=".5" gallery_show_on="always" gallery_link_color="#ffffff" gallery_text_color="#dddddd" team="Your-Team-Slug"]
Responsive Grid with Captions
[meet_the_team display="avatar,name,position" links="true" post_type="team_member" avatar_shape="square" avatar_size="400x400" gallery_text_align="right" layout="grid" num_per_row="4" gap="0" design="gallery" gallery_design_type="bottom" gallery_overlay_color="#000000" gallery_overlay_opacity=".5" gallery_show_on="always" gallery_link_color="#22a7f0" gallery_text_color="#ffffff" team="Your-Team-Slug"]
Be Creative – Adjust to Any Size & Color
[meet_the_team display="avatar,name,social" links="true" post_type="team_member" avatar_shape="square" avatar_size="200x400" gallery_text_align="center" layout="carousel" num_per_row="6" gap="1" design="gallery" gallery_design_type="full" gallery_overlay_color="#ffffff" gallery_overlay_opacity=".7" gallery_show_on="hover" gallery_link_color="#db0a5b" gallery_text_color="#606060" team="Your-Team-Slug"]
Be Simple
[meet_the_team display="avatar,name,position,social" links="true" post_type="team_member" avatar_shape="circle" avatar_size="150x150" gallery_text_align="center" layout="grid" num_per_row="3" gap="30" design="vertical" gallery_design_type="half" gallery_overlay_color="#000000" gallery_overlay_opacity=".5" gallery_show_on="always" gallery_link_color="#ffffff" gallery_text_color="#dddddd" id="ID1,ID2,ID3"]
Be Adventurous
[meet_the_team display="avatar,name,position,social" links="true" post_type="post" avatar_shape="circle" avatar_size="250x250" gallery_text_align="center" layout="grid" num_per_row="3" gap="50" design="gallery" gallery_design_type="full" gallery_overlay_color="#ffffff" gallery_overlay_opacity=".6" gallery_show_on="always" gallery_link_color="#913d88" gallery_text_color="#636363" id="ID1,ID2,ID3,ID4,ID5,ID6"]