Slider Options

Configure layout, size, transitions, autoplay, carousel mode, loader styles, and default timing settings.

Slider Options

Slider options control the whole slider project. This section now separates Source Type workflows into smaller focused pages so you can go straight to the source mode you want without reading one long page first.

Source Types In This Version

The current release documents and supports these slider source types:

  • Manual / Builder Slides
  • Posts
  • JSON import
  • YouTube Playlist

Other source integrations are reserved for future releases and are not part of the current documented feature set.

Open Slider Settings

You can open slider settings from:

  • the dashboard slider actions
  • the builder Slider Settings panel
  • the slider settings screen after creating a new slider

Typical setup flow:

  1. set the slider name and alias
  2. choose the content Source Type
  3. choose the layout
  4. set width and height
  5. choose the transition style
  6. define autoplay and pause behavior
  7. enable the navigation types you want
  8. save before building more slides

If you are creating the slider for the first time, start here before adding many slides.

Source Type Guides

Source Type decides where the slider content comes from. Use these dedicated guides for the currently supported source modes:

Choose the Right Source

Use:

  • Manual / Builder Slides when you want to design each slide by hand
  • Posts when you want one saved layout to repeat for WordPress posts or custom post types
  • JSON import when you want one saved layout to repeat for external JSON items
  • YouTube Playlist when you want one saved layout to repeat for playlist videos

External Requirements By Source Type

  • Manual / Builder Slides: no external source is required
  • Posts: uses WordPress content already stored on the site
  • JSON import: requires a trusted external JSON URL
  • YouTube Playlist: requires a YouTube Data API key and outbound requests to YouTube or Google APIs

Related note:

  • Featured Image is the slide-background mode for Posts
  • JSON Image is the slide-background mode for JSON import

Placeholder-Based Slide Templates

In source-driven slider modes such as Posts, JSON import, and YouTube Playlist, layer content can include placeholders that are replaced automatically with each item’s data.

Common placeholders include:

  • {{post_title}}
  • {{post_excerpt}}
  • {{post_content}}
  • {{featured_image}}
  • {{post_date}}
  • {{post_author}}
  • {{post_link}}
  • {{custom_field:field_name}}

In JSON import, direct JSON keys also work as placeholders.

Examples:

  • {{title}}
  • {{description}}
  • {{image_url}}
  • {{link_url}}
  • {{author.name}}

In YouTube Playlist, direct video-feed keys also work as placeholders.

Examples:

  • {{title}}
  • {{description}}
  • {{video_url}}
  • {{embed_url}}
  • {{featured_image}}
  • {{channel_title}}
  • {{published_at}}
  • {{video_id}}

Use {{video_embed}} when you want the slider to render a playable video player inside an HTML layer.

Examples:

  • a Latest News slider using {{post_title}} and {{post_excerpt}}
  • a portfolio slider using {{featured_image}} and {{custom_field:client_name}}
  • a team slider using {{post_title}}, {{post_content}}, and {{custom_field:job_title}}
  • a JSON promotional slider using {{title}}, {{description}}, and {{link_url}}
  • a YouTube playlist slider using {{title}}, {{description}}, and {{video_embed}}

For layer-level guidance on where to place these placeholders, see Layer Options.

Other Slider Option Docs

The rest of the slider-wide controls are documented separately here:

The general layout and playback settings are still summarized below for quick reference.

Layout

Available layout modes include:

  • default
  • fixed
  • fullWidth
  • fullWidthScoped
  • fullScreen

Use fixed when you want a defined design size, and use the full-width or full-screen modes for edge-to-edge presentation layouts.

[screenshot_here]

Size

The main size settings are:

  • width
  • height
  • responsive behavior

These define the visible slider canvas and how the design adapts on the front end.

Playback

Main playback settings include:

  • transition style
  • transition speed
  • transition delay
  • autoplay
  • pause on hover
  • loop
  • random start
  • random shuffle

Slider-Level Option Groups

The slider settings area controls the behavior of the whole slider project. The main option groups are:

Structure and Layout

  • layout
  • width
  • height
  • responsive

Motion and Playback

  • transition style
  • transition speed
  • transition delay
  • autoplay
  • pause on hover
  • loop
  • controls
  • dots
  • numbers
  • thumbnails
  • keyboard navigation
  • swipe navigation

Progress and Timing

  • progress bar
  • radial progress
  • default layer timing
  • manual layer exit timing

Special Modes

  • ken burns
  • carousel
  • slicebox
  • loader style

Important First Slider Settings

The first settings most users should review are:

  • Name
  • Alias
  • Slider Category
  • Screenshot
  • Layout
  • Width
  • Height
  • Transition Style
  • Transition Speed
  • Transition Delay
  • Autoplay
  • Pause on Hover
  • Responsive

These establish the main front-end behavior before you spend time styling layers.

Slider Category is optional and defaults to Any. Use it to classify sliders by business or content type, such as ecommerce, portfolio, restaurant, real estate, SaaS, or education.

[screenshot_here]

Transitions

Zoro Slider supports a large transition library including:

  • horizontal and vertical moves
  • fades
  • flips
  • cube and room effects
  • fold and unfold effects
  • carousel transitions
  • grid-based transition effects
  • slicebox transitions

Layer Timing Defaults

You can define default timing for layers so new layers inherit:

  • animation in speed
  • animation in delay
  • animation out speed
  • animation out delay

There are also separate manual exit timing controls for interrupted slide changes.

Carousel options include:

  • enable or disable carousel mode
  • normal, showcase, and gallery3d carousel types
  • visible slides count
  • center mode

Loader

You can choose a loader style for the slider loading state before the slide is ready to display.