Conditionals

Use IF/ELSE statements in your FeedOtter emails to show/hide elements based on the presence of content or property values.

Often it is desirable to show/hide content based on whether tag values are present. Using conditional if/else statements allow you to hide certain content based on other factors in your email. Let's walk through a few examples:

Basic IF

[% if post.image_url == true %]
<img src="[[post.image_url]]">
[% endif %]

The example above tells FeedOtter if there is an image available, to show the <img src> block in the email. If FeedOtter cannot find an image to pull into your email, it will hide this block altogether.

This can be helpful for showing/hiding banners, ad content, or even full tables of content in your HTML email.

Basic If/Else

[% if post.image_url %]
<img src="[[post.image_url]]">
[% else %]
<img src="http://placehold.it/600x400">
[% endif %]

This tells FeedOtter to pull the image from your feed content if available, but if FeedOtter cannot find a suitable image to pull, the [% else %] statement provides a default image to fall back on. So, when some posts may not have a featured image to pull, the placeholder image will appear in your email.

Ternary If/Else

[[post.image_url ? post.image_url : 'http://placehold.it/600x400']]

Providing the same outcome as the if/else statement above, this provides FeedOtter a default image to show in case your content doesn't contain images. Rather, instead of wrapping your image block with a conditional, the full string above will go into the quotation marks on your <img src="">. This works with more than just images, and can include default text when none is provided by the feed.

Hide if there is no content in a post loop

Use this for content in your HTML email template that you want to be displayed only if there is content displayed from your feed here. Most commonly seen when there are headlines or divider lines for content blocks that you want displayed for the content.

[% if feedotter.posts |length >0 %]
//display something
[% endif %]

Hide if we are at the last entry in a loop

What this conditional is saying is "if the loop index (number of repeated block) is equal to the loop length (this will be the last repeated block), hide what the below content.

In this case, you would wrap the conditional around the >hr> so that it doesn't display after the last post in a loop.

<!--## [% if loop.index != loop.length %] ##-->
<hr>
<!--## [% endif %] ##-->

Hide an image if there is no image value

<!--## [% if (post.image_url) ##-->
<img src="[[post.image_url]]">
<!--## [% endif %] ##-->

Even/Odd

Useful for alternating designs.

<!--## [% if loop.index0 is even %] ##-->
//display image-right content block
<!--## [% endif%] ##-->

<!--## [% if loop.index0 is odd %] ##-->
//display image-left content block
<!--## [% endif %] ##-->

We see a number of templates that have content blocks that alternate the text/image. See the image below as an example of when you would use this conditional statement.

Last updated