To help Divi Pixel users create better pages, we designed several sections with team members that can be easily added to your Divi website. This kit includes 8 sections that were designed using Divi Pixel modules. We didn’t limit ourselves when it comes to choosing modules, so you will find Masonry Gallery, Hover Box, Carousel module, Accordion Image… and more. Let’s take a look.

Accodion Image with Custom CSS

This section is using the Accordion Image module. I have set the active image size to 1, so the image doesn’t enlarge on hover (as it normally does in the accordion image module). There is also a bit of custom CSS added to the module settings that make the content background white on hover. We can also see beautiful social icons which were injected into the description using the Divi Library shortcodes.

Tilt Image Team Members

Tilt Image is also a module that can be used to present team members. In the module settings, we can add an image, icon, title, description and button. The module also has a 3D effect and hover scaling options. In this section I’ve also played with Divi Filters, so the image is black and white and colored when hovering over the mouse.

Creative use of Hover Box module

Demo 3 uses the popular Hover Box module. The image of the team member has been added to the background of the module. By hovering over the image, you can see the team member details and social media icons injected with of course Divi Library shortcode. It’s a super-powerful weapon. Using the Divi Library shortcodes allows you to inject any Divi layout saved in the Divi Library into any module on your site.

Mosonry Gallery for Team Members?

It might seem that the Masonry Gallery module is designed to display a photo gallery… Not at all. It can be used for anything! With the option to display the title and description on hover, it’s like a swiss-knife in your arsenal. It’s a great choice for a section with team members too. The image animations available in the Masonry Gallery module will add even more charm.

Team Members Carousel

If your team is large and you don’t want the section with them to take up too much space on your website, the use of a carousel is the most advisable. This example uses a 3-column layout and some custom CSS added to the module settings to highlight the active slide. I added CSS filters and transform property to make the active slide highlighted, and side slides blurred.

… and More Carousel

Here we have another example of a carousel that displays team members in a beautiful and interactive way. This demo uses the new image animations added in the latest version. We have a total of 7 different effects to choose from. Here the Zoom Out effect was used, so when you hover the mouse over, the image gets smaller creating a nice experience.

Display Details with Balloon module

The Divi Pixel Balloon is another module that can be used in the team members section. In this example, we can see a 3 column layout. There is an image module in each column that displays additional information when you hover the mouse over. To show this information, the Balloon module was used.

Carousel with Hover Box

The fact that the Divi Pixel Carousel module works great with layouts stored in the Divi Library makes almost anything possible. We can create carousels with the most sophisticated designs. For this free section, we used 2 Divi Library layouts with three Hover Box modules.

Win A Free Divi Pixel Lifetime License

Get an amazing 30% discount on our Black Friday Sale. If you still hesitate, see what our customers have to say. During the promotion period, you can also take a part in the competition. There are 10 free Divi Pixel licenses worth €399 each waiting for you. Want to win? Subscribe to our newsletter to find out more.

This is it! We hope you enjoy reading this article and we believe that the new features will make your web design process easier. We will soon introduce the new module, so if you don’t want to miss it, subscribe to our newsletter.