Difference between revisions of "Theme.liquid"
From Spiffy Stores Knowledge Base
m (→Overview) |
|||
| Line 1: | Line 1: | ||
== Overview == | == Overview == | ||
| − | The file '''theme.liquid'' is basically an HTML/XHTML file that contains liquid tags and provides the overall ''theme'' of the site. In this file, you will want everything that is normally included in a standard ''index.html'' page. | + | The file '''theme.liquid''' is basically an HTML/XHTML file that contains liquid tags and provides the overall ''theme'' of the site. In this file, you will want everything that is normally included in a standard ''index.html'' page. |
For example, you will need | For example, you will need | ||
| − | * A | + | * A Doctype specifying whether it's transitional or strict |
| − | * A | + | * A Head tag |
| − | * A | + | * A Body tag |
This file contains all the static elements of your site. | This file contains all the static elements of your site. | ||
| − | You must include the following two lines somewhere within the file. | + | You '''must''' include the following two lines somewhere within the file. |
* head section: | * head section: | ||
| Line 17: | Line 17: | ||
* main content area: | * main content area: | ||
<pre> {{ content_for_layout }}</pre> | <pre> {{ content_for_layout }}</pre> | ||
| − | |||
| − | + | The dynamic content is provided by the other liquid templates and the result of rendering these templates is included at the position where you included the ''content_for_layout'' tag. | |
| − | + | Normally, you will want to specify javascript and stylesheet includes in the head tag of this file. | |
| + | |||
| + | Here is an example of a javascript include tag with a liquid filter | ||
<pre>{{ 'shop.js' | asset_url | script_tag }}</pre> | <pre>{{ 'shop.js' | asset_url | script_tag }}</pre> | ||
| − | + | This is an example of a stylesheet include tag with a liquid filter | |
<pre>{{ 'shop.css' | asset_url | stylesheet_tag }}</pre> | <pre>{{ 'shop.css' | asset_url | stylesheet_tag }}</pre> | ||
| Line 31: | Line 32: | ||
=== Variables === | === Variables === | ||
| − | + | In this file you have access to the following liquid variables: | |
| − | * template | + | * [[template]] |
| − | * handle | + | * [[handle]] |
| − | * shop | + | * [[shop]] |
| − | * cart | + | * [[cart]] |
| − | * collections | + | * [[collections]] |
| − | * linklists | + | * [[linklists]] |
| − | * pages | + | * [[pages]] |
| − | * blogs | + | * [[blogs]] |
Revision as of 12:51, 3 August 2008
Overview
The file theme.liquid is basically an HTML/XHTML file that contains liquid tags and provides the overall theme of the site. In this file, you will want everything that is normally included in a standard index.html page.
For example, you will need
- A Doctype specifying whether it's transitional or strict
- A Head tag
- A Body tag
This file contains all the static elements of your site.
You must include the following two lines somewhere within the file.
- head section:
{{ content_for_header }}
- main content area:
{{ content_for_layout }}
The dynamic content is provided by the other liquid templates and the result of rendering these templates is included at the position where you included the content_for_layout tag.
Normally, you will want to specify javascript and stylesheet includes in the head tag of this file.
Here is an example of a javascript include tag with a liquid filter
{{ 'shop.js' | asset_url | script_tag }}
This is an example of a stylesheet include tag with a liquid filter
{{ 'shop.css' | asset_url | stylesheet_tag }}
Variables
In this file you have access to the following liquid variables: