From Shopify Wiki

When designing a Shopify theme there are 5 important concepts...

Liquid

Liquid is a simple programming language that tells Shopify what to do. It is used in conjunction with HTML & CSS. There are two types of liquid tags:

• {% put stuff in here %} - this is a logic tag. Nothing will visually appear on the screen when we use this
• {{ put stuff in here }} - this is an output tag. Something will visually appear on the screen when we use this

For example, if we want to display our shop's name in our layout we use the output tags {{ }}:

<h1>{{ shop.name }}<h1>

My shop's name

The store.name is a template variable.

Template variables

template variables are pieces of data we can use in our store. Here are a few examples of popular objects

   * shop.url - returns the URL of your shop
   * product.title - returns the title of a product
   * cart.item_count - returns the total number of items in a custmer's cart

Templates

Templates control the look and feel of you store's content. Let's say a customer views one of your shop's products, Shopify will use the product.liquid template to render the product page. If a customer views your shop's blog, Shopify will use blog.liquid to render the blog page.

Templates always end in the .liquid extension

Filters

Filters manipulate the output of template variables. For example, if you want to show a customer a price of a $99.00 for a product and you write the variable {{ product.price }}, Shopify will display the price as 9900. You have to use a filter to manipulate the output of the product.price variable, so if you use the money_with_currency filter on it, the price will then display as $99.00 USD.

Filters look like this {{ variable | filtername }}. In the example above, if you use {{ product.price | money_with_currency }} in the template product.liquid, $99.00 USD will appear.

Logic Statements

Logic are conditional Liquid statements

Let's say we are working on product.liquid template and want to display the message "Free shipping", but only on products whose price is greater than $100. Since the product will either have a price greater than $100 or less than $100, the if logic statement is the most appropriate statement to use:

{% if product.price > 100 %}
  Free Shipping
{% else %}
  No free shipping
{% end if %}

There are other logic statements like {% for %} and {% unless %}