How to Show a Google Drive Photo Gallery on Your Website

Do you want to show your photos from Google Drive as a clean, good-looking gallery on your website? You can easily do this with DriveHub.

This setup is super useful because your photos stay in Google Drive, so they don’t fill up your WordPress Media Library, and every new photo you add to the folder shows up on your site by itself.

Here is an easy, step-by-step guide to help you set it all up!

Step 1: Install DriveHub and Connect Google Drive #

First, make sure DriveHub is installed and your Google account is connected:

• From your WordPress admin, click on Plugins > Add New.
• Search for DriveHub.
• Click Install and then Activate.
• Follow the setup screen to add your Google account.

Read our step by step setup guide to avoid any confusion.

Step 2: Create a Gallery Module #

The next step is to create a module for your gallery:

• Go to DriveHub > Modules.
• Click on Add module.

• In the Select module type window, click on Gallery under Display files.

• Click on the name at the top of the editor and give your gallery a name, for example Studio Photo Gallery 2026.

New to modules? Our guide on how to create your first DriveHub module walks through the editor in more detail.

Step 3: Choose Your Photos (Source Tab) #

In this step, you pick the Google Drive folder that holds your photos:

• Stay on the Source step (it opens first).
• Scroll down to Your Drive and find your photo folder, for example Team Photos or Wildlife Collection. You can type the name in the search box.
• Hover over the folder and tick the box in its top left corner.
• The green panel on the right now shows (1) Items Selected with your folder.

You can tick more than one folder, or pick single photos one by one. Above the browser you’ll also find a few extra switches:

• All Folders & Files: Lets visitors move through all the folders and files of your linked Google Drive accounts. Leave it off to show only what you tick.
• Use Private Files: Shows each logged-in user their own private folder.
• Use ACF field Files: Takes the files from an ACF field on the page where the gallery is placed.
• Merge Selected Folder Files: Shows the photos from all the folders you ticked together in one gallery. Turn on Include Subfolder Files to add photos from their subfolders too.

Step 4: Choose Which Photos Show (Filter Tab) #

Here, you can decide which files make it into your gallery:

• Click on Filter on the left.
• Show Files: Keep this on. If you turn it off, the gallery has no photos to show.
• Allowed Extensions: Switch Allow all off, then type the file types you want, like jpg, png, and click Add. Only those types show up in the gallery.

Don’t forget to switch Allow all off! While it is on, the list is dimmed and the hint reads “Turn off Allow all to show only these types.”, because DriveHub then shows every file type except the ones in the Except box. Once Allow all is off, the Except box is dimmed instead, with the hint “Except only applies while Allow all is on.”

• Allowed Names: Works the same way. Switch Allow all off and type the names you want to show. You can use wildcards, for example beach* shows every photo whose name starts with “beach”. Use Apply to to choose whether the name filter checks Files, Folders or both.
• Maximum Item Count: Type the most photos you want to show, for example 24. Folders are not counted. This is the only limit on how many photos the gallery shows. Leave it empty to show all of them.

Step 5: Change How It Looks (Advanced Tab) #

Now for the fun part. Here, you set the look of your gallery:

• Click on Advanced on the left.
• Module Container: Set a Width (like 100% or 800px) and a Height for the gallery box. Leave them empty to let the gallery size itself.
• Under Gallery Options:
• Columns: Pick how many photos sit side by side, from 1 to 6. On a phone the gallery uses fewer columns by itself.
• Layout Style: Choose Grid, Masonry or Justified. You can see all three in the next step.
• Image Resolution: Choose how sharp each photo in the gallery is: Thumbnail (400 px), Medium (800 px), Large (1600 px) or Original (the full photo). Smaller sizes load faster, so Thumbnail or Medium is a good pick for most galleries.
• Image Gap (px): Set the space between photos, for example 10. Type 0 for photos that touch.
• Enable Lightbox: Keep this on so visitors can click a photo to see it large in a popup. When it is off, the photos are not clickable.
• Show Photo Names: Turn this on to show each photo’s name in a small caption under it.
• Caption Source: Choose what the caption says. File Name uses the photo’s name. Drive Description uses the description you gave the photo in Google Drive; photos without one show their file name.
• Show Caption in Lightbox: Keep this on to show the caption under the large photo in the popup. Turn it off for photos only.

