Photos in Folder widget

The Photos in Folder widget displays images from a connected folder channel in your digital workplace.

Sections in this article:

Set up

Follow these steps to set up this widget:

  1. Place a  Photos in Folder widget on a page, space, or dashboard. For more information, see Placing and setting up a widget
  2. Select the placed widget's Edit button.
  3. Review and make changes to the settings on the Options, Layout, and Appearance tabs. You can find details about the widget's settings in the Settings section below.
  4. In the widget editor, select Update to apply your changes or Cancel to discard them.  
  5. At the bottom of your page, space, or dashboard, select Publish or Save as Draft to save your changes.

Settings

Setting Description
Title

Enter a title for the widget. The title appears as a heading above the widget's contents. You should use the title to provide context to the widget and better structure a page's content by clearly denoting different sections.

When entering a title, you do so only for your currently selected language. If your digital workplace supports multiple languages, you should select  Translation and enter a title for each supported language. 

This field can contain a maximum of 140 characters.

Title link Select to make the widget's title a link. When selected, users can select the title to go to the Source location.
Description

Enter a description for the widget. The description appears between the title and the widget's contents. You can use this text to provide information to users about the widget.

When entering a description, you do so only for your currently selected language. If your digital workplace supports multiple languages, you should select  Translation and enter a description for each supported language.

Source

Select a folder channel or folder. Content from this source will display in the widget. 

Access rules determine what users will see when configuring and viewing the widget: 

  • Users who are configuring this widget will only see folder channels and folders that meet both of these conditions:
    • The user must have at least Read access to the folder channel or folder.
    • The user must have at least Read access to all locations above where the folder channel or folder are nested.
  • Only users who have Read access or higher to the selected folder channel or folder will see content in the published widget. These users will only see content to which they have at least Read access.

To select a folder channel or folder:

  1. Select the Source dropdown.
  2. Search for a folder channel or folder by its name. This search will return up to 100 results and include the pages and spaces that contain a folder or folder channel that matches the search query.
  3. Select a folder channel or folder from the list of search results.
Sort options

Select how to sort content in the Widget. Options include:

  • Title
  • Comments
  • Size
  • Type
  • Created Date
  • Created by
  • Last Modified
  • Modified by
  • Views

You can then select whether the sort order is Ascending or Descending.

Number of results Enter the maximum number of results to display initially. You must enter a value between 1 and 99. If there are additional items to display, users can select the View All link, found at the bottom of the widget, to go to the source folder channel or folder.
Add files Select to add an Upload a photo button to the widget. Only users with at least Write access to the connected folder channel or folder can see this button. Users can select this button to add content to the connected folder channel or file.
Options tab
Setting Description
Layout

Select how the widget displays photos. Options include:

  • Squares: Images will all be displayed as squares in a grid. Rectangular images will be cropped.
  • Thumbnail: Images will be shown with their original aspect ratio and their title beneath.
  • Detail: Images will be displayed in a stacked list with small squared previews of the images and additional details as selected.
  • List: Images will be shown in a more compact stacked list than the Detail view.
  • Tile: The Tile view will display images in a grid with a square thumbnail image and the title of the image to the right.
  • Slideshow: The Slideshow view will display images from a folder sequentially.
Time

This option is only available if the Layout is Slideshow.

Select how long slides get displayed. Select a time between 3 seconds to 20 seconds in increments of 1 second. 

Image order

This option is only available if the Layout is Slideshow.

Select how the widget orders images in the slideshow. Options include:

  • Show images according to Sort options
  • Show images in random order
Image Size

This option is only available if the Layout is Slideshow.

Select how the widget sizes an image. This option works in conjunction with the Height option found on the Appearance tab. Options include:

  • Auto: The slideshow height will dynamically change based on the image being displayed and will maintain the image's original vertical height. Requires a Height value of Auto to be set in the Appearance tab.
  • Fill: The image will scale to fit the width of the widget while the view of the image is centered vertically. Requires a Height value of at least 50px to be set in the Appearance tab.
  • Fit: The image will scale to fit the height of the widget. Requires a Height value of at least 50px to be set in the Appearance tab.
Transition

This option is only available if the Layout is Slideshow.

Select the animation style used when images change in the slideshow. Options include:

  • Fade
  • Slide
Dots

This option is only available if the Layout is Slideshow.

Select to display navigation dots.

Arrows

This option is only available if the Layout is Slideshow.

Select to display forward and backward arrows.

Comments

This option is only available if the Layout is Detail, List, or Slideshow.

Select to display the number of comments on each image.

Created by

This option is only available if the Layout is Squares, Detail, List, Tile, or Slideshow.

Select to display who uploaded each image.

Last Modified

This option is only available if the Layout is Detail, List, Tile, or Slideshow.

Select to display when each image was last modified.

Likes

This option is only available if the Layout is Detail or Slideshow.

Select to display the number of likes each image has received.

Modified by

This option is only available if the Layout is Detail.

Select to display who last modified each image

Photo Title

This option is only available if the Layout is Squares or Slideshow.

Select to display the file name of each image.

Size

This option is only available if the Layout is Squares.

Select the size of the images displayed in the widget. Options include:

  • 64 x 64
  • 96 x 96
  • 128 x 128
Type

This option is only available if the Layout is Detail.

Select to display each image's file type extension.

Views

This option is only available if the Layout is Detail, List, or Slideshow.

Select to display the number of views each image has received.

Layout options
Setting Description
Class Enter CSS class selectors to provide additional styling to the widget. For more information, see Applying custom CSS to widgets.
Height Select the height of the widget. Options include:
  • Auto: The leftmost slider position. The height of the widget will increase and decrease to contain what it is displaying.
  • Fixed: Select a fixed height between 50px to 600px in increments of 50px. A vertical scrollbar will appear on the widget if the content exceeds this fixed value.
Appearance tab

Note

Your digital workplace's theme overwrites many of the settings on the Appearance tab. However, the settings listed above are usable.

Image size and display behavior

Images displayed in the Photos in Folder widget are often scaled down from their original size. Using PNG images is the best way to minimize any image degradation that can occur as a result of this image scaling.

Layout Size (px) Notes
Squares 64x64 / 96x96 / 128x128 Images are scaled so that the entire display area is used. The focus of the image will be the center of the source image.
Detail 32x32 Images are scaled so that the entire display area is used. The focus of the image will be the center of the source image.
List 32x32 Images are scaled so that the entire display area is used. The focus of the image will be the center of the source image.
Tile 64x64 Images are scaled so that the entire display area is used. The focus of the image will be the center of the source image.
Thumbnail 128x128 Images are scaled so that their entirety is displayed within the available area.
Image sizes

The slideshow layout provides additional options for determining how images are displayed. The image size option determines this behavior:

  • Auto: Causes the slideshow height to dynamically change based on the image being displayed and will maintain the image's original vertical height. 
  • Fill: Scales the image taking up the entire width of the widget while the view of the image is centered vertically. 
  • Fit: Scales the image so that its height will match that of the widget.

Image widths can range from 200px/600px/620px/1080px (narrowest column to the entire page column). The height of the slideshow is configured on the Appearance tab of the widget and ranges from 50px to 600px with adjustments occurring in increments of 50px.