Views Slideshow Xtra is an enhancement module for Views Slideshow, providing the ability to create overlays for a Views Slideshow. HTML elements are placed in <div> overlays, with overlay visibility controlled by toggling the CSS display property, so that overlays are displayed with their corresponding slide. Animation of the overlay displays is also supported.

In addition to overlay support, this module has some other useful features:

  • The Views Slideshow Xtra Example sub-module helps automate the creation of any Drupal 7 Views Slideshow. This sub-module creates a Slide content type, a default Slideshow View, and optionally, example Slide nodes.
  • There is a Slideshow setting for the number of milliseconds to pause slide transition after mouse movement. This allows the user time to click a slide overlay element if the mouse is in motion. This setting is essentially "Pause on hover" for a specified number of milliseconds.

Drupal 7

A new approach to Views Slideshow overlays has been implemented in 7.x-3.x, and represents a significant improvement. The new approach is to create overlays using Views Attachment Displays that have a Views Style Plugin called "Slideshow Overlay". This is the only approach that will be supported in Drupal 8.

To create slideshow overlays using the new approach, enable the Views Slideshow Xtra Overlay sub-module, rather than the Views Slideshow Xtra module, which uses the deprecated JSON field approach.

The Views Slideshow Xtra Example sub-module creates an example Slide content type, example Slide nodes, and a default View with two overlay attachment displays, to serve as a starting point for your slideshow.

More information is available in the README.txt file.

Drupal 6

The Drupal 6 Version uses the JSON approach, which has been deprecated in Drupal 7, in favor of the Views Attachment Display approach. If you have a large Drupal 6 Slideshow requirement (e.g. more than 100 slides) you may want to consider creating a Drupal 7 instance and using an iFrame to view the slideshows on the Drupal 6 site.

In the Drupal 6 version, HTML elements (text, links, icons etc.) are placed onto a specified slide(s) in your slideshow. The elements are created by entering text and other formatting information into a slide node text field that contains JSON formatted data. This module also provides the ability to create a custom lightbox for each slide in your slideshow. A link that invokes the custom lightbox is placed on the slide, with text and position specified in a specially named field in the Views Slidshow node.

There is an example implementation of this module at http://drupalanswer.com/vsx. This page has both SingleFrame and ThumbnailHover examples, and both examples are on one page, demonstrating that multiple slideshows may be on a single page.

The new Views 3 / Views Slideshow 6.3 compatible version is now available, be sure to use that version for sites running Views 3. The 6.3.0 version was created by doing a reverse port of the 7.3.0 version.

If you need a Views 2 compatible version, use 6.x-1.2.

More information is available in the README.txt file.

We Need Examples!

Currently the only available examples of this module are those included in the views_slideshow_xtra_examples sub-module, and they are plain unthemed examples. If you have successfully implemented this module on a live site, please post the URL to the issue: http://drupal.org/node/1543528, so others may better understand what is possible. Thanks!

Project Information