Conditionals Statments

<section class="bar background-white">
<div class="container">
    {{ range $index, $element := sort .Site.Data.features "weight" }}
	{{ if eq (mod $index 3) 0 }}
	<div class="col-md-12">
        <div class="row">
	{{ end }}
			<div class="col-md-4">
                <div class="box-simple">
                    <div class="icon">
                        <i class="{{ .icon }}"></i>
                    </div>
                    <h3>{{ $element.name }}</h3>
                    <p>{{ $element.description | markdownify }}</p>
                </div>
            </div>
	{{ if or (eq (mod $index 3) 2) (eq $index (sub (len $.Site.Data.features) 1 )) }}
		</div>
	</div>
	{{ end }}
    {{ end }}
</div>

In above code the “if” statment in line no. 4 am not getting what is mod and 0 ?

The mod function performs modulus of two integers. That’s a complex way of saying that it returns the remainder of dividing the first value with the second.

In your case, the expression is mod $index 3. Here $index is a local variable. And with 3 as the second argument for mod, we’re looking for the remainder of dividing $index with 3.

The whole if statement expression reads if eq (mod $index 3) 0. With eq we check for equality. And so we’re looking for the situation in which the remainder of $index / 3 equals 0.

That situation happens when the $index variable is an even multiple of three. So 0, 3, 6, 9, etc. And in those situations the code inside the if statement then executes.

Hope this helps.

Yes that was very helpful. Thanks
Could you also explain this statment?

Here we check if the $index variable equals (eq) the (sub (len $.Site.Data.features) 1 ) expression.

That expression does a couple of things. First, it uses the len function to get the length of $.Site.Data.features. (That $.Site.Data.features is likely the features file in your project’s /data/ folder.) Then when the expression got that length, it uses the sub to subtract 1 from it.

So actually what we’re dong here is checking whether the value of $index equals the length of $.Site.Data.features minus 1.

You’ll typically see this kind of code when the $index variable starts at zero (and not 1 as we do with regular counting). Because if $index starts at 0 and then later on becomes the same as (len $.Site.Data.features) 1, we’ve reached the end of list/data file. (The len function doesn’t start counting at 0 but returns 1 when there’s a length of 1.) (And so there’s a need to perform a correction of minus 1.)

Hope this makes sense.

@Jura Yes thanks for the information that was very helpful. But still am wondering what does the second if statment doing.

Here is my data folder:

.-------data
-------------features

    ├── gurantee.yaml
    ├── horror.yaml
    ├── hiring best.yaml
    └── relation.yaml

In every file I have defined the “weight” key in an sequencial order.
Please explain the full workflow of the above-mentioned code (espically focusing on hugo logics).
Here is the output …

Thanks

I can’t add much more, I think.

The len $.Site.Data.features expression returns the length of $.Site.Data.features, which in your case is 4 because you posted four yaml files in the /data/features/ folder.

And so in that case the (eq $index (sub (len $.Site.Data.features) 1 )) expression returns true when the $index variable equals 3 (the length returned by len minus 1).

I’m not sure what I should do with your screenshot or request to “explain the full workflow”.

There’s really not more that the expression you mentioned does. It simply looks at the length of $.Site.Data.features. There’s no workflow and the len function is also not affected by how your theme look. Does that make sense?

@Jura Thanks This make sense and also helpful.