Difference between revisions of "Shopify Liquid"

From the Directed Edge Developer Base
Jump to: navigation, search
Line 14: Line 14:
 
| label || A formatted label of the group. E.g. 'Recommended Items', 'Recently Viewed', etc. Those labels can be customized in the [http://shopify.directededge.com/settings#styling Directed Edge for Shopify Appearance Settings] page.
 
| label || A formatted label of the group. E.g. 'Recommended Items', 'Recently Viewed', etc. Those labels can be customized in the [http://shopify.directededge.com/settings#styling Directed Edge for Shopify Appearance Settings] page.
 
|-
 
|-
| handle || A machine friendly identifier for the group (e.g. bundle, recommended_product, etc.).
+
| handle || A machine friendly identifier for the group (e.g. bundle, recommended_product, etc.)
 
|-
 
|-
| products || A list of products that are recommended in this category.
+
| products || A list of products that are recommended for this group.
 +
The following example would print title and price of all products in all available groups:
 
<source lang="xml">
 
<source lang="xml">
 
{% for group in groups %}
 
{% for group in groups %}
Line 28: Line 29:
 
{% endfor %}
 
{% endfor %}
 
</source>
 
</source>
 +
A detailed description of all product's properties can be found [http://docs.shopify.com/themes/liquid-variables/product here].
 
|-
 
|-
| bundle || A boolean field that indicates if this group is a bundle
+
| bundle || A boolean field that indicates if this group is a bundle. This is useful to render custom content for that particular group. The following snippet would display both product images separated by a plus sign and followed by a equals sign and the bundle price:
 +
<source lang="xml">
 +
{% for group in groups %}
 +
  {% if group.bundle %}
 +
    {{ group.products.first.featured_image | product_img_url: 'small' }}
 +
    +
 +
    {{ group.products.last.featured_image | product_img_url: 'small' }}
 +
    =
 +
    {{ bundle.price }}
 +
  {% else %}
 +
    <!-- render other content here -->
 +
  {% endif %}
 +
{% endfor %}
 +
</source>
 +
|}
 +
 
 +
=== bundle ===
 +
The bundle variable is used to access supplementary information about bundles
 +
{| class="wikitable"
 +
|-
 +
| text | Bundle's buy message (e.g. 'Buy both for 20$') which can be adjusted in the [http://shopify.directededge.com/settings#bundle Directed Edge for Shopify Bundle Settings] page.
 +
|-
 +
| price | The total price of a bundle calculated using the method specified in the [http://shopify.directededge.com/settings#bundle Directed Edge for Shopify Bundle Settings] page. As any price it can be formatted with the price filter (e.g. <source lang="xml">{{ bundle.price | money }}</source>
 +
|-
 +
| buy_link | A link that will add both products to the shopping cart and will present the user a product variant chooser if necessary.
 
|}
 
|}
Following Liquid Variables are supported in custom templates:
 
* groups - An array of recommendation types with following variables
 
** handle - A machine friendly identifier for the group (e.g. bundle, recommended_product, etc.)
 
** label - A rendered label text (according to your settings)
 
** bundle - A boolean field that indicates if this group is a bundle
 
** products - An array of [http://docs.shopify.com/themes/liquid-variables/product Products]
 
* bundle
 
** text - Bundle's buy message (e.g. 'Buy both for 20$')
 
** price - The sum of a bundles price
 
** buy_link - A link that will add a bundle's products into the cart
 
  
 
== Examples ==
 
== Examples ==
 
Simple example
 
Simple example

Revision as of 00:19, 10 October 2013

Liquid Variables supported by Directed Edge

groups

The liquid variable groups contain all recommendation types that are available for the requested page.

{% for group in groups %}
  {{ group.label }}
  <ul></ul>
{% endfor %}

Each group has following properties:

label A formatted label of the group. E.g. 'Recommended Items', 'Recently Viewed', etc. Those labels can be customized in the Directed Edge for Shopify Appearance Settings page.
handle A machine friendly identifier for the group (e.g. bundle, recommended_product, etc.)
products A list of products that are recommended for this group.

The following example would print title and price of all products in all available groups:

{% for group in groups %}
  <ul>
  {% for product in group.products %}
    <li>
    <b>{{ product.title }}</b><br />
    {{ product.price | money }}
  {% endfor %}
  </ul>
{% endfor %}

A detailed description of all product's properties can be found here.

bundle A boolean field that indicates if this group is a bundle. This is useful to render custom content for that particular group. The following snippet would display both product images separated by a plus sign and followed by a equals sign and the bundle price:
{% for group in groups %}
  {% if group.bundle %}
    {{ group.products.first.featured_image | product_img_url: 'small' }}
    +
    {{ group.products.last.featured_image | product_img_url: 'small' }}
    =
    {{ bundle.price }}
  {% else %}
    <!-- render other content here -->
  {% endif %}
{% endfor %}

bundle

The bundle variable is used to access supplementary information about bundles

Bundle's buy message (e.g. 'Buy both for 20$') which can be adjusted in the Directed Edge for Shopify Bundle Settings page.
The total price of a bundle calculated using the method specified in the Directed Edge for Shopify Bundle Settings page. As any price it can be formatted with the price filter (e.g.
{{ bundle.price | money }}
A link that will add both products to the shopping cart and will present the user a product variant chooser if necessary.

Examples

Simple example