How to Configure and Style Team Member #
Team Member helps you to add credibility to your website. You do not want to present your website as a faceless entity. With Team Members element you get to present your team to your site-visitors in an interactive manner. Introduce your team members with a short profile.
How to Activate Team Member #
To use this Sastra Addons element, find the ‘Team Member‘ element from the Search option under the ‘ELEMENTS‘ tab. Simply just Drag & Drop the ‘Team Member’ into the ‘Drag widget here‘ or the ‘+’ section.
After you are successfully done with step 1, this is how the element is going to look like.
How to Configure the Content Settings #
Under the ‘Content’ tab, you are able to configure the ‘Team Member’ element.
Content #
From the ‘Content’ section, you can add a team member and add ‘Name’, ‘Job’ & ‘Description’ for each of the members. You are able to change the HTML Tag for ‘Name’ of the Team Members from this section
Moreover, you can use the toggle to display or hide ‘Divider’. you can change the position of divider (After Job and Before Job) as well.
Social Media #
From the ‘Social Media’ section, If you use the toggle to enable ‘Show Social Media’, you can add the social media profile links for each of the members as well. Besides, you can use the toggle to enable open in new window and you can then change it to your preferred icon as well.
Button #
Here, in the Button section under the Content tab, you can use the toggle to display or hide ‘Button’. you can change the text of button.
You can add your own link so that users will be redirected to that certain page.
Click to see Live Demo #
How to Style Team Member #
To customize Team Member, click on the ‘Style’ tab, and you will find many different options here.
Image #
From this section, you change your ‘Image’ width, image resolution and you can add Border & add styling to it as well.
Content #
Here, in the Content section under the Style tab, you can customize the style of the content, change background and padding. You can also change the color, typography, distance and alignment of Name, Job, Description and Divider as well.
Social Media #
You have the freedom to modify the ‘Color, Background color & Border color’ for each social media icons with hovered and normal options. You can change font size, box size, distance, transition duration, shadow and alignment.
Moreover, you can add Border & add styling with radius to it as well.
Button #
From the ‘Button’ option, you can play around with the change the typography, padding , alignment and transition duration. You can also set different text color, background color, border type and radius, and box shadow with normal and hovered options for your Button.
By default, the None button style is in action. There are more than 45+ styles available to choose from. Each style is unique and comes with a different set of animation effects. You can see the animation effects by hovering over the button.
Final Outcome #
By following the basic steps and a bit more modifying, you can style your Team Member as per your preference.
With the help of Team Member, this is how you can showcase information about your employees or colleagues on your website in a beautiful layout.
Getting stuck? Feel to Contact Our Support for further assistance.
