Accessibility links

Breaking News

Creating a Slider gallery

update

What's inside this article:




About Slider galleries

What is a Slider gallery?

A Slider gallery includes one or more image pairs that typically contrast how a place has transformed over time. Visitors can interact with each image pair by dragging the slider backwards and forwards to inspect both images.

What happened to the Photo blog layout?

Previously, Pangea CMS included a single Photo Gallery edit screen, which offered the Photo blog and Slider gallery layout options. This functionality is now separated over two edit screens:

  • Photo gallery: For creating Photo galleries (previously Photo gallery with the Photo blog layout enabled).
  • Slider gallery: For creating Slider galleries (previously Photo gallery with the Slider gallery layout enabled).

For information about creating a Photo gallery, see the following article:




Complete required settings

To create a new Slider gallery, click New > Multimedia > Slider Gallery in the top menu.

You must complete the settings below before saving the Slider gallery:

  • Add at least one image pair. For detailed information, go to the section below:
  • Click General in the left panel and define the Title for the Slider gallery.
  • Use the Categories drop-down menu to assign the Slider gallery to at least one category. For detailed information, see the following article:

The status controls when the Slider gallery is available on the public website. Manage the status using the drop-down menu at the top of the screen. For more information, see the following article:




Add an image pair

NOTE: The instructions below assume the images you want to use are already uploaded to Pangea CMS. To learn how to upload new images, see the following article:

To add a new image pair, click Add new pair on the Images screen.

By default, the Attach dialog shows all available images from your own entity (for example, RFE), with the most recently uploaded images displayed first. For detailed information about searching for images using the Attach dialog, go to Search for images.

Click + Attach (the plus icon) next to each image you want to use in the image pair. An image pair must include two images. You cannot save the pair if only one image is attached, and it is not possible to attach more than two images.

The attached images appear under Attached items in the right panel. Optionally manage the images using the options below:

  • Remove an image: Click Remove (the trash icon) to remove an image from the pair. You then need to select a different image.
  • Reorder images: Drag and drop an image box to change its position. The top image is displayed first in the image pair.

Click Save to confirm and apply your preferences and return to the Images screen.




Search for images

Refer to the relevant section below, according to the type of image you want to search for:



Search for internal images

To search for internal images, ensure Internal is selected in the left panel.

In the left panel, the following options are available for finding internal images:

  • Keywords: Display only images that contain the entered keyword(s) in the title or description.
  • Entity & site: Search for only images from a particular entity (such as RFE). Optionally select a specific site, or search all sites.
  • Date: Display only images that were uploaded or taken within a specified time period. Select your preferred option:
    • Date taken: Based on the Image taken setting that is manually defined for each image at the time of upload.
    • Date uploaded: Based on data that is automatically assigned by Pangea CMS at the time of upload.
  • Uploaded by: Display only images that were uploaded by specific Pangea CMS users.
  • Photographers: Display only images assigned to specific photographers. For more information, see the following article:
  • Sources: Display only images assigned to specific sources. For more information, see the following article:

Click Search to refresh the search results according to your defined criteria.



Search for external images

To search for an external image, select External in the left panel.

In the left panel, the following options are available for finding external images:

  • Keywords: Display only images that contain the entered keyword(s) in the title, description, or location.
  • Date: Display only images that were added within a specified time period.
  • Agencies: Display only images from a particular agency.

Click Search to refresh the search results according to your defined criteria.




Manage image pairs

You can manage the image pairs you have already added to the Slider gallery via the Images screen.

The following options are available for each pair:

  • (A): Select media: Replace one or both of the images in the image pair.
  • (B): Crop the image: Click the Crop the image icon to crop an image.
  • (C): Order of images: Switch the order of the images in the image pair.
  • (D): Metadata: Review the image metadata, which might be useful for editing the Caption. This information is not visible on the public website.
  • (E): Caption: Edit the text that appears below the image pair on the public website. The title for the first image is pre-filled by default.
  • (F): Restore to default: If necessary, return the Caption to its default state (the title for the first image).
  • (G): Description: Review the internal description for the first image, which might be useful for editing the Caption. This information is not visible on the public website. In a future release, the internal description for the second image will also be visible.
  • (H): Delete: Remove the image pair from the Slider gallery.
  • (I): Preview slider: Preview how the image pair will look on the public website.
  • (J): Order of image pairs: If the Slider gallery contains multiple image pairs, use the drop-down menu to set the position of each image pair. For example, if you select 1, the image pair is displayed first.



Add labels and set the slider

Click Gallery in the left panel to adjust the following settings that apply for every image pair in the Slider gallery:



Customize labels

The following options are available:

  • Label (image 1): Customize the label that appears on every first image in the Slider gallery. 'Before' is the default value.
  • Label (image 2): Customize the label that appears on every second image in the Slider gallery. 'After' is the default value.

NOTE: You can localize the default text for the labels using the following configuration keys:
  • Slidergallery.DefaultSetting.AfterText
  • Slidergallery.DefaultSetting.BeforeText
For detailed information about using the Site Localization tool in Pangea CMS, see the following article:



Customize slider

You can set the point where the slider appears on each image pair. Under Slider starting point, set the percentage of the first image that is visible. For example, if you select 75, the visitor sees 75% of the first image and 25% of the second image.


NOTE: The default value for the Slider starting point is 50. To change the default value for your website, contact us.



Manage General settings

Click General in the left panel to manage the following settings:

  • Status: Adjust the Slider gallery status.
  • Publication date & time: Adjust the publication date and time that is displayed at the top of the Slider gallery. Optionally schedule publication.
  • Last update: Specify when the Slider gallery was last updated. If filled, the information is visible on the public website.
  • Title: Adjust the Slider gallery title.
  • Introduction: Enter a brief introductory text. Tick Display introduction to make the introduction visible on the published Slider gallery page.
  • URL Slug: Enter a text string that is added to the URL and enhances visibility via search engines.
  • Categories: Adjust which categories the Slider gallery is assigned to.
  • Content: Provide text content that appears on the published Slider gallery page. The content can include formatted text and links. For more information, see the following article:



Use the preview

If the status of the Slider gallery is Published, click Live site at the top of the screen to open the Slider gallery page on the public website.

Regardless of the status, you can use the options under Preview in the left panel to preview how the Slider gallery will look on devices with different screen sizes (desktop, tablet, or mobile).


NOTE: You cannot use the Preview options in the left panel until all of the required settings are filled. However, it is not necessary to save the Slider gallery before previewing it.



Further recommendations

This article contains information about the most important settings for creating a Slider gallery. For information about other options on the Slider gallery edit screen, see the following articles:

Pangea CMS Guide

Need help?

XS
SM
MD
LG