In this article
Galleries & Slideshows Overview
DarkMatter galleries and slideshows are where you can create unique image layouts for your pages. Galleries and slideshows are both managed here and then added to your pages as components. You can have more than one gallery or slideshow on a page. You can also add captions to galleries and call-to-actions on slideshows.
From the Menu click on Image Galleries or Slideshows.
To access image galleries click the Image Galleries button.
To access slides click the Slideshows button.
The slideshows home screen is where you will manage all of your slideshows.
Slideshows will go through several published states while you work on them.
A Published slideshow is the most current version of the slideshow.
A Draft slideshow has not been published.
A Changed slideshow has not been published, but indicates changes are made.
Each Slideshow has a slideshow bar which includes a thumbnail image of an image from the slideshow and a slideshow indicator.
Use the compass tool to move slideshows up or down in the list and to keep them organized.
Click Settings to change the settings of a slideshow.
Click Slides to change the slideshow.
Click Preview to preview the slideshow.
Click Remove to delete the slideshow.
Anatomy of a Slideshow
A Slideshow is made up of two parts, Settings and Slides, and an associated linked page. A Slideshow must be added to a Page in order for it to appear on your website or in Preview view.
Slideshow Linked Page
Once a slideshow component is added to a page it will have a Linked Page.
In Slideshows you can access the Linked Page by clicking the icon in the main slideshow navigation.
From the Page, Click on the Pencil edit button from the component toolbar. And then the Edit Gallery Layout button.
DarkMatter allows you to create dynamic slideshows quickly. Set the number of slides and include Captions, Call to Action Text, Links, and the rotation speed of your images.
Create a Slideshow
To create a new slideshow click on the New slideshow. Then complete the Slideshow Settings and then the Slideshow slide layout.
Set up how you would like your slideshow to appear. These settings will reflect how the component appears in your page.
Add the Title of your slideshow.
Add the optional description of your slideshow. Toggle on Include Description in order for the description to appear.
Choose a mouse action for your gallery, you can either Zoom Image (make it appear larger when clicked) or Link to a Page.
Choose the gallery layout a Standard Grid or Layout Grid.
If set to yes, you can optionally add a short description to each slide in addition to a title.
Choose the aspect ratio that best fits your images. Square Image = 1:1, Landscape Image = 4:3, Portrait = 3:4, Video Image = 16:9, or Custom.
Add or Upload an Image
Click slides. Then Click on the add or upload new images button. Then choose the images from the media selector or click the Upload files button to add new images.
Click on images to activate the gallery toolbar.
Info (i) icon
Click the info icon to add story captions. Enter the caption for the image. The caption can be styled in your stylesheet in Styles. In the Advanced options you can set a custom CSS class. Stories can also be styled over all in your main Site Styles.
This is a standard caption for your slide.
Call to Action Text
This is the line of text you want to your guests to act on.
Call to Action Link
This is the url for your call to action text.
Custom CSS Class
This is the style of your Call to action.
Click on the image icon to change images or add new images to that gallery.
Clicking this icon will access the media selector. Click on the image you want to change to and then click “Add Selected Image” or Upload a new file from your computer.
Click on the crop tool to adjust the aspect ratio crop of you image. Click save to apply or the x or Cancel to close.
Click on the move tool and then drag the current image into the space of other image to swap images.
Click the link tool to set a link on the image and complete the link information. You can link to a Page, Story, Product or External link.
Click the delete button to remove an image from your gallery.
Drage slides up or down to order your slides. Slides are ordered top to bottom, the top most slide is first.
Click preview to view your gallery design. A slideshow must be added to a Page in order for it to appear on your website or in Preview view.
Use the responsive icons and slider to view your slideshow at different device widths.
You can access a slideshow in multiple ways.
1. Go to the page in Site Flow and click on “Edit Page Content.”
2. Go to Pages and click on “EDIT” on the page bar.
3. Click on the Slideshow component in the page. Then from the component toolbar click the Pencil. Then click Edit Gallery Layout.
or 4. Go to “Slideshow” from the menu
Then click “Slides” on the gallery you want to edit.
Adding Slideshows to a Page
Slideshows can be added to your pages and there is no limit on the number of slides you can add. However, too many slides will max out your pagination and slow down your page load.
To add a slideshow to a page, click on the Gallery tab and then drag in a Slideshow component.
Slideshow Page Settings
Select a Slideshow name from the pulldown menu. If it is a new slideshow you will have to also add:
Name the slideshow.
Choose an aspect ratio, 1:1, 4:3, 16:9, or Custom.
Choose a thumbnail size Small (80x60), Small Square (80x80), Large(160x90), and Custom.
Turn auto start on if you want your slideshow slides to auto advance.
Key in the number of seconds you want your slides to transition. Set the speed to be a whole second or fraction of a second.
A background slideshow uses slides that will fill the full screen. A background slideshow will look slightly different on your live site then it does in the DarkMatter Admin.
Follow the same set-up steps as as regular Slideshow.
Fixed height Slideshow
A fixed height slideshow requires a slideshow height. Set the height in the Slideshow settings.
Follow the same set-up steps as as regular Slideshow.
Slideshow Preview and Publishing
Click on Preview to preview a slideshow. You will see a Preview Unavailable notice if you haven’t added the slideshow to a page. To add the slideshow to a page click on Go To Pages, then add the slideshow component and publish the page.
The linked page icon will appear after you publish to help you navigate between the page and the gallery.
To publish a slideshow click on the Publish Slideshow button.