Drupal Answers is a question and answer site for Drupal developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

How can I add a CSS class to a certain text field? I have a content type, "Board Member", displaying thusly, see my screen shot below if it comes through... This is the node, not a view. The text for "BIO" is typical paragraph style and size. I want it slightly bigger. The field in the content type is a "Long Text with summary". The widget used is "Text Area with a summary". I don't see any way to assign a unique CSS style to it in Drupal. Investigating CSS here, Firebug only shows this:

<div class="field field-name-body field-type-text-with-summary field-label-hidden">
<div class="field-items">
<div class="field-item even">

Why is it skipping showing that this field is the "bio". The other lines of text above it "Name" and "Board Member Role" were presenting unique classes and thusly I was able to format with css class rules to make them green and large.

I don't want to depend on the user to type in text with WYSIWYG exactly the same style with each of the board members, although that can be done since I've enabled that for FULL and Filtered HTML for that field. I just seems that I should be able to assign a CSS class to this field. I'll be using this field for TEACHERS and STAFF later on as well.

Thanks for the help.

Screen capture of a Board Member Bio

Dave N

share|improve this question
Won't drupal.org/project/field_formatter_css_class or drupal.org/project/field_formatter_class do the trick for you? – user32127 Jun 14 '14 at 19:34

Another option would be to use Display Suite if you didn't want to use hooks in template.php.

This would allow you to add the class directly from the content type edit page, this would probably be a little easier to manage if you started adding more classes to other fields.

  1. After downloading Display Suite, you would need to enable: Display Suite, Display Suite UI, Display Suite Extras.

  2. Then go to /admin/structure/ds/list/extras and check Enable Field Templates

  3. Go to your content types manage display page and use the "Select A Layout" dropdown, this will enable display suite for that view mode under that content type.

  4. Arrange your fields as needed and click the gear button to the right of the field and select Field Template: Expert

  5. Check "Field Item" or any of the wrappers and add a class and an element and you're done.

It may seem like a lot to do to complete your specific task but it will make your life much easier in the long run. I haven't built a single site without display suite since I discovered it.

share|improve this answer
This sounds like the answer I need. I'll investigate and let you know herein how I do. Thanks. – Dave N Jun 14 '14 at 18:03

You can implement hook_preprocess_field() in your template.php file. Here you can check for the field name and add the class you want. Refer here

share|improve this answer
Thanks. I'll investigate that "display suite" first and then look into your methods. – Dave N Jun 14 '14 at 18:04

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.