Summary
Goal
| Excerpt | |||||
|---|---|---|---|---|---|
Show the translated text from a text field with different translations in the Display Pattern. Add some color with CSS and truncate longer text, showing three dots.
|
Setup in Picturepark
Layer: Corporate Information
...
Text field: Title
Field Value Access
data.corporateInformation.title | translate
The Liquid filter | translate returns the value that matches the default language.
Use Case
One use case is to just show the title of a Content Item in the Detail Display Pattern.
...
Another use case is using HTML for better styling and add headlines.
| Code Block |
|---|
<h1> {{ data.corporateInformation.title | translate }} </h1> <h2> {% if data.corporateInformation.note %} {{ data.corporateInformation.title | translate }} {% endif %} <h2> |
Another use case is to show text, truncated with three dots, in red (using CSS)
| Code Block | ||
|---|---|---|
| ||
< font color = "#ff5576" > {{data.corporateInformation.title.en | translate | truncate: 5, ‘...’ }} < /font > |