7

I am trying to override a field template with my own one. The field is called field_test, so I created a field--field-test--mynodetype.html.twig template file ` in root-theme-directory/templates/, but Drupal doesn't recognize it.

I cleared the cache from the UI, enabled debug mode in settings.yaml, installed the Devel module, and re-generate the theme registry on each request, but nothing seems to help. The field gets always rendered with the default field.html.twig template.

How do I override the field template Drupal uses?

  • 1
    Just for posterity have you tried field--field_test--mynodetype.html.twig? (underscore in field name) – Clive Nov 14 '14 at 10:10
  • Did you use the twig debug output (HTML comments) to figure out the template name? I'm seeing a template suggestion that looks more like field--node--field-image--article.html.twig (note the possibly missing 'node' from your template name). – Cottser Nov 14 '14 at 14:58
  • Some docs for that are here: drupal.org/node/2358785 if that works for you I can post it as an answer. – Cottser Nov 14 '14 at 15:01
  • 1
    @TiMESPLiNTER - great. I will make sure an issue gets created to fix those docs. – Cottser Nov 14 '14 at 21:31
  • 1
    Here is the issue I promised for fixing the documentation in field.html.twig: drupal.org/node/2396553 – Cottser Dec 20 '14 at 15:50
14
+50

You need to specify the entity type (node, taxonomy_term, ...) in the template name suggestion as you specified, i.e. field--node--field-test.html.twig.

node is the entity type, and field-test is the field name.

If you want to know which template is generating a particular markup element, you can use Twig's debug option. You enable Twig debugging in sites/default/services.yml; set the value of debug in twig.config to true.

I have added the field_test field to the Article nodes, and I got the template suggestions in the HTML source.

<!-- FILE NAME SUGGESTIONS:
   * field--node--field-test--article.html.twig
   * field--node--field-test.html.twig
   * field--node--article.html.twig
   * field--field-test.html.twig
   * field--string.html.twig
   x field.html.twig
-->

After getting the suggestion, I created a template file and kept this in the templates directory of the theme.

Remember to clear the cache.

See Working With Twig Templates for more information.

3

Templates must be placed in a 'templates' directory in your theme. They won't be picked up in the root of your theme. See https://www.drupal.org/node/2349803#templates (which I just updated to note the difference from the Drupal 7 behaviour).

  • Good point, but sorry that forgot to mention that I've put them already in a folder called templates. I mean other template overrides work. So I've overwritten the default node.html.twig which works fine. But I can't override fields. – TiMESPLiNTER Nov 14 '14 at 9:49

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.