Tip # 21: A New Type of Gallery

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: