This tutorial shows you how to add a person using the Divi Visual Builder for WordPress.  This person module works great for staff, authors, and individual information.

Take A Test Drive

Sign up for a 15 day free trial to our powerful WordPress Hosting Platform.  Take advantage of everything we have to offer for free.  No credit card required!

Text Version Of This Divi Tutorial

_________________________________________________________________________________________________________

Hello, this is Jimi Blevins and today I’m going to show you how to: “Add Your Personal Profile To A Web Page Using The Divi Visual Builder.

Let’s go ahead and “Add” (+) in our person module by selecting the gray (+) sign and searching for “Person.”

HowToAddYourPersonalProfileToAWebpage

This will bring up a list of options to add individually. This is something you would use if you had a staff page or a page where you want to list out people.

HowToAddAPersonalProfileToYourWebpage2

So, you’ve got your “Name,” you’ve got your “Position,” and then we’re going to go ahead and add a profile picture. We can use “Animation,” “Left To Right.”

Of course, you can put in your social media. (I got my Google+ page pulled up here. So, we’ll pop that in.)

HowToAddAPersonalProfileToYourWebpage3

Then, you’ve got room to do a bio in the “Description” field. I’m just going to grab my bio from the Mozaic Technology website and pop it in there.

HowToAddAPersonalProfileToYourWebpage4

So you can see how this is laid out: you’ve got your name, your title, and then you’ve got your image.

We can also mess with the “Design” elements here a little bit.

HowToAddAPersonalProfileToYourWebpage6

So, we’ve got our “Icon Color,” and “Icon Hoover Color.” (This will change your social media icon, so if I want it to change color when it’s hovered over.)

HowToAddAPersonalProfileToYourWebpage7

We can make the “Header” bigger, and I can also change the “Text Color” of the header.

These are most of the “Design” options that were getting used to seeing with these Divi modules.

We can “Use Background Color,” or I can put a background image to cover the entire thing.
We can also put a “Border,” Custom Margin,” and “Custom Padding.”

HowToAddAPersonalProfileToYourWebpage9

You have a lot of control over how you want to make this element look to dress up your web page.

It’s a really simple module, making it really easy to: “Add Your Personal Profile To A Webpage With The Divi Visual Builder.”

Once again I’m Jimi Blevins and thank you so much.