---
title: "if"

doc_type: static
doc_category: static
doc_version: v20270301
source_url:
  html: 'https://developer.shopline.com/docs/handlebars/helpers/comparison/if'
  md: 'https://developer.shopline.com/docs/handlebars/helpers/comparison/if.md'
---

# if

Render the content within the expression if a condition is `true`.

```handlebars
{{#if condition }}
  content
{{/if}}
```

`condition`<br/>
Evaluable expression.

---

**content**

The render content when the condition is met.

<Example data={
  {
    "product": {
      "compare_at_price": "10.00",
      "price": "100.00"
    }
  }
}>
  ```handlebars
  {{#if product.price '>' product.compare_at_price }}
    I am a regular product.
  {{/if}}
  ```
</Example>

**else if**

You can use the `else if` tag to check multiple conditions.

```handlebars
{{#if condition }}
  content
{{else}}
  content
{{/if}}
```

<Example data={['product.type']}>
  ```handlebars
  {{#if product.type == 'Red' }}
    This is a red option!
  {{else if product.type == 'Yellow' }}
    This is a yellow option!
  {{/if}}
  ```
</Example>

**else**

Allows you to specify a default expression to be executed when none of the other conditions are met.

<Example data={['product.available']}>
  ```handlebars
  {{#if product.available }}
    This product is available!
  {{else}}
    This product is sold out!
  {{/if}}
  ```
</Example>


**Using Subexpressions in if Statements**

Handlebars natively supports [subexpression](https://handlebarsjs.com/guide/expressions.html#subexpressions), allowing you to write complex conditional statements by invoking other helpers within an if statement.


<Example data={['product.type']}>
  ```handlebars
  {{#if (lowercase product.type) == 'red' }}
    This is a red option!
  {{/if}}
  ```
</Example>

**Using and, or in if Statements**

Allows you to evaluate multiple conditions using logical `and` and `or` operators.

<Example data={['product.type', 'product.available', 'product.price']}>
  ```handlebars
  {{#if product.type == 'yellow' or product.price >= 10 and product.available }}
    This is a available yellow type product, or greater than 100 product!
  {{/if}}
  ```
</Example>