This tutorial shows you how to add a portfolio to a web page using the Divi Visual Builder.  This module is great for displaying photos and design pieces.

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!

Transcript from the Divi Tutorial

Click on the gray plus sign and click on add portfolio module.




This module is going to pull from your projects, so you may need to go in and add some projects if you see that nothing is displaying.




Choose which layout you want to use. In the diagram below, I selected the grid layout. People can click on the tabs for more information.




Select a topic in your portfolio and click on the posts slot, then select how many files within the folder you want to be shown.




In the design options, you have various options for presenting your portfolio on your website. You can change the zoom icon color and the hover overlay. The wording and font may be changed into any format you want.




In this particular Divi template, you can’t use the CSS style sheets for the background and border. To do so:

Go into the CSS, and go down to Portfolio Title. Put in a custom CSS for some padding on the edges of the icon pictures.





Tutorial and transcript done by, Jimi Blevins, with Mozaic Technology
Transcript edited by, Alexis Stucker