Photo Gallery

This topic applies to

Applies to

SuiteCommerce Web Stores | Site Management Tools | Aconcagua

The SuiteCommerce Photo Gallery extension lets you add up a gallery of up to 8 images to your web page using Site Management Tools. You can select the size of your gallery and choose grid or carousel view. The gallery adapts automatically to the number of images uploaded. You can select the focus of the image and add a dark or light overlay. You can add a caption on each image and choose the text color based on your theme settings. You can link each image to an external or internal URL. For example, with Photo Gallery, you can feature new product arrivals and link to the product description page.

Important

SuiteCommerce extensions are only available if they are provisioned and set up in your account. For more information, see NetSuite Extensions.


You can add a photo gallery to multiple areas on your website using Site Management Tools. For more information on Site Management Tools, see SMT Overview.

To add a photo gallery:

  1. Go to the page where you want to add a photo gallery.

  2. Click Add on the Site Management toolbar.

  3. 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 has been activated. Click the Settings button 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 the Photo Gallery content type to multiple areas on the page:

    • If you drag it to an area marked as all pages, then the content displays on any page that contains that area.

    • If you drag it to an area marked as page type, then the content displays on any page of that type.

    • If you drag it to an area marked as this page, then the content displays only on the page to which you add it.

  4. In the General tab:

    1. Use the Name field to enter a description of your new content.

      See Content Tags and Filter Tools.

    2. Set the content visibility options.

      See Visibility Dates.

    3. In the Gallery Height, select the height of your photo gallery.

      Note

      If you select large gallery height, the images are expanded to fill the entire section.


    4. Select Grid or Carousel in the Gallery Style field.

      If you select Carousel, the images change automatically. In Grid, images are stacked in mobile screens.

    5. Select Open in New Window if you want the button link to open in a new tab or window.

    6. Use the Tags field to enter keywords that help you filter your content in the Review Changes list.

      See Content Tags and Filter Tools.

  5. In the Image tabs:

    1. Select the image you want to display using the Image Manager.

      See Image Manager. A preview displays in the page.

      Note

      If you upload several images, all images should have the same resolution for optimum display.


    2. In the Image Alignment field, select the positioning of the image within the content box.

      You can choose the focus of your image. The options are top, center, or bottom.

    3. In the Image Overlay field, select the opacity for your image.

      You can select dark, light, or no overlay.

    4. In the Alt Text field, enter a description of the image.

      This text is used to improve web accessibility for visually impaired users and for SEO purposes.

    5. In the Caption field, enter the text you want to display as a subtitle for the image.

    6. In the Text Color field, choose the color you want for the text field.

      By default, the colors are taken from your theme. If you select Dark, the text uses the dark text color as defined in your theme. If you select Light, the text uses the light text color as defined in your theme.

    7. In Link, enter the URL you want to open when the user clicks the image.

  6. Repeat step 5 to include additional images. You can add up to 8 images.

  7. Click Save.

If you have not published your photo gallery and you decided to remove it, you can discard it. If you have already published your photo gallery, you can remove it directly from the page where it is located. For more information on the differences between discarding or expiring content, see Discard Content Vs Expiring Content.

To discard a photo gallery:

  1. Go to the Review & Publish Changes list.

  2. Select the photo gallery in the list.

  3. Click Discard.

  4. Click OK.

To remove a photo gallery:

  1. Go to the page that contains the photo gallery you want to remove.

  2. Click the Photo Gallery box.

    This highlights it and displays the content controls.

  3. Click Remove.

  4. Click OK.

To change the button link or alternative text:

  1. Go to the page that contains the photo gallery.

  2. Click the Photo Gallery box, and then click the Settings button.

    This displays the Photo Gallery Settings in the side panel.

  3. Enter the URL for the link in the Link field or enter the alternative text in the Alt Text field.

  4. Click Save.