Adds a formatter for text/list/taxonomy fields to render as CSS classes on nodes.

The Field formatter CSS class module allows you to set any text/list/option/taxonomy field to render as CSS class on the node. This enables the node author to select predefined CSS styling per node.

New: Shane Thomas from codekarate made short introduction video

Usage:

  • Add a text / list / option / taxonomy field to any content type (on manage fields admin page)
  • Set the display to "CSS class" (on manage display admin page)
  • Create CSS rules in your theme to match the list options or text.

Examples:

  • Create a boolean option for left/right/none content alignment.
  • Create a taxonomy for background color (think featured node).
  • Create a list option for content width / column count.
  • ...

Supported field types

This formatter can be applied to the following field types:

  • Text fields
  • List fields
  • Boolean fields
  • Taxonomy fields

Supported entity types

This formatter works with the following entity types:

  • nodes. Fields in a node can set a CSS class on the node entity.
  • field_collection module. Fields in a collection can set a CSS class on the collection entity.
  • fieldable_panels_panes.

Feel free to file an issue if you need support for other (general) kinds of entities.

Similar / related modules

See the field_formatter_class module if you need the site administrators to add classes for each display.
Try the css_field_formatters module if you need to generate inline css instead of classes.

Project information

Releases