To remove all existing images:

1. Position your mouse over the gallery and click Edit. You will be redirected to the Gallery Customization page.

2. Select Remove all items.

3. Confirm Yes, Remove Images.

4. Click Done after you finish all your changes.

To remove individual images:

1. Position your mouse over the gallery and click Edit. You will be redirected to the Gallery Customization page.

2. Hover over an image and click the trash icon on the lower-right corner.

3. Confirm Yes, Delete This Media.

4. Click Done after you finish all your changes.

To add images from your computer:

1. Position your mouse over the gallery and click Edit. You will be redirected to the Gallery Customization page.

2. Select Add New Photos/Videos.

3. Click Add Photos.

4. Select Browse Computer to upload an image or Social Import to add images from your social media.

5. Choose or drop the image files you would like to upload.

To add images from Facebook or Instagram:

1. Position your mouse over the gallery and click Edit. You will be redirected to the Gallery Customization page.

2. Select Add New Photos/Videos.

3. Click Add Photos.

4. Select Social Import.

5. On the left, select Facebook or Instagram.

6. Log in to your account. Allow Filestack to access your pictures.

7. Select the images you would like to upload.

8. Click Upload.

To add titles, image descriptions and set the focus point:

1. Position your mouse over the image you wish to edit.

2. Click Edit Photo.

3. You may add Titles, Descriptions, or a Link. You can customize the text style through the Styles menu.

4. You may also click Set Focus Point to show the area you would like to appear in the thumbnail.

Add videos

from YouTube or Vimeo to Grid Galleries:

1. Position your mouse over the gallery and click Edit. You will be redirected to the Gallery Customization page.

2. Select Add New Photos/Videos.

3. Click Add Video.

4. Enter the URL of the video (e.g. https://www.youtube.com/watch?v=FwlRdXuOtPY).

   1. For Vimeo, click share and copy the link provided.

   2. For YouTube, you may copy the link from your address bar.

5. Click Add Video.

To change the type of gallery:

1. Position your mouse over the gallery and click Edit. You will be redirected to the Gallery Customization page.

2. Select Modify Gallery Settings.

3. Select a Gallery Type.

4. Save Changes.

Grid:

This type of gallery displays a grid with multiple thumbnails of images that can be expanded to their original size when clicked upon. For best results, we recommend using images with the same orientation and similar dimensions.

• Thumbnail Aspect Ratio. Select whether the thumbnail will be square, landscape, or portrait.

• Stretch Gallery to Edge of Website. Select this option to expand the gallery from left to right edge of your browser. 

• Number of Images to Show in Preview. This is the total number of thumbnails that will be displayed in the grid view. The rest of the images can be seen by expanding an image or clicking the arrows to navigate through the gallery.

• Images per Row. The total number of images in each row of the grid. More images per row will decrease the thumbnail size, while less, will increase it.

• Padding Between Images. Increase/decrease the space between thumbnails on the grid. More padding reduces the thumbnail size while less padding will increase it.

• If Web Link is Added, Use this Text. Add the text you want to display as a call-to-action (CTA) in image links.

Slide Show

:

This is an image carousel that automatically rotates between single images. For best results, we recommend using only landscape-oriented images that have similar dimensions.

• Stretch Gallery to Edge of Website. Select this option to expand the gallery from left to right edge of your browser. 

• Enable Time to Automatically Advance to Next Image. Uncheck this box to switch to a manual carousel.

• Time Delay. Select the time each image will be displayed before moving on to the next image (only available if Automatic Advancement is enabled).

• Slider Height. Adjust the height of the gallery. It is recommended that you set it to at least the height of your images.

• Make Gallery Height Responsive. Improves mobile responsiveness and overrides section height and slider height settings. 

Slider:

The Slider allows the viewer to manually go through images as if sliding a roll of film.

• Stretch Gallery to Edge of Website. Select this option to expand the gallery from left to right edge of your browser. 

• Slider Height. Adjust the height of the gallery. It is recommended that you set it to at least the height of your images.

• Make Gallery Height Responsive. Improves mobile responsiveness and overrides section height and slider height settings. 

• If Weblink is Added, Use this Text. Add the text you want to display as a call-to-action (CTA) in image links.

Hero:

The Hero gallery is similar to the slide show, but it allows you to add text to the image like in banners.

• Stretch Gallery to Edge of Website. Select this option to expand the gallery from the left to the right edge of your browser. 

• Enable Time to Automatically Advance to Next Image. Uncheck this box to switch to a manual carousel.

• Make Text White. Improves readability by making the text over the images white.

• Single Caption Mode. Uses only the caption for the first image in all images.

• Image Overlay. Darkens the image to make text stand out more.

• Time Delay. Select the time each image will be displayed before moving on to the next image (only available if Automatic Advancement is enabled).

• Slider Height. Adjust the height of the gallery. It is recommended that you set it to at least the height of your images.

• Make Gallery Height Responsive. Improves mobile responsiveness and overrides section height and slider height settings. 

• If Weblink is Added, Use this Text. Add the text you want to display as a call-to-action (CTA) in image links.