Divi Person

A more minimal way of showcasing team members and their occupation, with images portraying their professional personality. This is where you can add links to the member’s social media as well. This is good for engaging with clients as they review and get to know the company and the team members.

Content → New Item → Image

Within the Content Tab, you have the option to add New Items and include the Next Person image as shown above.

Content → New Item

Within the New Item, you can link social media links to the person in concern.

Content → Text 

Let’s move on to the Text field and its features:

1. Name – place the name of the person
2. Position – include the company position of the person
3. Body – include description text related to the person in concern

Design → Image 

1. Select Image Position – select between the top and left position
2. Select Image Top/Left Position – based on your selected Image Position, pick between left, center, and right
3. Image Width – adjust the width of the image using the slider
4. Image Round Corners – alter the rounded corners for all four sides
5. Image Border Styles – include border to the image either on all four sides or wherever you prefer

Design → Image (continuation)

1. Image Border Width – adjust the width of the border added to the image
2. Image Border Color – pick a color for the border using the pointer or you can copy/paste the hex code to get the exact color required for the border
3. Image Border Style – select a premade style of border 
4. Image Box Shadow – include a box shadow for the image from the options below

Design → Social Alignment

Social Item Alignment – you can position the social network items either to the left, center, or right.

Design → Title Text 

1. Title Heading Level – Pick a level  
2. Font – Select a font from the collection or use a custom font
3. Font Weight – this is where you define how you want your font to show either regular, italic, bold extra, or even extra light.
4. Font Style – Pick a style of font for both front and back
5. Text Alignment – align the text for both the front and back text
6. Text Color – manually select a color for the background of the text using the pointer or you can simply state the hex code and get the exact color you require.
7. Text Size – easily resize the text for both the front and back parts of the flip box

Design → Title Text (continuation)

1. Letter Spacing – space out the letters using the slider for an easier read for the website visitors
2. Line Height – easily include gaps between the lines using the slider
3. Text Shadow – add text shadow to have the texts highlighted

Design → Body Text 

1. Font – Select a font from the collection or use a custom font
2. Font Weight – this is where you define how you want your font to show either regular, italic, bold extra, or even extra light
3. Font Style – Pick a style of font for both front and back
4. Text Alignment – align the text for both the front and back text
5. Text Color – manually select a color for the background of the text using the pointer or you can simply state the hex code and get the exact color you require.
6. Text Size – easily resize the text for both the front and back parts of the flip box

Design → Body Text (continuation)

1. Letter Spacing – space out the letters using the slider for an easier read for the website visitors
2. Line Height – easily include gaps between the lines using the slider
3. Text Shadow – add text shadow to have the texts highlighted

Design → Position Text 

1. Font – Select a font from the collection or use a custom font
2. Font Weight – this is where you define how you want your font to show either regular, italic, bold extra, or even extra light
3. Font Style – Pick a style of font for both front and back
4. Text Alignment – align the text for both the front and back text
5. Text Color – manually select a color for the background of the text using the pointer or you can simply state the hex code and get the exact color you require.
6. Text Size – easily resize the text for both the front and back parts of the flip box
7. Letter Spacing – space out the letters using the slider for an easier read for the website visitors

Design → Position Text (continuation)

1. Line Height – easily include gaps between the lines using the slider
2. Text Shadow – add text shadow to have the texts highlighted