Twig -Set variable as value - symfony

I have this piece of code inside Twig loops that will render beautiful color to every first letter of key=>value
<i class="avatar avatar-color-95 avatar-letter-c">{{ firstletter(message.firstname)}}</i>
But I want this to display color in dynamic way, different colors depending the length of the value
{% for message in pagination %}
{% set namecount = message.firstname | length %}
{#{ dump(namecount)}#}//outputs number(length)
<div class="container avatar">
<i class="avatar avatar-color-12 avatar-letter-c">{{ firstletter(message.firstname)}}</i>
{% endfor %}
I want to do it like this
<i class="avatar avatar-color-{{ namecount }} avatar-letter-{{firstletter(message.firstname)}}">
How do you do it? I tried to put qoutes between
"{{namecount}}"
and
"{{firstletter(message.firstname)}}
But it doesnt work. I cant find any docs for this in Twig docs,.How do you do it?

From the comments section...
You could just use <i class="avatar avatar-color-{{ message.firstname|length }} avatar-letter-{{ message.firstname|slice(0, 2) }}">.
Unless you are going to be using the variable again there's not much point in setting a variable rather than calling the filter/function inline.

Related

Conditional rendering liquid in Braze

I'm trying to change the color of a button depending which home country the user is from. But my rendering does not work/ does not override the current css. Is this line of code correct?
{% if {{custom_attribute.${home_country}}} == 'DE'%}
<div class="button-right btn btn-next" style="background:#992B82 !important;">
<a><p> NEXT</p></a>
</div>
{% else %}
<div class="button-right btn btn-next" style="background: #F1287E !important;">
<a><p> NEXT</p></a>
</div>
{% endif %}
If anyone is familiar with Braze, liquid conditional rendering, and if it is possible. Im grateful for any answers!

Render as multiple bagdes with an AssociationField in EasyAdmin

I got an issue with that question.
I've make this to render a "string" for a ManyToMany relation :
->formatValue(function ($value, $entity) {
return implode(",",$entity->getCategories()->toArray());
})
and it works pretty good ! But I've a question !
How can I render many badges in Index ? Because this method render one unique badge with "Value 1, Value 2"... And I want to see 2 badges, one with "Value 1" and one other with "Value 2" in the same line.
Someone know how to do that ?
I hope my question is clear.
NoƩ
You need to create a custom template that does it.
Use easy admin ->setTemplatePath() method to override your field template.
Example:
->setTemplatePath('fields/yourEntity/categories.html.twig')
And your twig template loop through each values to render it with multiple badges:
{% for value in field.value %}
<span class="badge badge-info">
{{ value }}
</span>
{% else %}
<span class="badge badge-secondary">
None
</span>
{% endfor %}
You should get a badge for each categories, you could also customize how to render those badge (with different colors ?) by using {{ value }} and any of its method to render it differently.

Drupal 8 - reach node/content needed variables in view

New user of D8 : my problem is to access to fields in a view or even in general with Drupal 8.
As we could do with ACF in Wordpress.
a {{ kint() }} crash my chrome but works with Firefox to explore the content var.
Unfortunately I do not managed to find and use fields' variables in my view.
I create a new view, which actually display the last three articles. These are well displayed in ugly list but I want to extract fields to put them in a custom html integration.
I create and use a new template for the view :
x node--view--liste-des-actualites--page-2.html.twig
In a custom parent :
x node--page-accueil.html.twig
But when I try to kint() content in my node--view--liste-des-actualites--page-2.html.twig, I have the custom field of the page (Page accueil) and can't find the article's one.
I managed to do it in my custom page but not in this view.
{%
set classes = [
'node',
'node--type-' ~ node.bundle|clean_class,
node.isPromoted() ? 'node--promoted',
node.isSticky() ? 'node--sticky',
not node.isPublished() ? 'node--unpublished',
view_mode ? 'node--view-mode-' ~ view_mode|clean_class,
'clearfix',
]
%}
{{ attach_library('classy/node') }}
<article{{ attributes.addClass(classes) }}>
<div{{ content_attributes.addClass('node__content', 'clearfix') }}>
{{ content }}
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
<a href="{{ LINK_VAR }}" class="bloc-type">
<div class="categ categ_projet">{{ CATEGORY_VAR }}</div>
<div class="img"> <img src="{{ IMAGESRC_VAR }}" alt=""> </div>
<span class="wrapper">
<p class="date">{{ DATE_VAR }}</p>
<h3>{{ TITLE_VAR }}</h3>
</span>
</a>
</div>
</div>
</article>
EDIT
I managed to guess some fields but this is definitely not a good way to find variables..
{{ node.label }} + {{ content.field_tags }} (But I do not want a rendered one, I just want the text/value)
if you use kint(); to debug large arrays can crash your browser.
I would suggest to use the devel module https://www.drupal.org/project/devel. With devel you can debug your arrays inside of the Drupal8 UI for each content type, block or view.
In my case i use the UI of devel (additional tab on each content). in the module settings, you can chose how devel debugs, the error handling and the output.
As the OP commented it is possible to use a preprocess to display the array on your site:
function <themename>_preprocess_page(&$variables) {
dpm($variables);
}

Liquid adding red boxes around html rendering

I am trying to render some Angular2 code using Jekyll and Liquid. Here's what I start with
{% highlight html %}
<button (click)="action('dec')">Decrement</button>
<span>{% raw %}{{count}}{% endraw %}</span>
<button (click)="action('inc')">Increment</button>
{% endhighlight %}
And this is what I get
The red squares have been added automatically. How do I remove them?
In your _sass/_syntax-highlighting.scss remove styles for the .err class
.err {} // Error

Liquid and Jekyll - Add CSS class on occurence of character in an array

on my site i have lists using two different kinds of styles for list items. Their occurance is uneven.
For now i edit these lists manually in html. I would like to put them inside an array in the YAML front matter and let jekyll generate the appropriate lists.
Example:
My idea is to put all list items in an array in the YAML front matter and tag those, which should be italic, with a string like 'ITALIC_':
list: [ITALIC_Main, 300g tomatoes, 1 mozzarella ball, ITALIC_Dressing, olive oil, vinegar, ...]
Is it possible to check not only the array for a certain string but
the array items too?
How can i filter the tagged array items and apply a certain css class via Jekyll?
Thanks for your help!
Vin
I think you have a modeling problem ;-) You're mixing datas and style : No Goood !
I propose a more dissociated solution, with organized datas on one place and presentation in an other.
It can be something like this :
---
title: recipe
layout: default
recipe:
ingredients:
main:
- ingredient1
- ingredient2
dressing:
- ingredient3
- ingredient4
optional:
- ingredient5
operations:
.... To be continued ...
---
<h2>Ingredients</h2>
{% for part in page.recipe.ingredients %}
<h3>{{ part[0] }}</h3>
<ul>
{% for ingredient in part[1] %}
<li>{{ ingredient }}</li>
{% endfor %}
</ul>
{% endfor %}
<h2>Operations</h2>
{% for part in page.recipe.operations %}
To be continued ...
(Not tested) You can write it as: ITALIC_Main_ and in the template loop just remove the ITALIC with
{{ site.list.item | remove_first: "ITALIC" }} - this will leave you with _Main_ which is converted to italic style in markdown.

Resources