You are here

README.txt in Views Slideshow Xtra 6.3

Same filename and directory in other branches
  1. 8.4 README.txt
  2. 7.3 README.txt
  3. 7 README.txt
  4. 7.2 README.txt
README.TXT for the Views Slideshow Xtra (VSX) Module - Drupal 6 / Views 3.  

The purpose of this module is to create an easy way to place HTML elements
(text, links, icons, etc) on top of a Views Slideshow.  The HTML elements are placed in 
overlays. There are two types of overlays: one that is always present, and another that
is invoked as a lightbox.  The elements are created by entering text and other formatting
information in specially named fields in the nodes that are used for the Views Slideshow.

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 supported overlay field types are:

VSX Type: Text
CCK Field Name: field_vsx_text
CCK Field Type: Text
Format: {top:999, left:999}Text Here

VSX Type: Link
CCK Field Name: field_vsx_link
CCK Field Type: Text
Format: {top:999, left:999, link:"http://example.com"}Link Text Here

Type: Lightbox Link
CCK Field Name: field_vsx_lightbox_link
CCK Field Type: Text
Format: {top:999, left:999, link:"http://example.com"}Lightbox Link Text Here


The supported Lightbox field types are:

Type: Lightbox Title
CCK Field Name: field_vsx_lightbox_title
CCK Field Type: Text
Format: Lightbox Title

Type: Lightbox Text
CCK Field Name: field_vsx_lightbox_text
CCK Field Type: Text
Format: Lightbox Text

Type: Lightbox Video
CCK Field Name: field_vsx_lightbox_video
CCK Field Type: Embedded Video
Format: Any valid embedded video string, e.g. a link to a YouTube video, etc.


Some Notes:

1. There is an 850 millisecond delay before the overlay elements are displayed.  
This was added to avoid issues with font pixelation in IE that may occur
when text is located in an area where a jQuery Cycle transition takes place.
Eventually the length of this delay will be configurable by slide show and element type.

2. To fine tune your slideshow, you will need to override some of the CSS rules found in 
views-slideshow-xtra.css, located in the module directory.  Don't change views-slideshow-xtra.css,
but rather override its CSS rules as required in your theme's CSS files.

3. Layout of the lightbox fields is controlled by rules in views-slideshow-xtra.css.  The default 
layout has the title across the top and lightbox text and video floated left below the title. You can 
change this by overriding the floats, heights, padding, etc. found in views-slideshow-xtra.css.

4. Whenever the mouse is moved over the slideshow, the show is paused for two seconds.  This is 
done to prevent the situation where a user moves the mouse pointer towards a link and the slide
transitions before the user is able to click the link.  As long as the mouse is moving, the 
slides will not transition for two seconds.
 
5. To put a mask over the slideshow, apply a background image to the div with class 
".views-slideshow-xtra-overlay".

6. If you don't want to create the JSON formatted data manually, or have overlay content
in several fields, e.g. a Title and some text in the body field or other text fields, 
use a computed field.  A computed field can be used to aggregate the content of multiple fields 
into a single JSON formatted field.  Here is an example of the PHP code for the computed field
definition from a working site:

$json = array(
  'type' => 'text',
  'text' => $node->body,
);
$node_field[0]['value'] =json_encode($json);


File

README.txt
View source
  1. README.TXT for the Views Slideshow Xtra (VSX) Module - Drupal 6 / Views 3.
  2. The purpose of this module is to create an easy way to place HTML elements
  3. (text, links, icons, etc) on top of a Views Slideshow. The HTML elements are placed in
  4. overlays. There are two types of overlays: one that is always present, and another that
  5. is invoked as a lightbox. The elements are created by entering text and other formatting
  6. information in specially named fields in the nodes that are used for the Views Slideshow.
  7. There is an example implementation of this module at http://drupalanswer.com/vsx. This
  8. page has both SingleFrame and ThumbnailHover examples, and both examples are on one page,
  9. demonstrating that multiple slideshows may be on a single page.
  10. The supported overlay field types are:
  11. VSX Type: Text
  12. CCK Field Name: field_vsx_text
  13. CCK Field Type: Text
  14. Format: {top:999, left:999}Text Here
  15. VSX Type: Link
  16. CCK Field Name: field_vsx_link
  17. CCK Field Type: Text
  18. Format: {top:999, left:999, link:"http://example.com"}Link Text Here
  19. Type: Lightbox Link
  20. CCK Field Name: field_vsx_lightbox_link
  21. CCK Field Type: Text
  22. Format: {top:999, left:999, link:"http://example.com"}Lightbox Link Text Here
  23. The supported Lightbox field types are:
  24. Type: Lightbox Title
  25. CCK Field Name: field_vsx_lightbox_title
  26. CCK Field Type: Text
  27. Format: Lightbox Title
  28. Type: Lightbox Text
  29. CCK Field Name: field_vsx_lightbox_text
  30. CCK Field Type: Text
  31. Format: Lightbox Text
  32. Type: Lightbox Video
  33. CCK Field Name: field_vsx_lightbox_video
  34. CCK Field Type: Embedded Video
  35. Format: Any valid embedded video string, e.g. a link to a YouTube video, etc.
  36. Some Notes:
  37. 1. There is an 850 millisecond delay before the overlay elements are displayed.
  38. This was added to avoid issues with font pixelation in IE that may occur
  39. when text is located in an area where a jQuery Cycle transition takes place.
  40. Eventually the length of this delay will be configurable by slide show and element type.
  41. 2. To fine tune your slideshow, you will need to override some of the CSS rules found in
  42. views-slideshow-xtra.css, located in the module directory. Don't change views-slideshow-xtra.css,
  43. but rather override its CSS rules as required in your theme's CSS files.
  44. 3. Layout of the lightbox fields is controlled by rules in views-slideshow-xtra.css. The default
  45. layout has the title across the top and lightbox text and video floated left below the title. You can
  46. change this by overriding the floats, heights, padding, etc. found in views-slideshow-xtra.css.
  47. 4. Whenever the mouse is moved over the slideshow, the show is paused for two seconds. This is
  48. done to prevent the situation where a user moves the mouse pointer towards a link and the slide
  49. transitions before the user is able to click the link. As long as the mouse is moving, the
  50. slides will not transition for two seconds.
  51. 5. To put a mask over the slideshow, apply a background image to the div with class
  52. ".views-slideshow-xtra-overlay".
  53. 6. If you don't want to create the JSON formatted data manually, or have overlay content
  54. in several fields, e.g. a Title and some text in the body field or other text fields,
  55. use a computed field. A computed field can be used to aggregate the content of multiple fields
  56. into a single JSON formatted field. Here is an example of the PHP code for the computed field
  57. definition from a working site:
  58. $json = array(
  59. 'type' => 'text',
  60. 'text' => $node->body,
  61. );
  62. $node_field[0]['value'] =json_encode($json);