The “Team Member Card Widget” can be used to showcase your staff, employees or any type of people in a card format on your Elementor website. You can add their picture, position, bios and social links fast and easy. It also gives an option to have a call to action button as part of the team member card.
Let’s look at each of the options in the “Team Member Card Widget” below.
Install Team Member Card Widget for Elementor #
This widget requires Unlimited Elements Free version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Team Member Card”
- Hover over the widget in the search results and click install
- Add your “Team Member Card” widget to any Elementor Page
General Settings #
Image
Choose an image to display.
Image Size
Select the image size from the drop-down list
- Medium Large (max width 768)
- Large (max width 1024)
- Medium (max width 300)
- Thumbnail (150x150)
- Full Size
- 1536x1536 (max width 1536)
- 2048x2048 (max width 2048)
- Woocommerce Thumbnail (300x300)
- Woocommerce Single (max width 600)
- Woocommerce Gallery Thumbnail (100x100)
- Shop Catalog (300x300)
- Shop Single (max width 600)
- Shop Thumbnail (100x100)
Title
Type a title for member card.
Sub Title
Type the sub title.
Text
Type your text to display.
Button Link
Paste your URL to link with the button.
Button Text
Type custom text for button.
Company Logo Image
Select the company logo to display.
Layout Settings #
Image Placement
Set the placement of Image.
- Hide
- Header
- Content
- Footer
Title Placement
Set the placement of Title.
- Hide
- Header
- Content
- Footer
Subtitle Placement
Set the placement of subtitle.
- Hide
- Header
- Content
- Footer
Company Logo
Set the placement of company logo.
- None
- Header
- Content
- Footer
Text Placement
Set the placement of text.
- Hide
- Header
- Content
- Footer
Icons Placement
Set the placement of icon.
- Hide
- Header
- Content
- Footer
Button Placement
Set the placement of button.
- Hide
- Header
- Content
- Footer
Show Header
Show/Hide the header element.
Show Footer
Show/Hide the footer.
Items Settings #
Manage the items to display on team member card using the repeater field.
- Add new items
- Duplicate items
- Delete items
- Reorder Items
- Edit Items
Title
Type the title.
Icon
Choose an icon to display.
Link
Paste your URL to link with the icon.
Team Member Card Widget Styling #
Every aspect of the widget’s design can be controlled through different styling options. Choose colors that complement the style of your website. You can modify the text, icons, fonts, and layout to make the widget look and work the way you want.
Card Styling #
Set the card radius, border, and shadow.
Card Background Styling #
In this section, style the card background using different options.
Image Styling #
You can set the image width, height, radius, margin, border, and alignment.
Content Styling #
In this section, set the content alignment, and padding.
Title Styling #
Style the title color, typography, shadow, and spacing.
Subtitle Styling #
Here, you can set sub title color, typography, shadow, and spacing.
Company Logo Styling #
You can set the logo height, spacing, and logo fit.
Text Styling #
Set the text color, typography, shadow, and spacing.
Icons Styling #
Style the icon alignment, size, border, radius, spacing, margin and color.
Icons Hover Styling #
You can style the icon hover color, border hover, background hover, and hover effect.
Header Styling #
This section lets you set header alignment, padding, background, and border.
Footer Styling #
You can set the footer background, padding, alignment, and border.
Button Styling #
You can style the button typography, padding, background color, text color, spacing, and border.
Usage Examples #
Here are some live use cases for the Team Member Card Widget.
