Performing Arts Legacy Project

An online platform to document and represent the careers of older performing arts professionals

Galleries

  1. Home
  2. Contributor Manual
  3. The Media Library and Photos
  4. Galleries

When editing pages or Highlights on your site, you may wish to present multiple images in a gallery.

First, make sure you are familiar with the Media Library and how to access it.

Please note: It is a two step process to create a gallery regardless of where you are working (i.e. Front End or Dashboard). The first step is to create a gallery and the second is to insert the gallery. You can create a gallery in the Front End or Dashboard, but you will always insert the gallery in the Front End.

Click the headings below for more on the topic.

Creating a Gallery
  1. Go to the top black bar.
  2. Hover over “+ New”
  3. Move your mouse down to “Gallery” and click.
  4. Add a title in the white bar labeled “Add title”
  5. Click the blue “+Add Images” button and do so.
  6. If you’d like to rearrange or remove the images, do so by clicking on the pencil on the top left of the image (edit), the x on the top right (delete), or click and drag (reorder).
    1. To add multiple photos at the same time, hold down Command (if using a Mac) or Control (if using a PC) as you click the images you want in your gallery. When done, release the Command or Control button and click the blue “Use Selected Images” in the bottom right.
  7. Once done, click “Publish” on the right hand side (blue button).
  8. To go back to the Front End, click on your name on the top black bar.

Below is a 4 minute tutorial on creating a gallery in the Front End:

https://vimeo.com/480142459/3f27a2a1a0

Inserting a Gallery
  1. Go to the Highlight you would like to edit.
  2. Click the Edit Post Button (circled in yellow):
  3. Hover over where the you inserted the gallery (if you created a gallery in the Front End.
    1. If you created a gallery through the Dashboard:
      1. Click the Edit Post Button (circled in yellow):
      2. Click 
      3. Click
  4. Click the
  5. A panel will appear on the right-hand side of the screen.
  6. Click the dropdown menu that says “Choose Gallery.” It’ll be the first item from the top in this black column. Choose the gallery name associated with the gallery you’d like to add.
  7. If you’d like to rearrange or remove the images, do so by clicking on the pencil on the top left of the image (edit), the x on the top right (delete), or click and drag (reorder).
  8. Choose a gallery template (feel free to experiment, this can be changed later!) and your preferred options in terms of width and alignment. You can also choose a gallery caption if you’d like.
  9. Click Save Settings on the bottom right.
  10. Click to save!

Helpful Note #1: If you put a photo credit (“Caption”) or a photo caption (“Description”) for the images in the Media Library, those credits/captions will automatically appear when you insert your gallery.

Helpful Note #2: You can change the width of the Gallery when you click the gear icon. In the black column on the right, you’ll see “Main Gallery Width.” With that you can adjust the gallery width using percentages like 50%. After, just click “Save Settings.”

Below is a 2.5 minute tutorial on inserting a gallery:

https://vimeo.com/480142240/51c7fa317f

Editing/Accessing Galleries

Below is a 1.5 minute tutorial on accessing your galleries should you want to edit or see your galleries:

https://vimeo.com/480142352/ce67fc27ef

Photo Order

As you know, some photos are wide and some are tall. When creating a gallery, it might be useful to keep in mind the orientation (wide or tall) of the photo. Whichever photo orientation you have first, the rest will resize to fit the size of the first photo.

For example, below the wide photos are first and the tall photo is last.

https://vimeo.com/484866295/8cef31332f

Versus, below the tall photo is first.

https://vimeo.com/484866215/f8e743c2cf

You can change the order of the photos depending on your preference:

  1. Go to the Highlight you would like to edit.
  2. Click the Edit Post Button (circled in yellow):
  3. Click the on the top left of the gallery.
  4. A panel will appear on the right-hand side of the screen.
  5. About halfway down, you’ll see the image previews, or thumbnails. Click and drag left or right and release the mouse when the photo is where you want it to be.
  6. Click Save Settings on the bottom right.
  7. Click to save!
Gallery Type
  1. Go to the Highlight you would like to edit.
  2. Click the Edit Post Button (circled in yellow):
  3. Click the on the top left of the gallery.
  4. A panel will appear on the right-hand side of the screen.
  5. Scroll down, past the image previews, or thumbnails, until you see “Gallery Type.” It’ll look like:

By clicking on one of these types and then clicking “Saving Settings,” you can see your gallery in different layouts. At any time, you can change the gallery type by repeating this process. Below are brief descriptions on what to expect from each type.

Grid: Lays out the photos individually with two photos per “row.”

Thumbnail: Showcases one photo and the audience can scroll to the next photo. All photos are displayed in a preview, or thumbnail, underneath the showcased image.

Sequence: Lays out the photos individually one one top of the other.

Photoset: This lays out the gallery in a particular orientation. Under Gallery Type you’ll see Gallery Layout. The total number of photos should equal the number of photos in your gallery while the digit is the number of photos per “row.” For example, if you have 4 total photos and would like 1 photo in one “row,” followed by 2 photos in the second “row,” and 1 photo in the third “row,” put 121 in Gallery Layout and click Save Settings. If you have 7 photos and you’d like 2 photos, then 1 photo, then 3 photos, then 1 photo put 2131 and click Save Settings.

Please Note for Photoset: The order of your photos matter. See the headline above, “Photo Order” for how to reorder the photos in your gallery.

Parallax: Laws out the photos individually but changes the photo as your scroll down. This is different than Sequence in that with Parallax transitions one photo to another when you scroll whereas Sequence presents distinctly separate photos are you scroll. With Parallax, the photo also fills to expand the width of the gallery which might crop, or cut off, your photo.

Hero: Showcases one photo at a time and automatically slideshows through your gallery.

Please note: For any of these options, if your photos get cropped in the gallery, under Gallery Type, you may see Main Gallery Height and/or Main Gallery Width. Scale down by putting a percentage less than 100% in Main Gallery Height and then click Save Settings. If that doesn’t help, go back, delete the percentage and try the a percentage less than 100% in Main Gallery Width and then click Save Settings. If neither of these work, try a different Gallery Type.


«Adding Individual Photos
»Editing, Resizing, & Wrapping Photos

Print Friendly, PDF & Email

Was this article helpful?

Print Friendly, PDF & Email

Comments are Closed