Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.Move classes out of the preprocess functions and into the Twig templates. Use the addClass() attribute method to add classes in the template. Use the clean_class filter to filter class names, if necessary. Maintain all existing functionality and ensure all existing class names are still in the markup, even ones that are inherited.
See the following issues for more detailed examples:
#2217731: Move field classes out of preprocess and into templates
#2254153: Move node classes out of preprocess and into templates
See this change record for information about using the addClass() method:
https://www.drupal.org/node/2315471
See this change record for more information about the phase 1 process of moving class from preprocess to templates:
https://www.drupal.org/node/2325067
Preprocess Functions Modified
template_preprocess_user
template_preprocess_username
Twig Templates Modified
user.html.twig
username.html.twig
| Comment | File | Size | Author |
|---|---|---|---|
| #5 | move_user_classes_from-2329779-5.patch | 2.1 KB | lauriii |
Comments
Comment #1
davidhernandezComment #2
lauriiiComment #3
davidhernandezThanks, lauriii. Just one comment. If there is only one class, you don't need to use a variable. You can add the class name directly. Like this:
<article{{ attributes.addClass('username') }}>Comment #4
davidhernandezFor future reference, more than one can be added. Like so:
<article{{ attributes.addClass('red', 'blue') }}>If there are three or more, or some logic needed to create the class name, than it is better to use the variable.
Comment #5
lauriiiI updated the patch for the simpler way to apply classes.
Comment #6
lauriiiSending to testbot also!
Comment #7
star-szr@davidhernandez and @lauriii, thanks! Is that rule from #4 documented on the parent meta? Maybe we could have a couple examples in that issue summary showing a smaller conversion like this and a more complex one like node and explaining when to use which method (basically #4 with another code sample for a longer one).
Comment #8
davidhernandezMost of that is in the draft change record, but I can copy it to the meta as instructions.
Comment #9
RainbowArrayThis looks good to me.
Comment #10
star-szr+1
Comment #11
star-szrI just manually tested both of these templates as well, the only thing that changes is the position of the class attribute within the tag.
Comment #13
alexpottCommitted 94201c5 and pushed to 8.0.x. Thanks!