Multimedia Slideshow Popup

Use this to display a list of images or videos in a slideshow

Overview

A popup that includes multiple items in a slideshow format. Each item has an image and other details such as user profile information and number of likes or view count.

Structure

This fully responsive popup is built with a floating group instead of a popup so it can stretch to the full width and height of the page. It has left and right navigational buttons to move through each item. A user can also click on a navigational dot to go to a specific entry.

This popup consists of a few main UI components:

  • RepeatingGroup Media For demo purpose, we are using Arbitrary text for this repeating group's data source. Click here to learn how to change the data source.

  • Clicking on Group Close (Slideshow) with close the floating group popup.

  • Clicking on Group Main left nav and Group Main right nav will navigate to the previous or next entry in RepeatingGroup Media.

  • Group Main media user and details contains UI for displaying a user profile, name, media likes and view count. The data sources for these elements will need to be updated after you update the repeating group's data source.

  • Group Main navigational dots includes a repeating group that should always reference RepeatingGroup Media's data source. Clicking on a dot will trigger a workflow to navigate to the entry.

How to set up

  • Update RepeatingGroup Media's data source to your own data type. You'll need to also change the type of content field for some of the intermediate groups in Group Inner current cell media.

  • Update RepeatingGroup Navigational dots's data type to match the data type of RepeatingGroup Media.

  • Update the other UI elements' data source to reference fields in the data type you selected above.