Theme Settings


...theme settings
the images etc...

Essentials


What are these tags
There are 2 types of tags:
Will output something {{ 'output me' }} output me Logic statement {% logic %}

Logic

{% comment %}
Comments will be hidden
My name is {% comment %}Tom{% endcomment %} Smith My name is Smith
{% raw %}
No liquid will be parsed in within these tags
{% raw %} {{mustache.js}} {% endraw %}
{% if %}
"If" statements let you determine if something is true or not
if customer firstname is elvis {% if customer.firstname == 'elvis' %}
hey Elvis
{% endif %}
hey Elvis Else if example {% if customer.firstname == 'elvis' %}
hey elvis
{% elsif customer.firstname == 'Tom' %}
hey tom
{% else %}
hi stranger
{% endif %}
hey ugly
{% unless %}
If not true, then it will do something
customer firstname is not "elvis" {% unless customer.firstname == 'elvis' %}
hey ugly
{% endunless %}
hey ugly
{% case %}
Used when you have consistent cases of something
case [handle is 'cookie'] {% case handle %}
{% when 'cake' %}
This is a cake
{% when 'cookie' %}
This is a cookie
{% else %}
This is not a cookie/cake
{% endcase %}
This is a cookie
{% cycle %}
Use when you need to alternate between something.
Basic example {% cycle 'one', 'two' %}
{% cycle 'one', 'two' %}
{% cycle 'one', 'two' %}
one
two
one
Group cycles {% cycle 'group 1': 'one', 'two', 'three' %}
{% cycle 'group 1': 'one', 'two', 'three' %}
{% cycle 'group 2': 'one', 'two', 'three' %}
{% cycle 'group 2': 'one', 'two', 'three' %}
one two one two
{% for %}
Use "for loops" if you want to repeat/test something over and over
Loop options
  • limit:
  • offset:
For Loop [product are: hat, pez, pad] {% for product in collection.products %}
{{ product.name }},
{% endfor %}
hat, pez, pad, Limit [product are: hat, pez, pad] {% for product in collection.products limit:2 %}
{{ product.name }},
{% endfor %}
hat, pez,
{% tablerow %}
Generate table rows/cells
You have a few options
  • cols:
  • limit:
