Customize the Height of Your Image Gallery

Customize the Height of Your Image Gallery

All of our slideshow Image Gallery layout types have customizable height attributes that can be set to manually adjust, fit to window, or auto adjust. These design features are great for photographers who are looking for a full bleed aesthetic or have their images fit the window.

Design Considerations: This feature is meant to look best when used without a fixed nav.


How to change an image gallery's height

1. Within Content, find your page with the Image Gallery and open it

2. Select the blue Design this page link and then the Image Gallery on the right-hand side

3. Click into Type and select one of the slideshow layout types (we chose Carousel):

4. Under Height you will have three options depending on the slideshow you choose (Carousel and Thumbnail galleries only have two options):Auto adjust, Fit to window, and Adjust manually

  1. - Choosing Auto is the default setting for the Image Gallery and will automatically size to the webpage to fit your content best.
  2. - Choosing Adjust manually will allow you to enter a pixel height amount if you want your gallery to be a specific height but still span across the screen.
  3. - Choosing Fit to window will expand your gallery as far as it can within the browser window, essentially making it fullscreen or full bleed. 

5. Select Save and Publish to finish.

    • Related Articles

    • Gallery Settings - Fit to window (Video Tutorial)

      How to properly set up your galleries as 'fit to window' or full frame.
    • Customize Your Image Gallery

      Our Image Galleries offer eight different layout types for you to choose from. Read on to see how to customize a slideshow image gallery to preserve aspect ratio with a background color, and view the carousel slideshow option. Create a classic ...
    • Expand Images to Fill Window (Set a Hero Image)

      Note: This option is only available for Emerging, Professional, and Custom plans. This feature is not available on Legacy Hosting or Legacy Professional plans. A Hero Image is an image on your website that is the background for the navigation bar, as ...
    • Add an Image/Image Gallery

      Add an Image or Image Gallery block to your page by using one of our preset content blocks. 1. Select Content in the navbar 2. Select the page you want to add an image to 2. While on the page, click on the green (+) icon that appears between the ...
    • Create a Thumbnail Image Gallery

      We have several gallery options that have thumbnail menus for all liveBooks websites. Thumbnails allow your viewers to quickly preview your images before viewing the enlarged version, all on one page. 1. After adding your Image Gallery to your page, ...