0

I created a content type using html elements as fields and groups. The content type configuration page allows me to add classes (and id attributes) to the elements; however, they don't show up in the generated html when I view page source in a browser.

I gather from Add a CSS class to field in content type that I must modify php functions to actually include the classes in the output css; however, I'm a newbie and don't really understand the post. It refers to a blog post which is no longer available.

I can't find the function ( theme_field ) in any of my template.php files. Can someone help clarify this for me. How can I get my own classes into drupal output.

Thanks.

0

There is a much easier way, but is still complicated if you're a newbie. Install the Display Suite module and enable Display Suite & Display Suite UI

Go to Structure -> Display Suite -> CSS classes. Add as many CSS classes for fields as necessary. Go to Structure -> Content types -> [xxx] -> Manage Display and you should be able to put the classes you have defined against each of the fields.

  • I installed and enabled Display Suite. I have added classes for fields and regions, and created a new content type (simp). I added a class to a group (Div) that I created in the content type; however, when I look at the output, the classes are not present. Any thoughts about what I am doing wrong?@colinshipton – LenB Apr 6 '15 at 18:35
  • Sorry I forgot one additional thing, when you first visit the Manage Display page you will need to activate Display Suite by selecting a layout from the bottom of the page. If you just want to activate Display Suite the reset layout will be fine or you can play around with any others which define columns, etc. – Colin Shipton Apr 7 '15 at 9:46
0

You can also define Theme Hook Suggestion. In this way, not only you can define css classes for the fields, but also display them in any html format. This is the way you should do it:

If the content type is for example CT, in template.php create YourThemeName_preprocess_node(&$variables) function.

check the following condition:

if($variables['node']->type == "CT"){
}

In this way you check what the content type is. Now define the theme hook suggestion, like this:

if($variables['node']->type == "CT"){
   $suggest = "page__node__CT";
   $variables['theme_hook_suggestions'][] = $suggest;
}

create a file in the your theme directory next to the .info file and rename it to page--node--CT.tpl.php. to see it works, open this file in an editor and put this code:

<?php print "hello world";?>

Clear the cache and open a node of CT content type to see if it prints hello world in the region of $page['content'] of page.tpl.php

Now install entity module. Suppose the fields of CT content type is field_CT_field1 and field_CT_field2, then write :

if($variables['node']->type == "CT"){
   $suggest = "page__node__CT";
   $variables['theme_hook_suggestions'][] = $suggest;
   $wrapper = entity_metadata_wrapper('node',$variables['node']);
   $variables['field1'] = $wrapper->field_CT_field1->value();
   $variables['field2'] = $wrapper->field_CT_field2->value();
}

Now in page--node--CT.tpl.php you can use $field1 and $field2 as the value of the node fields and put them in any html element and assign them any css class.

  • It works, but I'm not clear on how to proceed. I have access to everything but everything is a little overwhelming. I've tried putting everything in a <div class='top'> <?php print render($content); ?> </div>, but while the resulting output does have the class I want it seems to be a teaser which is not what I want. An additional pointer would be very helpful.Thanks. – LenB Apr 6 '15 at 21:12
  • You don't need to use render($content), just use the values and display them in anyway you want – M a m a D Apr 7 '15 at 12:45

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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