Team Member
The Team Member module shows one person. It has a photo, a name, a job title, a short bio and social links. Add one module for each person. You can reveal the text on hover, add an overlay on the photo, or open the photo in a lightbox.
How to add the Team Member module
- Add a section and a row, then add the Team Member module.
- Under Content > Content, upload the photo and enter the name, job title and bio.
- Under Content > Social Links, add the profile links you want to show.
Content
Content
- Photo: upload a photo, or enter its URL.
- Photo Alt Text: the alt text for the photo.
- Open Photo in Lightbox: opens the photo in a lightbox when clicked. Off by default.
- Member Name: the person's name.
- Job Title: the person's role.
- Member Bio: a short biography.
Social Links
Enter a full URL in each field. A link is shown only when its field has a value.
- Website URL
- Email Address: shown as a mailto link.
- Facebook URL
- Twitter URL
- Instagram URL
- Linkedin URL
- Github URL
- Behance URL
- Dribbble URL
Settings
- Show Content on Hover: reveals the content area when a visitor hovers the card. Off by default.
- Hover Animation: Slide Bottom, Fade In, Slide Up or Zoom In. Default is Slide Bottom.
- Hover Animation Speed: default 400ms.
- Social Links Hover Position: Relative to the Content or Relative to the Photo. Default is Relative to the Content. With Relative to the Photo, the icons appear over the photo when the visitor hovers the card. This applies only when Show Content on Hover is off.
Design
- Photo: Photo Width, Photo Height, Photo Alignment and Photo Hover Animation. Use Absolute Photo Position places the photo freely with Photo Position, Photo Offset X and Photo Offset Y. That option applies only when Show Content on Hover is off.
- Content: Content Alignment, Content Padding and Content Background. The background is painted over the module Background, so set it to transparent to let the module Background show.
- Overlay: an overlay over the photo on hover, off by default. Set its Speed, Icon, Icon Color, Icon Size, Icon Opacity and Overlay Color.
- Name, Job Title and Bio: font options. Name and Job Title also have a Spacing Bottom setting.
- Social Links: Icon Color, Background, Spacing Between, Top Spacing, Height, Width, Icon Size and Border Radius.