User Guide

Configuring the Image gallery widget

Use this widget to display a gallery of image thumbnails, where each image can be opened individually. You can choose images from the already uploaded or upload new images.

After you have dragged the Image gallery widget on your page you must configure it to display images.

To do this, click Edit button in the upper-right corner of the widget.
The Image Gallery window appears, containing two tabs.

Images tab

On Images tab you select which images to display in the gallery.
Select one of the following:
  • All published images
    All images that are uploaded and published are displayed in the gallery.
  • From selected library…
    The Image gallery displays images only from a certain library.
    1. To select a library, click Choose.
      The Choose Image Library window appears
    2. Select the library, whose images you want to display, and click Done selecting.
    3. For more information, see Uploading and editing images.
  • Upload new images…
    To upload new images, click Upload and perform procedure Uploading images » Step 3 to Step 9.
  • In Sort images, select a sorting criterion for the images in the gallery.

Settings tab

On Settings tab you select the way the images in the gallery are displayed when opened.
Select one of the following:

Thumbnails + Detailed page

The image gallery displays the images as thumbnails. The description of the images is displayed in tooltip text. When clicked, the image is displayed in a bigger size in the same page together with image title, the user that has uploaded the image, the date of upload, and the description.

In Fine tune the selected type, perform the following:

  1. Select one of the following:
    • If you select Use paging radio button, the system divides the list of image thumbnails into pages.
      In the input field you specify how many image thumbnails per page you want to display.
    • If you select Use limit radio button, the system displays only a limited number of the image thumbnails.
      In the input field, you specify how many image thumbnails you want to display.
    • If you select No limit and paging radio button, the system displays thumbnails of all the images that you have selected in Images tab.
  2. If you want to display links to the previous and the next image, select Show links to the previous and next image as… checkbox.
    You use the radio buttons, which appear, to select how to display the links. Choose one of the following:
    • Text Links
    • Thumbnails to previous and next image

NOTE: You can edit the way the widget displays the list of images, by clicking Edit Thumbnail list template and the detailed display of an image by clicking Edit Detail page template. For more information, see Creating and editing widget templates.

Thumbnails + Overlay (lightbox)

The image gallery displays the images as thumbnails. The description of the images is displayed in tooltip text. When clicked, the image is displayed in a bigger size as an overlay of the page together with its description.

In Fine tune the selected type, select one of the following:

  • If you select Use paging radio button, the system divides the list of image thumbnails into pages.
    In the input field you specify how many image thumbnails per page you want to display.
  • If you select Use limit radio button, the system displays only a limited number of the image thumbnails.
    In the input field, you specify how many image thumbnails you want to display.
  • If you select No limit and paging radio button, the system displays thumbnails of all the images that you have selected in Images tab.

NOTE: You can edit the way the widget displays the list of images, by clicking Edit Thumbnail list template. For more information, see Creating and editing widget templates.
Thumbnail strip + Image on the same page

The image gallery displays a horizontal strip of image thumbnails. When you click an image from the strip, a preview of the image is displayed above the thumbnail strip.

In Fine tune the selected type, perform the following:

  1. If you select Use limit checkbox, the system displays only a limited number of the images.
    In the input field, you specify how many images or files you want to display.
  2. If you want to display links to the previous and the next image, select Show links to the previous and next image checkbox.

NOTE: You can edit the way the widget displays the list of images, by clicking Edit Thumbnail list template and the detailed display of an image by clicking Edit Detail page template. For more information, see Creating and editing widget templates.
 Simple list

All images are displayed in a large size. The description of the images is displayed in tooltip text.

In Fine tune the selected type, select one of the following:

  • If you select Use paging radio button, the system divides the list of images into pages.
    In the input field you specify how many images per page you want to display.
  • If you select Use limit radio button, the system displays only a limited number of the images.
    In the input field, you specify how many images you want to display.
  • If you select No limit and paging radio button, the system displays all the images that you have selected on Images tab.

NOTE: You can edit the way the widget displays the list of images, by clicking Edit Thumbnail list template. For more information, see Creating and editing widget templates.

If you want to display buttons for social sharing, select Enable social share buttons.
This enables your users to share the items, for example, on Facebook.
To configure which buttons to display, see Social sharing.

Filtering and sorting the images

You can filter and sort the images, which the widget displays, using both the default and the custom fields of the images.

  1. To filter or sort the images, click Advanced button in the lower-right corner of the window.
    The advanced editing mode opens.
  2. In MasterViewName input field, check which view the widget uses.
  3. Click ControlDefinition » Views buttons.
  4. Choose for which view, you want to apply filtering or sorting by selecting the view that the widget uses.
  5. Filter or sort the images in the following way:
    • To filter the images, in FilterExpression input field, enter the desired filtering expression.
      You can use both default and custom fields. The field supports AND and OR Boolean operators.
      For example, enter Visible = true AND Status = Live
    • To sort the images, in SortExpression input field, enter the desired sorting expression.
      You can use both default and custom fields. The field supports operators ASC for ascending and DESC for descending.
      For example, enter PublicationDate DESC

NOTE: To see all custom and default fields, perform procedure Creating a new custom field » Step 1 and Step 2.

For more information about advanced configuration options, see Advanced configuration of widgets.

When you are finished, click Save.
The Image Gallery window closes and the Image gallery widget is configured to display the images you have selected.

Related topics:

Feedback

How useful is this article?

Tell us more

Submit
Your message was successfully sent.

We appreciate your feedback.

Your message could not be sent.

OK