Module Description
πΊπ¦ This module is maintained by Ukrainian developers. Please consider supporting Ukraine in a fight for their freedom and safety of Europe. Allows site administrators to add classes to the outer HTML wrapper for any field display, so that CSS and Javascript can target them.
It's particulary useful for adding classes required by various jQuery plugins and CSS grid systems.
Instructions The Field Formatter Class settings are found in the Manage display tab for content types, users, and other entities. A text box is available for each field, revealed by using the formatter settings edit button (gear wheel icon) for that field.
The class is added to the outer <div> container for the field. The default Drupal field classes (e.g. "field-type-taxonomy-term-reference") remain available - this module does not remove any classes.
The accompanying screenshot images show the settings form and some example HTML output.
This module works well in tandem with Field Group. Note that this module only adds classes to field formatters; to add classes to field groups, use the settings provided by the Field Group module.
Tutorials
* Daily Dose of Drupal - Episode 82.In this short screencast Shane Thomas demonstrates the basic features of the module.
* Drupal CMS Powerstart Tutorial 2: Responsive websites with Bootstrap 3 and Drupal.A very detailed site-building tutorial, which demonstrates how to provide Bootstrap responsive grid classes, by using Field Formatter Class and Field Group modules in tandem. It's an excellent worked example which shows where this module fits in the overall picture.
Dependencies The Drupal 7 version depends on Field Formatter Settings API module.
Known Issues There is a compatibility problem when using this module in combination with the extra fields provided by Display Suite. The issue potentially affects all modules which implement Field formatter settings API, and a solution is being explored in the Display suite project. See #1616426: Compatibility with Display Suite
It's particulary useful for adding classes required by various jQuery plugins and CSS grid systems.
Instructions The Field Formatter Class settings are found in the Manage display tab for content types, users, and other entities. A text box is available for each field, revealed by using the formatter settings edit button (gear wheel icon) for that field.
The class is added to the outer <div> container for the field. The default Drupal field classes (e.g. "field-type-taxonomy-term-reference") remain available - this module does not remove any classes.
The accompanying screenshot images show the settings form and some example HTML output.
This module works well in tandem with Field Group. Note that this module only adds classes to field formatters; to add classes to field groups, use the settings provided by the Field Group module.
Tutorials
* Daily Dose of Drupal - Episode 82.In this short screencast Shane Thomas demonstrates the basic features of the module.
* Drupal CMS Powerstart Tutorial 2: Responsive websites with Bootstrap 3 and Drupal.A very detailed site-building tutorial, which demonstrates how to provide Bootstrap responsive grid classes, by using Field Formatter Class and Field Group modules in tandem. It's an excellent worked example which shows where this module fits in the overall picture.
Dependencies The Drupal 7 version depends on Field Formatter Settings API module.
Known Issues There is a compatibility problem when using this module in combination with the extra fields provided by Display Suite. The issue potentially affects all modules which implement Field formatter settings API, and a solution is being explored in the Display suite project. See #1616426: Compatibility with Display Suite
Module Link
Project Usage
22738
Security Covered
Covered By Security Advisory
Version Available
Production
Module Summary
This module allows site administrators to add classes to the outer HTML wrapper for any field display, useful for targeting with CSS and Javascript.
Data Name
field_formatter_class