mirror of
https://github.com/Shopify/liquid.git
synced 2026-09-26 13:45:13 -07:00
Why use collections at all? Fixing control flow too
This commit is contained in:
+3
-7
@@ -4,10 +4,6 @@ url: "http://liquidmarkup.org" # the base hostname & protocol for your site
|
|||||||
markdown: kramdown
|
markdown: kramdown
|
||||||
highlighter: pygments
|
highlighter: pygments
|
||||||
permalink: /:year/:month/:day/:basename:output_ext
|
permalink: /:year/:month/:day/:basename:output_ext
|
||||||
collections:
|
|
||||||
docs:
|
|
||||||
output: true
|
|
||||||
permalink: /docs/:path/
|
|
||||||
exclude:
|
exclude:
|
||||||
- README.md
|
- README.md
|
||||||
- CNAME
|
- CNAME
|
||||||
@@ -19,14 +15,14 @@ defaults:
|
|||||||
values:
|
values:
|
||||||
layout: "default"
|
layout: "default"
|
||||||
- scope:
|
- scope:
|
||||||
path: "docs/basics"
|
path: "basics"
|
||||||
values:
|
values:
|
||||||
type: "basics"
|
type: "basics"
|
||||||
- scope:
|
- scope:
|
||||||
path: "docs/filters"
|
path: "filters"
|
||||||
values:
|
values:
|
||||||
type: "filters"
|
type: "filters"
|
||||||
- scope:
|
- scope:
|
||||||
path: "docs/tags"
|
path: "tags"
|
||||||
values:
|
values:
|
||||||
type: "tags"
|
type: "tags"
|
||||||
|
|||||||
@@ -1,27 +0,0 @@
|
|||||||
## case/when
|
|
||||||
|
|
||||||
<p>Creates a switch statement to compare a variable with different values. <code>case</code> initializes the switch statement, and <code>when</code> compares its values.</p>
|
|
||||||
|
|
||||||
<p class="input">Input</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
{% assign handle = 'cake' %}
|
|
||||||
{% case handle %}
|
|
||||||
{% when 'cake' %}
|
|
||||||
This is a cake
|
|
||||||
{% when 'cookie' %}
|
|
||||||
This is a cookie
|
|
||||||
{% else %}
|
|
||||||
This is not a cake nor a cookie
|
|
||||||
{% endcase %}
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="output">Output</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
This is a cake
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
@@ -1,26 +0,0 @@
|
|||||||
## elsif / else
|
|
||||||
|
|
||||||
<p>Adds more conditions within an <code>if</code> or <code>unless</code> block.</p>
|
|
||||||
|
|
||||||
<p class="input">Input</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
<!-- If customer.name = 'anonymous' -->
|
|
||||||
{% if customer.name == 'kevin' %}
|
|
||||||
Hey Kevin!
|
|
||||||
{% elsif customer.name == 'anonymous' %}
|
|
||||||
Hey Anonymous!
|
|
||||||
{% else %}
|
|
||||||
Hi Stranger!
|
|
||||||
{% endif %}
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="output">Output</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
Hey Anonymous!
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
@@ -1,21 +0,0 @@
|
|||||||
## if
|
|
||||||
|
|
||||||
<p>Executes a block of code only if a certain condition is met.</p>
|
|
||||||
|
|
||||||
<p class="input">Input</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
{% if product.title == 'Awesome Shoes' %}
|
|
||||||
These shoes are awesome!
|
|
||||||
{% endif %}
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="output">Output</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
These shoes are awesome!
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
@@ -1,31 +0,0 @@
|
|||||||
## unless
|
|
||||||
|
|
||||||
<p>Similar to <code>if</code>, but executes a block of code only if a certain condition is <strong>not</strong> met.</p>
|
|
||||||
|
|
||||||
<p class="input">Input</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
{% unless product.title == 'Awesome Shoes' %}
|
|
||||||
These shoes are not awesome.
|
|
||||||
{% endunless %}
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="output">Output</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
These shoes are not awesome.
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
This would be the equivalent of doing the following:
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
{% if product.title != 'Awesome Shoes' %}
|
|
||||||
These shoes are not awesome.
|
|
||||||
{% endif %}
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
+12
-6
@@ -27,11 +27,13 @@
|
|||||||
<li>
|
<li>
|
||||||
<h3 class="section__header">Basics</h3>
|
<h3 class="section__header">Basics</h3>
|
||||||
<ul class="section__links">
|
<ul class="section__links">
|
||||||
{% for doc in site.docs %}
|
{% for doc in site.pages %}
|
||||||
{% if doc.type == "basics" %}
|
{% if doc.type == "basics" %}
|
||||||
|
{% unless doc.path contains "index.html" %}
|
||||||
<li>
|
<li>
|
||||||
<a href="/docs/{{ doc.type }}/{{ doc.title | slugify }}" class="section__link">{{ doc.title }}</a>
|
<a href="/{{ doc.type }}/{{ doc.title | slugify }}" class="section__link">{{ doc.title }}</a>
|
||||||
</li>
|
</li>
|
||||||
|
{% endunless %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
@@ -43,11 +45,13 @@
|
|||||||
<li>
|
<li>
|
||||||
<h3 class="section__header">Tags</h3>
|
<h3 class="section__header">Tags</h3>
|
||||||
<ul class="section__links">
|
<ul class="section__links">
|
||||||
{% for doc in site.docs %}
|
{% for doc in site.pages %}
|
||||||
{% if doc.type == "tags" %}
|
{% if doc.type == "tags" %}
|
||||||
|
{% unless doc.path contains "index.html" %}
|
||||||
<li>
|
<li>
|
||||||
<a href="/docs/{{ doc.type }}/{{ doc.title | slugify }}" class="section__link">{{ doc.title }}</a>
|
<a href="/{{ doc.type }}/{{ doc.title | slugify }}" class="section__link">{{ doc.title }}</a>
|
||||||
</li>
|
</li>
|
||||||
|
{% endunless %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
@@ -59,11 +63,13 @@
|
|||||||
<li>
|
<li>
|
||||||
<h3 class="section__header">Filters</h3>
|
<h3 class="section__header">Filters</h3>
|
||||||
<ul class="section__links">
|
<ul class="section__links">
|
||||||
{% for doc in site.docs %}
|
{% for doc in site.pages %}
|
||||||
{% if doc.type == "filters" %}
|
{% if doc.type == "filters" %}
|
||||||
|
{% unless doc.path contains "index.html" %}
|
||||||
<li>
|
<li>
|
||||||
<a href="/docs/{{ doc.type }}/{{ doc.title | slugify }}" class="section__link">{{ doc.title }}</a>
|
<a href="/{{ doc.type }}/{{ doc.title | slugify }}" class="section__link">{{ doc.title }}</a>
|
||||||
</li>
|
</li>
|
||||||
|
{% endunless %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
|
|||||||
@@ -1,32 +0,0 @@
|
|||||||
---
|
|
||||||
category: control-flow
|
|
||||||
---
|
|
||||||
|
|
||||||
|
|
||||||
## case/when
|
|
||||||
|
|
||||||
<p>Creates a switch statement to compare a variable with different values. <code>case</code> initializes the switch statement, and <code>when</code> compares its values.</p>
|
|
||||||
|
|
||||||
<p class="input">Input</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
{% assign handle = 'cake' %}
|
|
||||||
{% case handle %}
|
|
||||||
{% when 'cake' %}
|
|
||||||
This is a cake
|
|
||||||
{% when 'cookie' %}
|
|
||||||
This is a cookie
|
|
||||||
{% else %}
|
|
||||||
This is not a cake nor a cookie
|
|
||||||
{% endcase %}
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="output">Output</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
This is a cake
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
@@ -1,26 +0,0 @@
|
|||||||
## elsif / else
|
|
||||||
|
|
||||||
<p>Adds more conditions within an <code>if</code> or <code>unless</code> block.</p>
|
|
||||||
|
|
||||||
<p class="input">Input</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
<!-- If customer.name = 'anonymous' -->
|
|
||||||
{% if customer.name == 'kevin' %}
|
|
||||||
Hey Kevin!
|
|
||||||
{% elsif customer.name == 'anonymous' %}
|
|
||||||
Hey Anonymous!
|
|
||||||
{% else %}
|
|
||||||
Hi Stranger!
|
|
||||||
{% endif %}
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="output">Output</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
Hey Anonymous!
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
@@ -1,21 +0,0 @@
|
|||||||
## if
|
|
||||||
|
|
||||||
<p>Executes a block of code only if a certain condition is met.</p>
|
|
||||||
|
|
||||||
<p class="input">Input</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
{% if product.title == 'Awesome Shoes' %}
|
|
||||||
These shoes are awesome!
|
|
||||||
{% endif %}
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="output">Output</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
These shoes are awesome!
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
@@ -1,14 +0,0 @@
|
|||||||
---
|
|
||||||
layout: default
|
|
||||||
---
|
|
||||||
|
|
||||||
TAGS!
|
|
||||||
|
|
||||||
{% for doc in site.collections["tags"].docs %}
|
|
||||||
<div id="{{ doc.title }}" class="content__item">
|
|
||||||
<h2 class="content__header">{{ doc.title }}</h2>
|
|
||||||
<div class="content">
|
|
||||||
{{ doc.content }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{% endfor %}
|
|
||||||
@@ -1,31 +0,0 @@
|
|||||||
## unless
|
|
||||||
|
|
||||||
<p>Similar to <code>if</code>, but executes a block of code only if a certain condition is <strong>not</strong> met.</p>
|
|
||||||
|
|
||||||
<p class="input">Input</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
{% unless product.title == 'Awesome Shoes' %}
|
|
||||||
These shoes are not awesome.
|
|
||||||
{% endunless %}
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<p class="output">Output</p>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
These shoes are not awesome.
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
This would be the equivalent of doing the following:
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{% highlight html %}{% raw %}
|
|
||||||
{% if product.title != 'Awesome Shoes' %}
|
|
||||||
These shoes are not awesome.
|
|
||||||
{% endif %}
|
|
||||||
{% endraw %}{% endhighlight %}
|
|
||||||
</div>
|
|
||||||
@@ -0,0 +1,113 @@
|
|||||||
|
---
|
||||||
|
---
|
||||||
|
|
||||||
|
TAGS!
|
||||||
|
|
||||||
|
## case/when
|
||||||
|
|
||||||
|
<p>Creates a switch statement to compare a variable with different values. <code>case</code> initializes the switch statement, and <code>when</code> compares its values.</p>
|
||||||
|
|
||||||
|
<p class="input">Input</p>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{% highlight html %}{% raw %}
|
||||||
|
{% assign handle = 'cake' %}
|
||||||
|
{% case handle %}
|
||||||
|
{% when 'cake' %}
|
||||||
|
This is a cake
|
||||||
|
{% when 'cookie' %}
|
||||||
|
This is a cookie
|
||||||
|
{% else %}
|
||||||
|
This is not a cake nor a cookie
|
||||||
|
{% endcase %}
|
||||||
|
{% endraw %}{% endhighlight %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="output">Output</p>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{% highlight html %}{% raw %}
|
||||||
|
This is a cake
|
||||||
|
{% endraw %}{% endhighlight %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
## if
|
||||||
|
|
||||||
|
<p>Executes a block of code only if a certain condition is met.</p>
|
||||||
|
|
||||||
|
<p class="input">Input</p>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{% highlight html %}{% raw %}
|
||||||
|
{% if product.title == 'Awesome Shoes' %}
|
||||||
|
These shoes are awesome!
|
||||||
|
{% endif %}
|
||||||
|
{% endraw %}{% endhighlight %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="output">Output</p>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{% highlight html %}{% raw %}
|
||||||
|
These shoes are awesome!
|
||||||
|
{% endraw %}{% endhighlight %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
## elsif / else
|
||||||
|
|
||||||
|
<p>Adds more conditions within an <code>if</code> or <code>unless</code> block.</p>
|
||||||
|
|
||||||
|
<p class="input">Input</p>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{% highlight html %}{% raw %}
|
||||||
|
<!-- If customer.name = 'anonymous' -->
|
||||||
|
{% if customer.name == 'kevin' %}
|
||||||
|
Hey Kevin!
|
||||||
|
{% elsif customer.name == 'anonymous' %}
|
||||||
|
Hey Anonymous!
|
||||||
|
{% else %}
|
||||||
|
Hi Stranger!
|
||||||
|
{% endif %}
|
||||||
|
{% endraw %}{% endhighlight %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="output">Output</p>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{% highlight html %}{% raw %}
|
||||||
|
Hey Anonymous!
|
||||||
|
{% endraw %}{% endhighlight %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
## unless
|
||||||
|
|
||||||
|
<p>Similar to <code>if</code>, but executes a block of code only if a certain condition is <strong>not</strong> met.</p>
|
||||||
|
|
||||||
|
<p class="input">Input</p>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{% highlight html %}{% raw %}
|
||||||
|
{% unless product.title == 'Awesome Shoes' %}
|
||||||
|
These shoes are not awesome.
|
||||||
|
{% endunless %}
|
||||||
|
{% endraw %}{% endhighlight %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="output">Output</p>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{% highlight html %}{% raw %}
|
||||||
|
These shoes are not awesome.
|
||||||
|
{% endraw %}{% endhighlight %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
This would be the equivalent of doing the following:
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{% highlight html %}{% raw %}
|
||||||
|
{% if product.title != 'Awesome Shoes' %}
|
||||||
|
These shoes are not awesome.
|
||||||
|
{% endif %}
|
||||||
|
{% endraw %}{% endhighlight %}
|
||||||
|
</div>
|
||||||
Reference in New Issue
Block a user