Scroll a little further down the same card to decide how many photos show at once:

• Show File Count: Turn this off to hide the “Showing 1 – 12 of 40 files” line above the photos.
• Show Sort Menu: Turn this off to hide the sort button. The photos then always keep the order you set under Sorting. With both of these off, the bar above the photos disappears for a clean look.
• Load All Images: Turn this on to show every photo in the folder at once (up to 500), with no pages. Visitors can then move through the whole album in the popup.
• Images per Page: Type how many photos each page shows, from 1 to 500. The default is 12. This box hides while Load All Images is on.
• Fill Complete Rows: Turn this on so every page ends with a full row. For example, with 4 columns and 10 per page, the gallery shows 12.

Further down, the Sorting section decides the order of your photos:

• Sort By: Choose Name, Size, Created Date, Modified Date or Random. Random mixes the photos into a new order.
• Sort Direction: Choose Ascending or Descending. New galleries start with Name and Ascending.
• Enable Initial Files Sorting: Keep this on to show the photos in your chosen order as soon as the gallery loads. Turn it off to show them in the order Google Drive returns them; the sort button on the gallery then reads Sort.

Visitors can still change the order themselves with the sort button at the top right of the gallery.

Step 6: Pick a Layout Style #

Not sure which Layout Style to choose? Here is the same folder of photos in each one.

Grid puts every photo in a neat square tile, in tidy rows. Here it is with Show Photo Names turned on, so each photo has its name under it:

Masonry keeps each photo’s own shape and stacks them in columns, like a photo wall. Tall and wide photos sit side by side without cropping:

Justified keeps each photo’s shape too, but lines them up in rows of the same height that fill the full width, like a photo album:

Step 7: Choose Who Can See It (Permissions Tab) #

Here, you can decide who gets to see and save your photos:

• Click on Permissions on the left.
• The Download card controls the download button in the lightbox. Keep it on to let visitors save the photo they are viewing, or switch it off to hide the button. Use Filter Users & Roles to allow downloads only for some users or roles.

• Scroll down to Password Protection if you want to keep the gallery private.
• Turn on Password Protection and type a Password. Visitors then need to enter it before they see your photos.

• Under Visibility, use Display For to show the gallery to Everyone or only to people who are Logged In to your website. Logged-out visitors then see a Login Required screen instead of your photos.

Don’t forget to click the Save changes button at the top right when you are finished! (On a brand-new module this button says Save module.)

Step 8: Publish the Gallery #

Once you’re happy with all the settings, put the gallery on a page:

• Click on Embed at the top right.
• Click on Copy shortcode and paste it into any page or post, or hover over Add to a page to let DriveHub add it for you.
• Publish the page.

The first module guide shows each of these options with pictures. You can also add the gallery with the block editor or the Classic Editor.

Now open your page. Your photos from Google Drive show up as a neat gallery:

When there are more photos than your Images per Page number, visitors can move through them with Previous and Next at the bottom. If you set the Loading Method to Load More or Infinite Scroll in the Performance settings, the next photos are added under the ones already showing instead.

On a phone, the gallery fits itself to the smaller screen:

Visitors can click any photo to open that same photo large in the lightbox, then use the arrows (or the arrow keys) to move through the rest. When downloads are allowed, a round download button sits next to the close button at the top right:

Benefits of Using DriveHub for Your Photo Gallery #

• Save WordPress storage: Your photos stay in Google Drive, not in your Media Library.
• Always up to date: Add photos to the Drive folder and your gallery shows them.
• Your look, your way: Pick the columns, layout, image size and order.
• Built-in lightbox: Visitors can view each photo full size without leaving the page.
• Keep it private when you need to: Protect a gallery with a password.

With DriveHub, sharing your Google Drive photos as a beautiful gallery takes just a few minutes.

Related guides:

• How to Show a List of Google Drive Files with Download Buttons
• How to Embed Google Drive Documents on Pages and Posts