This video takes the first look at the Views Slideshow settings, and focuses on the transition options

Views Slideshow Settings

Let's take a look at the available settings for our slideshow.
- Go to the Featured Content view "Structure => Views => Featured Content" (admin/structure/views/view/featured_content)
- For the "Page" display, in the "Format" section, click "Settings".

At the top of the screen are some standard Views settings. The Views Slideshow settings start under the "Style" heading.

  • Skin: Default

I looked around, and wasn't able to find any skins other than the Default skin that comes with Views Slideshow. There's some basic help on creating custom skins here, but if you're not a coder, it probably won't help you much.

  • Slideshow Type: Cycle

This comes from the cycle.js javascript library that we installed earlier. When we install the Flex Slider module later, that will add an additional slideshow type.

Now on to the Cycle Options...

Cycle Options


  • Effect: fade (This is the typical slideshow effect, as it's clean and not distracting. If you'd like to see what each of the effects will look like, you can click the link in the description, which will send you over to the jQuery Cycle Plugin - Effects Browser. On that page, you can click an effect, and see it in real-time.)
  • [x] View Transition Advanced Options (Here we have some additional options for how our slides will transition.)
    • Timer delay: 5000 (This is the amount of time each slide is visible before the transition begins.)
    • Speed: 700 (This is how long the transition takes to complete.)
    • Initial slide delay offset: 0 (This option lets you add additional time before the first transition takes place. If you were to enter "2000" the first slide would display for 2 seconds, then the 5 second timer delay would begin. Thus, the first slide would be visible for 7 seconds, and each subsequent slide would be visible for 5 seconds.)
    • [x] Sync (If checked, the slide transitions occur simultaneously. If unchecked, the visible slide transitions completely before the next begins its transition. to see this in action, go to the jQuery Cycle Plugin -Effects Browser, linked above. At the bottom of the page, you can toggle the sync option. Some will have as bigger difference, but some will. Try out the blindX transition with and without the sync option to see the difference.)
    • [ ] Random (This will override the sort order of your view, and display the slides in a random order.)