2

Here is a slice of code from my twig template, which outputs the contents of some fields into a p tag:

<p>
    {{ content.field_story_program_name }},
    {{ content.field_story_relationship}},
    {{ content.field_story_city }}, 
    {{ content.field_story_state }}
</p>

The output on the page renders a trailing white space after each field's content, which I don't want (because it creates spaces before the commas):

Local Head Start Program Provider , Head Start administrator , Los Angeles , CA

Things I've tried:

  • Based on this post, I checked my field.html.twig template to see if it's introducing spaces (it's not).
  • Tried putting a - in the {% endfor %} on that field.html.twig template anyway to see if it would help: {% endfor -%} (it didn't).
  • Put all of my values on one line in case a carriage return was being interpreted as whitespace (I think that was a Drupal 7 issue that I read) as in:
    {{ content.field_story_first_name }} {{ content.field_story_last_name }}, {{ content.field_story_program_name }}, ...etc
    But that didn't fix it
  • Tried {% spaceless %} though I know it's just for spaces between tags and so of course that didn't end up helping
  • Using the |trim Twig filter, which makes the entire value disappear and produces a rendering error. I suppose that technically solves the whitespace problem... ;)

Can anyone help give me a clue? I would like to either

  1. Find out where the extra space is coming from and turn it off there, or
  2. Use the appropriate Twig filter to remove the space
9
  • Have you tried |trim(side='right') or perhaps |raw|trim(side='right') if your field contains markup? Are your field perhaps containing linebreaks? Try using |replace({ "\n": "" })|trim(side='right') May 2, 2017 at 23:53
  • @Cyclonecode The fields themselves are simple "Text (plain)" field types with a format of "plain text", so I can't see where they could possibly be getting line breaks. I'm going to try all of your suggestions now, thanks.
    – LeraA
    May 3, 2017 at 13:32
  • |trim(side='right') produces a fatal php error "Twig_Error_Syntax: Unknown argument "side" for filter "trim(character_mask)" in "themes/gesso/templates/node/node--story.html.twig" " even though it's written exactly like the documentation says to write it (twig.sensiolabs.org/doc/2.x/filters/trim.html)
    – LeraA
    May 3, 2017 at 13:42
  • |trim(' ', 'right') produces the kind of php error where you can still see the page rendered after the error text at the top. "Warning: trim() expects at most 2 parameters, 3 given "
    – LeraA
    May 3, 2017 at 13:46
  • |raw|trim(side='right') produces a fatal php error "Twig_Error_Syntax: Unknown argument "side" for filter "trim(character_mask)"
    – LeraA
    May 3, 2017 at 13:49

1 Answer 1

7

Okay, here is what finally worked: wrap every individual field in {% spaceless %} (not just the whole block) and use render and trim together. Trim alone makes the variable disappear. Here's my markup:

<p>
  {% spaceless %}{{ content.field_story_program_name|render|trim }}{% endspaceless %},
  {% spaceless %}{{ content.field_story_relationship|render|trim }}{% endspaceless %},
  {% spaceless %}{{ content.field_story_city|render|trim }}{% endspaceless %}, 
  {{ content.field_story_state }}
</p>

Extra thanks to @Cyclonecode for giving me a variety of tricks to try.

1
  • This works for removing trailing slashes as well. You're genius @Leraa. {% spaceless %}{{ front|render|trim('/') }}{% endspaceless %} May 4, 2018 at 1:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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