1

I have a node named "reviews" and a custom field named "field_rating". I created a field template named field--node--field_rating--reviews.html.twig.

I want inside the node to change the color with an if statement.

I try to do something like that:

{% for item in items %}
  {% if item.content > 5 %}
    <div style="background-color:green">{{ item.content }}</div>
  {% endif %}
{% endfor %}

but it doesn't work.

Any suggestions?

Drupal Version 8.6.1

2

You are comparing an array with a number:

item.content > 5

Try the field value instead:

element['#items'][key].value > 5

Full code example:

{% for key, item in items %}
  {% if element['#items'][key].value  > 5 %}
    <div style="background-color:green">{{ item.content }}</div>
  {% endif %}
{% endfor %}
2

Although it is of course possible to implement this kind of logic in Twig (check Hudri's comment of your question), but I would opt for using a preprocess function. In addition, I also recommend to add an extra class attribute, instead of adding an inline style. From my experience, implementing the functionality in this way provides a lot more flexibility. In your (sub-)theme's .theme or custom module's .module file, you can add something like:

/**
 * Implements hook_preprocess_field() for field_rating.
 */
function THEMENAME_preprocess_field__field_rating(&$variables) {
  foreach ($variables['items'] as &$item) {
    if ($item['#key_of_the_value_you_want_to_check'] > 5) {
      $item['content']['#attributes']['class'][] = 'extra_class_attribute';
    }
  }
}

In your css (or Sass) you can then assign the styling:

.extra_class_attribute {
  background-color: green;
}

In the case you needed a wrapping element around your field, you can set the #prefix and #suffix properties of the render array (instead of the #attributes).

  • Thank you. I used to create hooks in Drupal 6 but I am trying to understand the logic of Twig. I skipped Drupal 7 version. One question: In Drupal 6 I used to declare hooks in a template.php file inside my theme folder, is that thing still working or something similar in Drupal 8 or I must create a custom module? I have already created a custom module for a hook I made in ckeditor. Can I add an extra hook inside this module or I must create a new module one for each hook? Thank you for your reply. – Pantaleão Cydon Dec 3 '18 at 10:29
  • @PantaleãoCydon The template.php file is now <theme_name>.theme and you can place this functionality in your custom module (no need to create a new module for each hook implementation). – Watergate Dec 3 '18 at 19:32
1

I notice that you said:

I have a node named "reviews"

I just wanted to make sure that you meant that you have a Content Type with the machine name "reviews", and not a node title or pathname.

Otherwise, the field template named field--node--field_rating--reviews.html.twig might not even be sourced.

You can test this by printing a debugging statement in your twig template using one of the methods discussed here:

https://www.drupal.org/docs/8/theming/twig/discovering-and-inspecting-variables-in-twig-templates

Make sure that you only use this for local testing, and disable it on production environment.

If the debugging statement prints, then your template is being sourced. You can use dump() or kint() to discover and inspect variables until you find the correct one.

If the debugging statement does not print, turn on theme suggestions as shown here:

https://www.drupal.org/node/2358785

You may find that your twig template really needs to have a different name, such as field--node--field_rating--review.html.twig, or even just field--field_rating.html.twig.

I mention this because I tried the exact code that you pasted above, and it worked for me in an identically-named twig template, so it's possible that something else is at play.

  • 1
    Yes, I meant a content type named "reviews". My twig template file name was right. I tested. Thank you for the reply. – Pantaleão Cydon Dec 3 '18 at 10:14

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