Photo Gallery
The Photo Gallery extension lets you add a gallery of images to your web page using Site Management Tools (SMT).
With Photo Gallery, you can:
-
Select the size and style of the gallery.
-
Customize the display with animation effects.
-
Add a heading and description to each image.
-
Choose text colors to match your look.
-
Add light or dark photo overlays.
For each image, you can link to an external or internal URL. For example, you can feature new product arrivals and link to the Product Details pages.
Commerce extensions are only available if provisioned, installed, and activated for a selected domain in your account. For more information, see Commerce Extensions.
Extensions require SuiteCommerce or the Aconcagua release of SCA or later.
This topic explains how to:
Use SMT to add, configure, or delete a photo gallery on multiple areas of your website. Adding this content type to enhanced or custom landing pages allows you to feature a gallery in the place and style you want. For more information about Site Management Tools, see Site Management Tools Overview.
Add a Photo Gallery
To add a photo gallery to your web store, add the Photo Gallery content type to a page of your site using SMT. You can add up to eight images.
To add a photo gallery:
-
In your website, go to the page where you want to add a photo gallery.
-
Log in to SMT.
For more information, see Users and Roles in Site Management Tools.
-
In Edit mode, click Add on the Site Management toolbar.
-
Drag the Photo Gallery content type to the page.
Note:If you do not see this content type, check that the extension has been installed and is active. Click Settings on the Site Management toolbar to access the Content Manager. Drag the content type from the Inactive Content Types list to the Active Content Type list.
You can drag a Photo Gallery content type to multiple areas on the page.
For more information about the scopes of different SMT areas, see Area and Scope.
-
Configure the settings to best fit your needs.
Configure a Photo Gallery
Configure properties to customize your photo gallery.
The following procedures explain how to customize:
-
General settings — Configure gallery settings, such as gallery height and style, image animation effects, and visibility options.
-
Image settings — Configure featured image settings, such as headings, descriptions, and image display options.
Using SMT, you can also customize the style and display settings of the photo gallery with the Photo Gallery fields in the Theme Customizer. You can choose the font, text colors, gallery size options, overlay colors, and more to make each display fit your needs. For more information, see Theme Skin Manager.
To configure general settings:
-
While logged in to SMT, go to the page that contains the photo gallery.
-
In the Photo Gallery box, click Edit.
This displays the Photo Gallery Settings in the side panel.
-
In the General tab, set the following fields:
Field
Description
Name
Sets the name for the photo gallery to appear in the Review Changes list in SMT.
Visibility
Sets the visibility option that determines when you want to make the photo gallery visible.
For more information about visibility options, see Visibility Dates.
Gallery Height
Determines the size of the photo gallery.
You can customize these size options using the Theme Customizer. For more information, see Theme Skin Manager.
Style
Determines the display style of the photo gallery.
See Example below for a depiction of each style.
You can choose from the following options:
-
Carousel - images appear in a carousel on a desktop and one at a time on a mobile device
-
Grid – images appear in a grid on a desktop and stacked on a mobile device
Hover Animation
Sets the hover animation behavior for the images.
Hover animations only work if the Style field is set to Grid.
Image scale options zoom in or out of the image, without affecting the container. Container drop shadow options display a shadow around the image container.
Carousel Animation
Sets the carousel animation behavior for the photo gallery, if the Style field is set to Carousel.
Open links in a new window
If checked, opens a link from the photo gallery in a new tab or window.
Image Size ID
Links to the image resizing option you want the image to use.
To use this option, you must enter an enabled Image Size ID found under the Images tab in the Image Resizing section of the Web Site Setup record (Commerce > Websites > Web Site List.
For more information about image resizing, see Image Resizing and Compression.
Tags
Sets keywords to help filter your content in the Review Changes list.
For more information about content tags, see Content Tags and Filter Tools.
-
-
Click Save.
To configure image settings:
-
While logged in to SMT, go to the page that contains the photo gallery.
-
In the Photo Gallery box, click Edit.
This displays the Photo Gallery Settings in the side panel.
-
In the Image tab, set the following fields:
Each image in the photo gallery has its own Image tab with associated fields, so you can change the settings for each photo individually.
Field
Description
Image
Sets the image to display using the Image Manager. For more information, see Image Manager.
For optimum performance, optimize images before uploading.
Alt Text
Sets a description of the image to be used to improve accessibility and SEO.
Image Alignment
Determines the positioning of the image within the content box.
Image Overlay
Determines the opacity of the image overlay.
Heading
Sets the main text to appear on the image.
Description
Sets the secondary text to appear on the image.
Text Alignment
Determines the positioning of the Heading and Description on the image.
Text Color
Sets the color for the Heading and Description texts.
You can customize these color options using the Theme Customizer. For more information, see Theme Skin Manager.
Link
Determines the URL to which you want the image to link.
-
Click Save.
Remove a Photo Gallery
You delete the photo gallery from your site using SMT in one of two ways, depending on whether you have published the content to your website:
-
Discard the photo gallery if you have not published the content.
-
Remove the photo gallery if you have already published the content.
To discard a photo gallery (Unpublished Content):
-
While logged in to SMT on your website, select the Review & Publish Changes list from the Site Management toolbar.
-
Select the Photo Gallery content in the list.
-
Click Discard.
-
Click OK.
To remove a photo gallery (Published Content):
-
While logged in to SMT on your website, go to the page that contains the photo gallery content you want to remove.
-
In Edit mode, click the Photo Gallery box.
This highlights the photo gallery and displays the content controls.
-
Click Remove.
-
Click OK.
Example
This shows a photo gallery set to Carousel.

This shows a photo gallery set to Grid.
