I have a transformation, used with a repeater, for a slider. All is working well. I have a slide caption, that isn't required. What I'm struggling with is a conditional statement where the caption tag doesn't show.
Here's my transformation:
<section class="imageSlide">
<figure role="group">
<img src="{% SlideImage %}" alt="{% SlideAlt %}">
<figcaption><p>{% SlideCaption %}</p></figcaption>
</figure>
</section>
What I'm hoping to do is not render the figcaption if there is no SlideCaption. SlideCaption isn't a required item. I had though if using jquery to change the display type of the <p></p> tags were empty, but want to avoid a lot of DOM manipulation.
I know that the syntax is something like this, but I haven't found a good example I can use as a base solution.
{% if(....) %}
Something like this should work. Didn't test it, so may need some tweaks.
{% IfEmpty(SlideCaption, "","<figcaption><p>" + SlideCaption + "</p></figcaption> ") %}
Another example for future reference if you dont want to be limited to using IfEmpty
{% if(SlideCaption != "" && SlideCaption != null) { return "<figcaption><p>" + SlideCaption + "</p></figcaption>" } %}
Related
Got a particular case of striptags not stripping all tags.
{% if field_video|render|striptags %}
<li class="nav-item"><a data-toggle="tab" href="#product-vid">{{ field_video['#title'] }}</a></li>
{% endif %}
The above works in removing the "title" according to field value, but leaves the margins and background color. If I use |trim it removes everything, however if a field has "title" value it also strips it.
Additional things I have tried:
|trim is not empty
What else should I look at?
Imagine we have a block template which we want to use many times on a page. And every time we need to do three things:
set a class on the top level
set a title
add some content
How to achieve this on Twig?
I know about macro, but it doesn't take content.
I know about block, but it doesn't take parameters.
So... how to do this in a normal way?
Since I don't know how, I'll use an imaginary constructs 'blockdef' and 'blockuse' later on to demonstrate the task (which is absolutely ordinary).
So let's say we have this cute Twig block template:
blocks.twig:
{% blockdef myblock(class, title) %}
<div class="block {{class}}">
<div class="inner">
<div class="title">{{title}}</div>
<div class="content">{{content}}</div>
</div>
</div>
{% endgoodblock %}
And want to use it like this:
main.twig:
{% blockuse myblock('c1', 'Title1' %}
<p>Block 1 content</p>
{% endblockuse %}
{% blockuse myblock('c2', 'Title2' %}
<p>Block 2 content</p>
{% endblockuse %}
{% blockuse myblock('c3', 'Title3' %}
<p>Block 3 content</p>
{% endblockuse %}
Is there anything like this?
UPDATE. For example, this is how it's solved on Jade:
mixin myblock(cls, title)
.block(class=cls)
.inner
.title= title
.content
block
+myblock('c1', 'Title1')
p Block 1 content
+myblock('c2', 'Title2')
p Block 2 content
+myblock('c3', 'Title3')
p Block 3 content
You could use include with:
{% include 'template.html' with {'class': 'class', 'title': 'title', 'content: 'content'} %}
I've just begun learning Twig and i'm really stuck at this stupid little issue. Concatenating this doesn't seem to work (eigenKleurInput will ultimately be a value):
{% set eigenKleurInput = "acefbf" %}
{% set customBackgroundColorInline = 'style=background-color: #' ~ eigenKleurInput %}
The output variable "customBackgroundColorInline" is put inside a div:
<section {{ customBackgroundColorInline }}>
Desired output would be
<section style="background-color: #xxx">
Thank you very much!
If I correctly understand your question the problem is about encoded character: if you add the " in your code twig render as ".
In this case you should use the raw filter as follow:
{% set eigenKleurInput = "acefbf" %}
{% set customBackgroundColorInline = 'style="background-color: #' ~ eigenKleurInput ~ '"' %}
<section {{ customBackgroundColorInline|raw }}>
So the output will be:
<section style="background-color: #acefbf">
You could try online in this working twigfiddle
Hope this help
Trying to edit a particle in Joomla -- I'm fairly new to twig and I'm trying to list information based on a selection in vertical tabs. I have an on-click refresh for my li edit that makes a tab "selected" and creates my internal url:
{% for item in particle.items %}
<li>
<a href="/Joomla/about-the-library/locations#{{ loop.index }}">{{ item.title|e }}
<img src="{{ url(item.image)|e }}" alt="{{ item.title|e }}">
<div class="g-flexslider-carousel-item-image-preview-icon"></div>
</a>
</li>
{% endfor %}
This is all well and good, but I ran into an issue when trying to display the data associated with the selected item. I tried to create a variable to check my items against, but the variable doesn't seem to be coming back as an integer, and I've tried a few things:
{% set branch = app.request.pathinfo|trim('/Joomla/about-the-library/locations#') %}
{% if loop.index == branch %}
<div class="g-flexslider-showcase-item-content-container">
<div class="g-flexslider-showcase-item-image">
<img src="{{ url(item.image)|e }}" alt="{{ item.title|e }}">
</div>
Can anyone tell me what I'm doing incorrectly?
(I found that get current url in twig template? helped, but I'm not sure I'm using the answers provided correctly. I've also sifted through the Twig Documentation for a couple hours to no avail.)
[Nov 2016] - This is still what "my" code looks like for this section. It seems to just be a problem with this if statement, as the "else" statement (which I'm using for debugging purposes) keeps coming through.
{% for item in particle.items %}
{% if app.request.get('name') == item.URLname|e %}
<p>You have branched {{ item.title|e }} correctly. </p>
So currently the codes below do the following:
class "custom-border-right-blog" if item is in the first column or second column in a 3 column row
class "last" if item is the last in the loop.
<div class="large-4 medium-12 small-12 columns {% if (loop.index is divisibleby(3) == false) %}custom-border-right-blog{% endif %}{% if loop.last %} last {% endif %}">
Is there a cleaner way to achieve this? I am quite new to twig and the way I am doing this right now seems rather messy to me.
You can use the cycle twig function to apply a class according to a modulo. This is really useful when you are applying different classes for odd and even rows. In your case, this would look like:
class="(...) {{ cycle(['custom-border-right-blog', 'custom-border-right-blog', ''], loop.index) }} (...)"
Anyway, in your specific case, your way to apply classes looks the best to me.
In terms of shortening the code for better readability i would supoose this one:
<div class="large-4 medium-12 small-12 columns {{ (loop.index % 3) ? 'custom-border-right-blog' : 'last' }}">
UPDATE:
More flexible way in case you really just need the class on the last element:
<div class="large-4 medium-12 small-12 columns {{ (loop.last) ? 'last' : 'custom-border-right-blog' }}">