Here is my full 5 Impressive Divi Gallery Layouts and How to Create Them series from the Elegant Themes Blog.
1) How to Create a Fullwidth Gallery with the Divi Gallery Module
Galleries are one of the most important tools in web design today. Whether you’re a designer wanting to showcase your work, a photographer wanting to display your photos, or a business wanting a prominent portfolio–-the need for online galleries goes on and on. With the Divi Gallery Module we can create awesome, eye catching galleries that’ll draw in our website visitors.
In this Divi mini series, we’re going to go over 5 Impressive Divi Gallery Layouts and how to create them. Some of these examples will be fairly simple and will just require some adjustments to the Divi module settings. Other’s will be a little more advanced and will require a little CSS and other customizations.
My hope is that whether you’re a newbie at Divi and web design or if you’re an experienced Divi expert, you’ll be able to apply these ideas and will be inspired to take your Divi galleries to the next level!
2) Using the Divi Gallery Module to Create a Tiled Gallery with Custom Padding
In this second example, we’re going to create a tight-tiled gallery look with custom padding to add a clean and uniform white space between each image. Several of my clients spanning across multiple industries seem to LOVE this layout so I’m excited to share it with you! The majority of the settings we’ll change are in the standard module options, then we’ll just add a little CSS for the custom padding.
3) Creating a Unique Border for your Divi Gallery Module Images
In this third example, we’re going to be using a CSS “clipping mask” to create a nifty little border around our gallery images. If you’re not too familiar with CSS, don’t worry, I’ll provide the code and explain what it’s for and how to use it. If you’re new to CSS, my goal is to make it a little less daunting and for you to see how just a few lines of code can take your designs to the next level.
4) Changing the Number of Columns in the Divi Gallery Module
The Divi Gallery Module automatically puts the Grid style layout in 4 columns, but every once in a while it’d be nice to lay them out in 3, 4, or 6 columns, right? In this post, I’ll show you how! And the good news is…it’s pretty easy!
5) Creating a Grayscale to Color Gallery with the Divi Gallery Module
For this final example, I wanted to share with you an effect that my clients love and is one that took a little creativity and trial and error to achieve. If you’re new to web design or Divi, an effect like this can seem intimidating but I’ll provide step by step instructions below on how to achieve this trendy grayscale-to-color look.
If you have any questions or if this series has helped you out or encouraged you in any way, feel free to leave me a comment below!
Dear Josh
thanks for these posts – the one about columns really helped me out of a fix.
Awesome, Arlene! So glad these posts helped you out. I’m actually working on a free layout of 5, 6, 7, and 8 column layouts for the Divi builder so hopefully that’ll help as well!
Hello Josh, please how can I crop the portrait sized images and all the images to be same size in the thumbnails inside the gallery module.
Unfortunately with the Divi gallery that doesn’t work. I actually use this plugin for advanced galleries!
https://wordpress.org/plugins/final-tiles-grid-gallery-lite/