1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Divi Gallery Customization

Discussion in 'Free Divi Community Forum' started by oknight1999, Sep 20, 2024.

  1. oknight1999

    oknight1999 New Member

    Hi All,

    I am trying to create a custom divi gallery that is commonly available on other website builders (like Wix) and am having some trouble. If you could help me out that would be great!

    Description: Main Gallery page has thumbnail/cover photos that open in a lightbox to individual galleries.

    If you need more explanation let me know or I can provide examples.

    Thanks!
    Olivia
     
    1. PRO MEMBER PERKS Divi Ultimate Header Plugin - Add more varieties for your Divi header (12 premade styles) + menu hover effects:Learn More
  2. Divi Booster

    Divi Booster Divi Expert

    Hey Olivia,

    Hopefully I'm understanding correctly...

    If you set a gallery module to "Slider" mode (at: Gallery Settings > Design > Layout > Layout) then initially only the first image of the gallery is displayed (at the full size of the gallery). If you click on this image it will open the whole gallery in a lightbox where you can click through one image at a time using the navigation arrows.

    One thing you might not want with this set up is the navigation arrows and dots shown on the initial (non-lightbox) view of the gallery. You can hide these as described in the following posts (which describe how to do it using either my Divi Gallery Booster plugin or - towards the end of the posts - CSS code):

    https://divibooster.com/hide-divi-gallery-module-slider-navigation-arrows/
    https://divibooster.com/hide-divi-gallery-module-slider-navigation-dots/

    With that you should get an image on the main page which, when clicked, brings up the full gallery in a lightbox. Obviously repeat this with additional gallery modules on your main gallery page to add further galleries.

    But please correct me if I'm misunderstanding what you need. Thanks!
     
  3. oknight1999

    oknight1999 New Member

    Thank you so much! That is exactly what I meant.

    If I did want to keep scrolling on the main page how would I keep the image size from changing without cropping it?
     
    1. PRO MEMBER PERKS Divi Block Pro - 30+ premade custom header designs for you to choose from:View Demo
  4. Divi Booster

    Divi Booster Divi Expert

    You're welcome, Olivia!

    One way to stop the image size from changing is to set a max height on the gallery which is equal to (or smaller than) the height of your shortest image. You can set it at:

    Gallery Settings > Design > Sizing > Max Height

    The bottom of taller images will be hidden. If your images are reasonably similar in height this shouldn't be too noticeable.

    I hope that helps, but if there are any other changes you'd like to make to the galleries just let us know.