Views Slideshow for Views 1.x

Last modified: June 9, 2009 - 00:32

Views Slideshow can be used to create a slideshow of any content (not just images) that can appear in a View. Powered by jQuery, it is heavily customizable, using global settings from the Views Slideshow configuration page (by browsing to Administer > Site building > Views > Views Slideshow, at /admin/build/views/views_slideshow).

After enabling the module, to create a Views Slideshow, simply select a slideshow type from the View Type selector. Currently, these are Slideshow Full Nodes, Slideshow List, and Slideshow Teasers. They determine what information to display, working the same as those basic types of Views, except by formatting them within a slide show.

More powerful customizations are possible by examining the possibililties of the Views Slideshow configuration page, and shown below:

Currently (as of Drupal 5.x), there is no way in the Views UI administration screens to set the previous options for a certain view. Until Views 2.0 is released, if you wish to override a global setting for a particular view slideshow, you'll need to manually set the value(s) in the Argument Handling Code of the Arguments section of the view. Note: you do not need to add an argument in order to put code in the "argument handling code" section of the view.

For instance, you might specify
$view->slideshow['sort_order'] = VIEWS_SLIDESHOW_SORT_RANDOM;
for a random slideshow,
$view->slideshow['fade_value'] = 0.5;
to fade out nodes half-way, or
$view->slideshow['timer_delay'] = 2000;
for a delay of two seconds.

Note: while you must leave out the php tags (<?php ?>), you must include a semicolon (;) at the end of each statement. If you forget, your page will not throw an error, but the new settings you've created won't work.

Also note: under certain situations, you might need to add the following statement in order to get your custom slideshow to behave properly:
$view->is_cacheable = 0;

Allowed values:

  • $view->slideshow['mode']
    • VIEWS_SLIDESHOW_MODE_SINGLE_FRAME ('single_frame'): the slideshow will be displayed in single frame mode
    • VIEWS_SLIDESHOW_MODE_THUMBNAIL_HOVER ('thumbnail_hover'): the slideshow will be displayed in thumbnail hover mode
  • $view->slideshow['teasers_last']
    • TRUE or FALSE; Only applies when the mode is VIEWS_SLIDESHOW_MODE_THUMBNAIL_HOVER. If TRUE, then teasers will be displayed before the main image. Otherwise, they will appear later in the HTML.
  • $view->slideshow['timer_delay']
    • This value should be between 0 and the number of miliseconds you wish to delay.
  • $view->slideshow['sort_order']
    • VIEWS_SLIDESHOW_SORT_REVERSE (-1): reverse order
    • VIEWS_SLIDESHOW_SORT_RANDOM (0): random order
    • VIEWS_SLIDESHOW_SORT_FORWARD (1): forward order
  • $view->slideshow['fade']
    • true or false: if false, the slideshow will change instantly, and the values for fade_speed and fade_value will be ignored.
  • $view->slideshow['fade_speed']
    • VIEWS_SLIDESHOW_FADE_SPEED_SLOW ('slow')
    • VIEWS_SLIDESHOW_FADE_SPEED_NORMAL ('normal')
    • VIEWS_SLIDESHOW_FADE_SPEED_FAST ('fast')
  • $view->slideshow['fade_value']
    • a decimal value between 0 and 1, to determine how much to fade a slide.

Quick Setup

  • Install the module as usual in your modules directory
  • Enable the module at www.example.com/admin/build/modules
  • Configure the modules settings at admin/build/views/views_slideshow
  • Create a new view at admin/build/views/add, and customize it for a slideshow as follows:
    1. Basic Information = Name your view.
    2. Enable checkbox to provide a page view or block view (or both).
    3. View Type = choose a "Slideshow" option, such as Slideshow List (best value for a typical slideshow).
    4. Nodes per block = # greater than zero.
    5. Note: if providing a Page view, you must also provide a URL.
    6. Fields = Image: Display image. Optional: choose a value from the option field for size.
    7. Filters = Node: Type "is one of" = Image (default content type for images).
    8. Optional Filter: Node Published = True.
    9. Optional Filter: Taxonomy: Terms for Image Galleries is One/All of YOUR IMAGE GALLERY.
    10. Choose the elements you want to appear in the slideshow as you normally would for any view such as node body > teaser, Attach Image: Display... any you want.
  • You can now view the slideshow as a page if you enabled the page checkbox on the view or as a block by enabling the block in your Admin/Site Building/Blocks area.

Potential uses

  • News item slideshow (such as the title, image and teaser of the last 5 news articles submitted)
  • The Last X number of X submitted (images, videos, blog entries, forum posts, comments, testimonials, etc.).
  • Rotate any image, based on any filters you can apply in views.
  • Hottest new products for any ecommerce drupal site.
  • Rotate contact links, share links, etc.
  • Heck, you could rotate entire nodes, categories, image galleries, etc. I wouldn't suggest it, but you have that power.
  • Its also a great space saver. Places where you had multiple images or multiple items such as RSS feeds or category listings can now be presented in a slideshow.

The possibilities are really endless as the more ways you can think of to categorize and add to views, the more you can rotate.

Detailed Directions

http://drupal.org/node/184785#comment-847117

 
 

Drupal is a registered trademark of Dries Buytaert.