Recently my client asked for a different kind of gallery. He wanted to have multiple galleries in a single page. As I was fiddling with different options, I found Divi Toggle Module can be of some use.

Resource:

You need Divi, Images for Gallery & Lightbox plugin from Huge-IT.

Procedure:

  • Create a page with a standard row and a four column structure.
  • Make following changes in Row module settings (Image 1):
    • Make This Row Fullwidth: Yes
    • Use Custom Gutter Width: 2
  • In each column put a toggle. You may create multiple toggles in each column (Image 2).
  • In each toggle, Put a title which will be displayed as the title of the gallery.
  • In content area of the toggle create a WordPress gallery and in gallery settings, Link To Media File (Image 3).
  • Put following CSS in epanel:
.et_pb_toggle_open {
    box-shadow: 8px 8px 5px grey;
}
.et_pb_toggle_close {
    box-shadow: 5px 5px 3px grey;
}
  • Install Huge-IT Lightbox plugin and in the configuration page of the plugin, set Lightbox Style to 4 (Image 4).

Reference Images:

New Gallery in Action

New Gallery in Action