Conditionals

Now that we’ve touched a bit on getting and displaying data, let’s get into conditionals. Conditionals are invaluable when using any kind of custom data.

The IF conditional

Let’s say we have a custom post type for employees of a company. With each employee we store a first name, last name and department. But not everyone may have a department set. Such a conditional would look something like this:

<h3>{{ post.meta( 'firstname' ) }} {{ post.meta( 'lastname' ) }}</h3>
{% if post.meta( 'department' ) %}
  <div>{{ post.meta( 'department' ) }}</div>
{% endif %}

Only if department isn’t blank, empty or false will it render the div and value.

ELSE IF

But what if we want to show different things for different departments? Easy, we can add an elseif statement:

<h3>{{ post.meta( 'firstname' ) }} {{ post.meta( 'lastname' ) }}</h3>
{% if post.meta( 'department' ) == 'sales' %}
  <div>The best for less</div>
{% elseif post.meta( 'department' ) == 'accounting' %}
  <div>More than just a ledger</div>
{% elseif post.meta( 'department' ) == 'hr' %}
  {# .. catchy slogan .. #}
{% endif %}

We can add more elseif statements if needed.

ELSE

But what if we want a more generic phrase? All edge cases can be assigned to the else statement:

<h3>{{ post.meta( 'firstname' ) }} {{ post.meta( 'lastname' ) }}</h3>
{% if post.meta( 'department' ) == 'sales' %}
  <div>The best for less</div>
{% elseif post.meta( 'department' ) == 'accounting' %}
  <div>More than just a ledger</div>
{% else %}
  <div>Works in {{ post.meta( 'department' ) }}</div>
{% endif %}

Shorthand Conditional

Writing a single if statement can take up several lines in the template, but can be shortened even more. By using a ternary operator, we can use a single line:

{# check if the animal is a cat #}
{{ post.meta( 'animal' ) == 'cat' ? 'Meow!' }}

When the post meta animal is cat, render ‘Meow!’. We can render an alternative by using : directly after that:

{# check if animal is cat. If not, assume it's a dog #}
{{ post.meta( 'animal' ) == 'cat' ? 'Meow!' : 'Woof!' }}

Shorthand evaluation

With the ternary operator, the first part is evaluated and it’s result is returned if true. That might be useful, for instance when we want to display the full name meta if it exists and isn’t equal to “” (empty string):

{# check for full_name, render the value when exists and not equal to empty string, render 'No full name set' if not #}
{{ post.meta( 'full_name' ) ?: 'No full name set' }}

Because we don’t compare the full name to anything, omitting a value after the ? will render the return value, in this case the meta value. If not, it will render the ‘No full name set’ string.

If we however DO compare to a value, it’s important to know that what is returned is a boolean:

{# compare full_name to 'John Doe' #}
{{ post.meta( 'full_name' ) == 'John Doe' ?: 'No value set'  }}

{# if equal to 'John Doe' this returns: #}
1

Because now the evaluated comparison is returned as the boolean true, rendering it results in ‘1’ instead of ‘John Doe’.

This problem can easily be solved by using the following code, and not relying on the return value at all.

{# compare full_name to 'John Doe' #}
{{ post.meta( 'full_name' ) == 'John Doe' ? post.meta( 'full_name' ) : 'No value set'  }}