Learning Center

Fullwidth Slider and Slider Modules

For fullwidth images only:

• Use the Fullwidth Slider module
  • Click on the purple or blue + button
  • Select Fullwidth
  • Select Fullwidth Slider
• Click the duplicate icon on a slide that already exists or click the gray + button to “Add New Slide” (repeat for the number of slides/images you need)
• Upload each image as a Background Image to each slide
  • Click on the gear/settings icon for a slide
  • Scroll down to Background and click on it
  • Select the third icon over – “Background Image”
  • Click on the gray + icon to “Add Background Image”
  • Tip: If adding a background image, delete the background color (the first icon)
  • Upload or select one from your Media Library
    • Background images should be large (minimally 1600px wide)
  • Click on “Upload an image”
  • Click on the green checkmark to save the slide
• Tip: Link the entire slide under Content –> Link
• Once all slides have been added/updated, click on the green checkmark for the slider module to save it
• Save the page

For images-only on a regular-sized slider:

• Use the Slider module
  • Add a regular/blue section by clicking on the last blue or purple + button and selecting Regular
  • Add a row
  • Add a Slider module
• Click the duplicate icon on a slide that already exists or click the gray + button to “Add New Slide” (repeat for the number of slides/images you need)
• Upload each image as a Background Image to each slide
  • Click on the gear/settings icon for a slide
  • Scroll down to Background and click on it
  • Select the third icon over – “Background Image”
  • Click on the gray + icon to “Add Background Image”
  • Tip: If adding a background image, delete the background color (the first icon)
  • Upload or select one from your Media Library
    • Background images should be large (minimally 1600px wide)
  • Click on “Upload an image”
  • Click on the green checkmark to save the slide
• Tip: Link the entire slide under Content –> Link
• Once all slides have been added/updated, click on the green checkmark for the slider module to save it
• Save the page

For sliders w/ text, a button, and a foreground image or video:

• Use the Fullwidth Slider section or Slider module per the instructions above
• Click the duplicate icon on a slide that already exists or click the gray + button to “Add New Slide” (repeat for the number of slides/images you need)
• Add the Title, Button, Body, and an Image or Video as needed
• Use a solid color for the background (recommended)
• Alternatively, you can use an image for the background instead of a solid color
  • Use good background images, especially if you’re including a foreground image
  • Background images should be large (minimally 1600px wide)
  • Background images with text and/or a photo on top of it should be simple and minimal (not busy)
  • Use a Background Overlay or a Text Overlay if your image is too busy or if you have text that is similar in color to parts of the background – (found under Design –> Overlay)
• If you want the background to be the same on every slide, you can set the background (color or image) for the entire slider on the main slider settings under Content –> Background
• Tip: Do NOT link the entire slide if you have a button that you want users to click; otherwise, link the entire slide

Styling

• The slider has its own settings – set those first – then tweak each individual slide as you need to

Rotating

• Design –> Animation
• Enable “Automatic Animation”
• Set the speed of rotation for your slides

Enable/Disable on Tablet/Mobile

• Advanced –> Visibility
• Select from the many options

Video Slider Module

This is a useful slider if you only need to add a slider of videos. The default setting uses a thumbnail navigation, like a carousel, but you can also set that to buttons.

Gallery Slider Module

This is an excellent way to display a slider of only images without links or text. It works best when you have images that are all the same orientation and size. However, if you do not, you can set a height for the slider under Design –> Sizing (note that this will crop all of your images to the same height). Note that the color of the arrows and pagination buttons are not editable without custom CSS.

• After adding the module and adding images, go to the Design tab and under Layout, select Slider
• Tip: Center the slider under Design –> Sizing –> Module Alignment

Fullwidth Post Slider and Post Slider Modules

This slider automatically brings in your recent posts and automatically sets the background image to the featured image of the post.

As always, if you have any questions, please submit a support ticket from your website or email us at support@worshiptimes.org.