Example [products are: hat, pez, pad]
{{% tablerow product in collection.products cols: 2 %}

{% endtablerow %}

{{ product.title }}








hat pez
pad

{% assign %}
Create variables
{% assign myvariable = false %}
{% if myvariable != true %}
The if statement is valid
{% endif %}
The if statement is valid
{% include %}
Insert a snippet into your layout
Within the snippet color.liquid color: '{{ color }}'
shape: '{{ shape }}'
Within the template index.liquid {% assign shape = 'circle' %}
{% include 'color' %}
{% include 'color' with 'red' %}
{% include 'color' with 'blue' %}
{% assign shape = 'square' %}
{% include 'color' with 'red' %}
color: ''
shape: 'circle'
color: 'red'
shape: 'circle'
color: 'blue'
shape: 'circle'

color: 'red'
shape: 'square'

Operators

== !- > < >= <= or and
You can use operators in all the above logic statements
  • == equal
  • != not equal
  • > bigger than
  • < less than
  • >= bigger or equal
  • <= less or equal
  • or this or that
  • and must be this and that

Liquid Filters


escape(input)
Use this filter to escape a string.
{{ link.title | escape }}
append(input)
Use this filter to append characters to a string.
{{ 'sales' | append: '.jpg' }} sales.jpg
prepend(input)
Use this filter to prepend characters to a string.
size(input)
Return the size of an array or string
{{ 'this is an 30 character string' | size }} 30
join(input, segmenter = ' ')
"joins" an array with the specified character. Example:
{{ product.tags | join: ', ' }} tag1, tag2, tag3
downcase(input)
convert a input string to 'downcase'
upcase(input)
convert a input string to UPCASE
strip_html
This will strip all html tags from the text passed to the block. Useful in combination with truncate. {{ article.content | strip_html | truncate: 20 }}
strip_newlines
Removes all newlines from the input
truncate(input, characters = 100)
Truncate a string down to x characters. Take care with truncating text which has html elements in it. In these cases you probably want to run the string through the strip_html filter first (see below).
truncatewords(input, words = 15)
Truncate string down to x words
date(input, format)
Reformat a date
  • %a - The abbreviated weekday name (``Sun'')
  • %A - The full weekday name (``Sunday'')
  • %b - The abbreviated month name (``Jan'')
  • %B - The full month name (``January'')
  • %c - The preferred local date and time representation
  • %d - Day of the month (01..31)
  • %H - Hour of the day,24-hour clock (00..23)
  • %I - Hour of the day,12-hour clock (01..12)
  • %j - Day of the year (001..366)
  • %m - Month of the year (01..12)
  • %M - Minute of the hour (00..59)
  • %p - Meridian indicator (``AM'' or ``PM'')
  • %S - Second of the minute (00..60)
  • %U - Week number of the current year, starting with the first Sunday as the first day of the first week (00..53)
  • %W - Week number of the current year, starting with the first Monday as the first day of the first week (00..53)
  • %w - Day of the week (Sunday is 0,0..6)
  • %x - Preferred representation for the date alone,no time
  • %X - Preferred representation for the time alone,no date
  • %y - Year without a century (00..99)
  • %Y - Year with century
  • %Z - Time zone name
  • %% - Literal ``%'' character
first(array)
Get the first element of the passed in array
{{ product.images | first | to_img }}
last(array)
Get the last element of the passed in array
{{ product.images | last | to_img }}
newline_to_br
Inserts a
linebreak tag in front of every \n linebreak character.
replace(input, substring, replacement)
Will replace all occurrences of a string with another.
{{ product.description | replace: 'super', 'mega' }}
replace_first(input, substring, replacement)
Will replace the first occurrence of a string with another.
{{ product.description | replace_first: 'super', 'mega' }}
remove(input, substring)
Removes all occurrences of the substring from the input.
{{ product.description | remove: 'way too expensive'}}
remove_first(input, substring)
Removes only the first occurrence of the substring from the input.
{{ product.description | remove_first: 'remove-me'}}
plus(input, operand)
Gets the result of adding input to operand. When strings are passed, it parses strings as integers before adding.
Showing {{ paginate.current_offset }}-{{ paginate.current_offset | plus: paginate.page_size }} items
minus(input, operand)
Gets the result of subtracting input from operand. When strings are passed, it parses strings as integers before adding.
{{ product.price | minus: 10 | money_with_currency }}

Helpers


forloop.length
length of the entire for loop
forloop.index
index of the current iteration
forloop.index0
index of the current iteration
forloop.rindex
how many items are still left?
forloop.rindex0
how many items are still left?
forloop.first
is this the first iteration?
forloop.last
is this the last iteration?

Template variables


page.category

collection.id
Returns the id of this collection
collection.title
Returns the title of this collection
collection.handle
Returns this collection's handle, which is by default its title in lowercase. Whitespaces in the original title are replaced by dashes in the handle. The handle of a collection with the title "Winter Sale" would be "winter-sale".
collection.description
Returns the description of this collection
collection.collections
Returns a collection of all collections that are associated with this collection which match the current view. This takes into account things like paginate.
collection.products
Returns a collection of all products (described below) that are associated with this collection which match the current view.
collection.url
Returns the url for the specific collection.
collection.sort_list
Returns the different sort options for this collection. See array definition below.
product.product_id
Returns the products unique id
product.name
Returns the name of the product
product.description
Returns the description of the product
product.model
Returns the model of the product
product.image
Image options, see 'image' array definition
product.available
Returns TRUE if product is available
product.tags
Returns an array of all tags relating to this product. Use 'foreach' to iterate through them
product.variants
Returns variants associated to this product, see array definition below
product.price
Returns the formatted price of product e.g. $NZD10.00
product.price_num
Returns the numeric price of product e.g. 10.00
product.currency_code
Returns the currency code of product e.g. NZD
product.currency_symbol
Returns the currency symbol of product e.g. $
product.special
Returns the special price if it exists e.g. NZD$8.00, otherwise returns false
product.href
Returns the URL of the product
product.add
Returns the URL to add this product to the shopping cart
product.action
Returns a URL for the 'form action' to add to the shopping cart. Form tags must be wrapped around all variants.
variant.option_id
Returns the variant’s unique id
variant.name
Returns the name of product option, e.g. 'Size'
variant.value
Returns all the values relating to this variant, see array definition below
value.option_value_id
Returns the variant value unique id
value.name
Returns the name of option value, e.g. 'Blue'
value.price
Returns the price of this option value, e.g. $25.00
value.prefix
Returns the prefix of option value depending on whether it decreases or increases in value, e.g. '-' or '+'
sort_list.text
Returns the name for sort list option
sort_list.value
Returns the value for sort list option
sort_list.href
Returns the URL for sort list option

Template variables


page.information

information.id
Returns the id of this page.
information.title
Returns the title of this page
information.href
URL where the page can be found.
information.content
Returns the content of this page.

Template variables


image

image.actual
The product image URL for the original size
image.large
The product image URL which has been adjusted according to 'Large Image Size' under the current Theme Settings
image.medium
The product image URL which has been adjusted according to 'Medium Image Size' under the current Theme Settings
image.small
The product image URL which has been adjusted according to 'Small Image Size' under the current Theme Settings

Template variables


page.product

product.id
Returns the id of this product
product.title
Returns the title of this product
product.handle
Returns the sort URL 'handle' of this product
product.vendor
Returns the vendor of this product, e.g. "Sony", "Apple"
product.price
Returns the price for this product.
product.special
Returns the special price for this product. FALSE if not available.
product.url
Returns the url of this product. You need this for hyperlinking to this product's detail page from anywhere else in the store
product.featured.image
Returns the image options for the featured image. See 'image' array definition
product.images
Returns a collection of all images for this product. See array definition below
product.description
Returns the description of this product.
product.content
Alias of product.description.
product.variants
Returns a collection of all of this product's variants. See array definition below.
product.available
Returns false if all variants' quantities are zero and the store settings are set to "stop selling when sold out".
product.tags
Returns a list of the product's tags (represented by simple strings).
product.action
Returns a URL for the 'form action' to add to the shopping cart. Form tags must be wrapped around all variants.
images.title
Returns the title for the image
images.image
Returns the image options for this image. See 'image' array definition
variant.option_id
Returns the variant’s unique id
variant.name
Returns the name of product option, e.g. 'Size'
variant.value
Returns all the values relating to this variant, see array definition below
value.option_value_id
Returns the variant value unique id
value.name
Returns the name of option value, e.g. 'Blue'
value.price
Returns the price of this option value, e.g. $25.00
value.prefix
Returns the prefix of option value depending on whether it decreases or increases in value, e.g. '-' or '+'

Template variables


page.cart

cart.item_count
Returns the number of items currently in the shopping cart.
cart.items
Returns all items in the shopping cart. You will want to iterate through the return value. See array definition below.
cart.total_price
Returns the total of all the prices added up in your shopping cart.
cart.totals
Returns the list of all order totals available to cart, e.g. coupons, taxes. See array definition below.
cart.total_weight
Returns the total weight of all items in the cart combined. The unit of weight returned will be whatever the default setting is for your shop, eg. grams, KG.
cart.requires_shipping
One or more items within the cart require shipping, therefore it will go through shipping options at checkout
cart.hasstock
Returns TRUE if all items within the cart have required stock, otherwise FALSE
cart.action
Returns the URL for 'form action' to update cart
cart.checkout
Returns the URL for checkout
cart.continue
Returns the URL for home page
item.key
item.name
Returns the name of the product
item.model
Returns the model of product
item.image
Returns the image options for this product, see 'image' array definition
item.option
Returns the options customer has selected for this product. See array definition below.
item.quantity
Returns the quantity of the product
item.price
Returns the individual price of the product
item.total
Returns the total value for the product (e.g. Quantity x Price)
item.href
Returns the URL for the product
item.stock
Returns FALSE if item is out of stock
option.name
Returns the name of the option selected for this product, e.g. Colour
option.value
Returns the value of the option selected for this product, e.g. Blue
total.title
Returns title of order total line-item, e.g. Sub-total, GST Tax
total.text
Returns the formatted value of line-item, e.g. NZD$225.00
total.value
Returns the numeric value of line-item, e.g. 225.00

Template variables


layout.* (available to all layouts)

shop.name
Returns a string with the shop's name
shop.email
Returns your store's email
shop.keywords
Returns your store's keywords
shop.description
Returns a description of the shop
{% if shop.description != blank %}
{% endif %}
shop.url
Returns a full url to your shop. Note: This depends on the primary address configured under your DNS settings
shop.customer_signed_in
Returns TRUE if customer is logged in already
customer.logged
Returns TRUE if customer is logged in
customer.email
Returns a string with the customers email address
customer.firstname
Returns a string with the customers first name
customer.lastname
Returns a string with the customers last name
link.home
Returns a URL for the home page link
link.contact
Returns a URL for the contact page link
link.search
Returns a URL for the search page link
link.account
Returns a URL for the account page link
link.login
Returns a URL for the login page link
link.logout
Returns a URL for the logout link
link.checkout
Returns a URL for the checkout link
link.cart
Returns a URL for the cart link

Template variables


widget.bestseller

products
Returns a collection of 'bestseller' products. You will want to interate over this collection. see array definition below.
product.name
Returns the product name
product.price
Returns the formatted price of product e.g. $NZD10.00
product.special
Returns the special price if it exists e.g. NZD$8.00, otherwise returns false
product.href
Returns the URL of the product
product.image
Image options, see 'image' array definition

widget.cart


widget.category


widget.featured_cat


widget.featured_prod


widget.information


widget.manufacturers