The new Classy Panel Styles module fills an important gap in the Panels ecosystem: the divide between styles applied to site regions and styles applied to content.

CPS builds on the drag and drop layout freedom of Panels to empower editors with ready-made styles that their themer has whipped up for them. Editors can apply their styles to any region and pane — without having to remember class names! — and see the effects in real time on the backend Panel Pages UI.

Kendall and Derek will show you how to leverage the power of CPS to achieve responsive-layout nirvana within your existing Panels architecture. HINT: it involves a new breed of flexible panel layouts, which greatly reduces the quantity of hard-coded layouts cluttering up your site.


Panels provides a powerful layout editor and the ability to add classes to any region or pane. The challenge is that:

  • Page builders do not want to consult a reference manual each time they add a class or choose a layout, and they would like to preview a style's effects when laying out content.
  • Designers want to maintain a consistent thematic approach to elements and layout.
  • Themers and developers want to maintain a consistent but flexible DOM for the panes that are built.

This is a common problem for us at Mediacurrent: the desire to leverage the power and flexibility of Panels but a need to present the configuration in a more user friendly way. The new Classy Panel Styles module builds on the power of the Drupal ecosystem to allow themers and designers to create a simplified pool of ready-made styles for site builders to choose from when laying out their pages. These translate directly to template and class changes in the DOM in a predictable way.


This session is directed at a general audience: themers, content editors, developers, project managers, and those still unsure about Drupal.