Views Accordion

The Views Accordion module is a Views style plugin that displays the results in a JQuery accordion style. For more updated information visit the Views Accordion documentation page.

How to use the plugin

IMPORTANT: The first field in order of appearance will be the one used as the "header" or "trigger" of the accordion action.

Your view must meet these requirements:

  • Row style must be set to Fields.
  • The header field can not be set to inline.
  • If you use a separator for inline fields, be sure to wrap it in a html tag, like a span tag.

Choose Views Accordion in the Style dialog within your view, which will prompt you to configure:

  • Transition time: How fast you want the opening and closing of the sections to last for, in seconds. Default is half a second.
  • Start with the first row opened: Wether or not the first row of the view should start opened when the view is first shown. Uncheck this if you would like the accordion to start closed.
  • Use the module's default styling: If you disable this, the CSS file in the module's directory (views-accordion.css) will not be loaded. You can uncheck this if you plan on doing your own CSS styling.

Theming information

This module comes with a default style, which you can disable in the options (see above). Files included for your convinence:
  • views-acordion.css - with how the classes the author thought would be best used, mostly empty.
  • views-view-accordion.tpl.php - copy/paste into your theme directory - please the comments in this file for requirements/instructions.