Skip to content
Anchor Theme
Component Guide

Grid - Team Members

Back to Components Overview

The Grid – Team Members component allows administrators to hand-pick specific team members from the ‘Team Members’ post type to display. Each instance of this component can showcase a different set of team members, making it useful for splitting team members by office, country, department, or other criteria.

This component offers a range of configuration options, divided into the following categories:

Settings This section includes general settings that are common across all components within the system:

  • Hide on Mobile/Tablet/Desktop: Pick whether to hide, or show this component independently on mobile, tablet, and desktop resolutions via a set of three checkboxes.
  • Desktop/Mobile Padding: Adjust the top and bottom padding for both desktop and mobile views.
  • Section Background Colour: Choose a background colour from a pre-configured list of brand colours.
  • Section Width: Control the width of the component.
Animation Administrators can choose from seven entrance animation options for the grid:

  • None
  • Slide in from the top
  • Slide in from the bottom
  • Slide in from the left
  • Slide in from the right
  • Fade in
  • Grow in
Pod Styling This section allows administrators to customise the appearance of each team member pod:

  • Pod Background Colour: Choose the background colour for the team member pods, which can differ from the overall component background. Option values are based on a pre-configured list of brand colours.
  • Pod Style: Select how the team member pods will be rendered. Available styles include: ‘Full width image above content (3 per row)’, ‘Full width image above content (4 per row)’, ‘Simple – no image (3 per row)’, ‘Simple – no image (4 per row)’, and ‘Image left, content right (2 per row)’.
  • Title Colour: Set the text colour for the team member’s name. Option values are based on a pre-configured list of brand colours.
  • Title Style: Choose the heading size for the team member’s name, with options ranging from Heading 1 to Small Paragraph.
  • Designation Colour: Set the text colour for the team member’s designation (e.g., job title). Option values are based on a pre-configured list of brand colours.
  • Text Colour: Choose the colour for the main content text in the pod. Option values are based on a pre-configured list of brand colours.
  • Button Colour: Set the colour for the ‘Read More’ button. Option values are based on a pre-configured list of brand colours.
  • Button Style: Select the style for the ‘Read More’ button, with options including: Solid, Outline, Outline with slide animation, Underline, and Underline Pulse Animation.
  • Read More Label: Set the label for the ‘Read More’ button, which links to the team member’s profile page. The default label is ‘View Profile.’
Content This section includes a multi-select field where administrators can add, remove, and reorder team members by dragging and dropping them into the desired order.

 

You can view examples of the Grid – Team Members component in various styles and animations here.