Bendy (Responsive Featured Content Banner)

Overview

Bendy is a fully responsive featured content rotating banner, slider, carousel etc...(whatever you kids are calling it these days).

Bendy is a feature module that creates a turn-key featured content rotating banner using the Views Slideshow module, Client-side Adaptive Image module and some CSS sorcery. The Views Slideshow module is not responsive out of the box and it takes a bit of work to do it. This module does it for you.

Features

• Fully responsive (Works well with the Omega - Responsive HTML5 Base Theme)
• Fluid resizing for smaller devices (smart phones, iphone) *No more display:none.
• Serves images appropriate for device viewport. No more sending large images to small devices.
• Images defined by viewport size that can be easily customized to your own specified device breakpoints in the UI. By default it is set the the breakpoints used in the Omega Base Theme.
• Support for many transition effects: blindX, blindY, blindZ, cover, curtainX, curtainY, fade, fadeZoom, growX, growY, none, scrollUp, scrollDown, scrollLeft, scrollRight, scrollHorz, scrollVert, shuffle, slideX, slideY, toss, turnUp, turnDown, turnLeft, turnRight, uncover, wipe and zoom.
• Minimalist design, so you can easily apply your own css without having to override a ton of $%!@
• Powered by jQuery. No Flash. (i.e. Works in iOS devices.)
• Works well in IE 7+
• Many settings easily customizable in the UI. (transitions, timing, add/remove fields etc..). No coding required.

Requirements

Modules:
Features
Views
Views Slideshow
Client-side adaptive image
Chaos tools
Libraries API

Libraries:
jQuery cycle plugin
json2.js

Installation

1. Download all required modules and place them in your modules folder
   (usually /sites/all/modules).
2. Download the jQuery cycle plugin (Use Full plugin with all the transition effects. Do not use the jquery.cycle.all.min.js) and place it in a folder called jquery.cycle at sites/all/libraries
   (should look like /sites/all/libraries/jquery.cycle/jquery.cycle.all.js
3. Download json2.js, rename the folder to json2 and place it in sites/all/libraries
   (should look like /sites/all/libraries/json2).
4. Enable module dependencies and Bendy at admin/modules.
5. Optional: Enable Views UI. This will be required to customize your view.

Usage

1. Go to /admin/structure/block and place the Bendy block into a region
   Note: Bendy is designed with Omega in mind. It will need to be placed in a region that covers the entire width of an Omega theme with the "Wide" layout enabled (as per the demo site and the attached screenshot). If you are using it in a theme or region that is smaller than 1200px, then you are going to have to put on your big-boy css pants and make some overrides.
2. Go to /node/add/bendy-featured-content and add some "Featured Content" .

Known Issues

#1822628: Use of uppercase in project name confuses Drush

Credits

Sponsored by Pixel Sweatshop

Similar Projects

See wiki: Comparison of Rotator / Slider modules

Recommended Modules

• Features Override: This module captures your changes to a site-specific "Override" feature and leaves the original feature untouched. Before overriding this feature with your customizations, install it and it will make it easier to upgrade to a newer version of this feature (or any feature) in the future.
• Rabbit Hole: This module can prevent this your featured content nodes from being accessible on its own page, as they should only really be viewed in the Rotating Banner