Skip to main content
Noble Desktop Publishing Team/3 min read

Web Galleries

Build a Web Gallery

1

Select Images

Highlight in the Content panel — order matters for output.

2

Output Workspace

Window → Workspace → Output.

3

Choose Web Gallery Template

Style and layout — preview before generating.

4

Save Site

Generates HTML + assets — upload to any web host.

Master Adobe at Noble Desktop

Noble Desktop's Graphic Design Certificate covers Photoshop, Illustrator, and InDesign — the core Creative Cloud apps Adobe Bridge organizes.

Learn the essentials of using Adobe Bridge, including creating HTML and Flash galleries, installing the Output Module, and saving your gallery, in this comprehensive tutorial.

Topics Covered in This Adobe Bridge Tutorial:

More Using the Output Workspace, Creating HTML Galleries, Creating Flash Galleries

Exercise Preview

bridge web gallery

Exercise Overview

Making a web gallery with Bridge is a snap and a nice way to share your work with others. The Output panel lets you assemble an online photo gallery with just a few mouse clicks.

Installing the Output Module

The Output module was included in earlier versions of Bridge but no longer comes pre-installed with Bridge CC. Luckily Adobe still offers it as a separate download. If you did the previous exercise you’ll already have it installed and can jump to the next section. Otherwise, here’s how to get it.

  1. Quit Bridge if it’s currently running.

  2. Go to tinyurl.com/bridge-omcc

  3. Download and install it using the instructions on that webpage.

  4. Once installation is complete, launch Bridge. If it asks about enabling the extension, click Yes.

Creating an HTML Photo Gallery

  1. Navigate into the Bridge Files folder, then into the Australia Photo Shoot folder.

  2. Choose Edit > Select All.

  3. Go to Window > Workspace > Output.

  4. Go to Window > Workspace > Reset Workspace.

  5. At the top of the Output panel, click the Web Gallery button.

  6. From the Template menu, choose HTML Gallery.

  7. At the top of the Output panel, click on Preview in Browser to see a real preview of the gallery in a web browser.

  8. In the web browser, click the thumbnails to cycle through the images. Not bad for a couple minutes of work, but how about something a little… flashier?

Creating a Flash Photo Gallery

  1. At the top of the Output panel, from the Template menu choose Lightroom Flash Gallery.

  2. For Style, choose Flash gallery (default).

  3. In the Site Info section, enter the following settings:

    Site Title: Australia Photo Shoot
    Collection Title: Koalas and Sydney
    Collection Description: (Delete any text and leave this blank)
    Contact Info: (Your Name)
    Email or Web Address: (Your Email)
    Copyright Info: All Rights Reserved

    NOTE: The copyright info won’t be visible on the page, but it’s written into the metadata of each image.

  4. Scroll down the Output panel to the Appearance section and set:

    Slideshow Size: 800px
    Gallery Image Size: 750px
    Thumbnail Size: 100px
    Quality: 70
    Layout: Left
  5. At the top of the Output panel, click the Preview in Browser button.

  6. The gallery will open in your default web browser. Use the navigation at the bottom or click the thumbnails to look over all the photos. You can even use the Arrow keys to navigate the thumbnails in this webpage! You may have to click a thumbnail first before you can use the keystrokes though.

Saving the Gallery

  1. Back in Bridge, at the bottom of the Output panel under Create Gallery change the Gallery Name to Australia Photo Shoot.

    NOTE: How is this different from the Site Title we set earlier? The Gallery Name appears in the titlebar of the web browser. The Site Title appears on the page.

  2. Under the Gallery Name, click Browse to choose a destination.

  3. Navigate to the Bridge Files folder.

  4. Create a new folder and name it Australia Gallery.

  5. Click Open (Mac) or OK (Windows).

  6. At the bottom of the Output panel, click Save and let the Bridge do its work. When it says the gallery has been created, just click OK. Who would have ever thought such a fancy gallery could be so easy to create?