mirror of
https://github.com/harttle/liquidjs.git
synced 2026-10-03 09:05:14 -07:00
Deploying to gh-pages from @ harttle/liquidjs@292a93b738 🚀
This commit is contained in:
harttle
+7
-7
@@ -96,27 +96,27 @@
|
||||
|
||||
<p>Liquid filter that returns the absolute value of a number.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ -17 | abs }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token operator">-</span><span class="token number">17</span> <span class="token operator">|</span> <span class="token function filter">abs</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">17</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">17<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 4 | abs }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">4</span> <span class="token operator">|</span> <span class="token function filter">abs</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">4</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">4<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p><code>abs</code> will also work on a string that only contains a number:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "-19.86" | abs }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"-19.86"</span> <span class="token operator">|</span> <span class="token function filter">abs</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">19.86</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">19.86<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="overview.html" class="article-footer-prev" title="Overview"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="append.html" class="article-footer-next" title="sidebar.filters.append"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+7
-5
@@ -96,21 +96,23 @@
|
||||
|
||||
<p>Concatenates two strings and returns the concatenated value.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "/my/fancy/url" | append: ".html" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"/my/fancy/url"</span> <span class="token operator">|</span> <span class="token function filter">append</span><span class="token operator">:</span> <span class="token string">".html"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">/my/fancy/url.html</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">/my/fancy/url.html<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p><code>append</code> can also be used with variables:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign filename = "/index.html" %}</span><br><span class="line">{{ "website.com" | append: filename }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> filename <span class="token operator">=</span> <span class="token string">"/index.html"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"website.com"</span> <span class="token operator">|</span> <span class="token function filter">append</span><span class="token operator">:</span> filename <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">website.com/index.html</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">
|
||||
website.com/index.html<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="abs.html" class="article-footer-prev" title="sidebar.filters.abs"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="array_to_sentence_string.html" class="article-footer-next" title="sidebar.filters.array_to_sentence_string"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,20 +96,20 @@
|
||||
|
||||
<p>Convert an array into a sentence. Useful for listing tags. Optional argument for connector.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "foo,bar,baz" | split: "," | array_to_sentence_string }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"foo,bar,baz"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">","</span> <span class="token operator">|</span> <span class="token function filter">array_to_sentence_string</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">foo, bar, and baz</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">foo, bar, and baz<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "foo,bar,baz" | split: "," | array_to_sentence_string: "or" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"foo,bar,baz"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">","</span> <span class="token operator">|</span> <span class="token function filter">array_to_sentence_string</span><span class="token operator">:</span> <span class="token string">"or"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">foo, bar, or baz</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">foo, bar, or baz<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="append.html" class="article-footer-prev" title="sidebar.filters.append"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="at_least.html" class="article-footer-next" title="sidebar.filters.at_least"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,20 +96,20 @@
|
||||
|
||||
<p>Limits a number to a minimum value.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 4 | at_least: 5 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">4</span> <span class="token operator">|</span> <span class="token function filter">at_least</span><span class="token operator">:</span> <span class="token number">5</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">5</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">5<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 4 | at_least: 3 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">4</span> <span class="token operator">|</span> <span class="token function filter">at_least</span><span class="token operator">:</span> <span class="token number">3</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">4</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">4<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="array_to_sentence_string.html" class="article-footer-prev" title="sidebar.filters.array_to_sentence_string"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="at_most.html" class="article-footer-next" title="sidebar.filters.at_most"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,20 +96,20 @@
|
||||
|
||||
<p>Limits a number to a maximum value.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 4 | at_most: 5 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">4</span> <span class="token operator">|</span> <span class="token function filter">at_most</span><span class="token operator">:</span> <span class="token number">5</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">4</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">4<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 4 | at_most: 3 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">4</span> <span class="token operator">|</span> <span class="token function filter">at_most</span><span class="token operator">:</span> <span class="token number">3</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">3</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">3<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="at_least.html" class="article-footer-prev" title="sidebar.filters.at_least"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="capitalize.html" class="article-footer-next" title="sidebar.filters.capitalize"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,21 +96,21 @@
|
||||
|
||||
<p>Makes the first character of a string capitalized.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "title" | capitalize }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"title"</span> <span class="token operator">|</span> <span class="token function filter">capitalize</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Title</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Title<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p><code>capitalize</code> only capitalizes the first character of a string, so later words are not affected:</p>
|
||||
<p> Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "my great title" | capitalize }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"my great title"</span> <span class="token operator">|</span> <span class="token function filter">capitalize</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">My great title</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">My great title<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="at_most.html" class="article-footer-prev" title="sidebar.filters.at_most"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="ceil.html" class="article-footer-next" title="sidebar.filters.ceil"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+9
-9
@@ -96,33 +96,33 @@
|
||||
|
||||
<p>Rounds the input up to the nearest whole number. LiquidJS tries to convert the input to a number before the filter is applied.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 1.2 | ceil }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">1.2</span> <span class="token operator">|</span> <span class="token function filter">ceil</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">2</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">2<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 2.0 | ceil }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">2.0</span> <span class="token operator">|</span> <span class="token function filter">ceil</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">2</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">2<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 183.357 | ceil }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">183.357</span> <span class="token operator">|</span> <span class="token function filter">ceil</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">184</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">184<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Here the input value is a string:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "3.5" | ceil }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"3.5"</span> <span class="token operator">|</span> <span class="token function filter">ceil</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">4</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">4<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="capitalize.html" class="article-footer-prev" title="sidebar.filters.capitalize"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="cgi_escape.html" class="article-footer-next" title="sidebar.filters.cgi_escape"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>CGI escape a string for use in a URL. Replaces any special characters with appropriate <code>%XX</code> replacements. CGI escape normally replaces a space with a plus <code>+</code> sign.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "foo, bar; baz?" | cgi_escape }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"foo, bar; baz?"</span> <span class="token operator">|</span> <span class="token function filter">cgi_escape</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">foo%2C+bar%3B+baz%3F</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">foo%2C+bar%3B+baz%3F<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="ceil.html" class="article-footer-prev" title="sidebar.filters.ceil"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="compact.html" class="article-footer-next" title="sidebar.filters.compact"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+23
-5
@@ -97,21 +97,39 @@
|
||||
<p>Removes any <code>nil</code> values from an array.</p>
|
||||
<p>For this example, assume <code>site.pages</code> is an array of content pages for a website, and some of these pages have an attribute called <code>category</code> that specifies their content category. If we <code>map</code> those categories to an array, some of the array items might be <code>nil</code> if any pages do not have a <code>category</code> attribute.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% assign site_categories = site.pages | map: "category" %}</span><br><span class="line"></span><br><span class="line">{% for category in site_categories %}</span><br><span class="line">- {{ category }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> site_categories <span class="token operator">=</span> site<span class="token punctuation">.</span>pages <span class="token operator">|</span> <span class="token function filter">map</span><span class="token operator">:</span> <span class="token string">"category"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> category <span class="token keyword">in</span> site_categories <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> category <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">- business</span><br><span class="line">- celebrities</span><br><span class="line">-</span><br><span class="line">- lifestyle</span><br><span class="line">- sports</span><br><span class="line">-</span><br><span class="line">- technology</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">- business
|
||||
- celebrities
|
||||
-
|
||||
- lifestyle
|
||||
- sports
|
||||
-
|
||||
- technology<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>By using <code>compact</code> when we create our <code>site_categories</code> array, we can remove all the <code>nil</code> values in the array.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% assign site_categories = site.pages | map: "category" | compact %}</span><br><span class="line"></span><br><span class="line">{% for category in site_categories %}</span><br><span class="line">- {{ category }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> site_categories <span class="token operator">=</span> site<span class="token punctuation">.</span>pages <span class="token operator">|</span> <span class="token function filter">map</span><span class="token operator">:</span> <span class="token string">"category"</span> <span class="token operator">|</span> <span class="token function filter">compact</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> category <span class="token keyword">in</span> site_categories <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> category <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">- business</span><br><span class="line">- celebrities</span><br><span class="line">- lifestyle</span><br><span class="line">- sports</span><br><span class="line">- technology</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">- business
|
||||
- celebrities
|
||||
- lifestyle
|
||||
- sports
|
||||
- technology<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="cgi_escape.html" class="article-footer-prev" title="sidebar.filters.cgi_escape"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="concat.html" class="article-footer-next" title="sidebar.filters.concat"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+31
-5
@@ -96,21 +96,47 @@
|
||||
|
||||
<p>Concatenates (joins together) multiple arrays. The resulting array contains all the items from the input arrays.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">{% assign fruits = "apples, oranges, peaches" | split: ", " %}</span><br><span class="line">{% assign vegetables = "carrots, turnips, potatoes" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{% assign everything = fruits | concat: vegetables %}</span><br><span class="line"></span><br><span class="line">{% for item in everything %}</span><br><span class="line">- {{ item }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> fruits <span class="token operator">=</span> <span class="token string">"apples, oranges, peaches"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> vegetables <span class="token operator">=</span> <span class="token string">"carrots, turnips, potatoes"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> everything <span class="token operator">=</span> fruits <span class="token operator">|</span> <span class="token function filter">concat</span><span class="token operator">:</span> vegetables <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> everything <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">- apples</span><br><span class="line">- oranges</span><br><span class="line">- peaches</span><br><span class="line">- carrots</span><br><span class="line">- turnips</span><br><span class="line">- potatoes</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">- apples
|
||||
- oranges
|
||||
- peaches
|
||||
- carrots
|
||||
- turnips
|
||||
- potatoes<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>You can string together <code>concat</code> filters to join more than two arrays:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% assign furniture = "chairs, tables, shelves" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{% assign everything = fruits | concat: vegetables | concat: furniture %}</span><br><span class="line"></span><br><span class="line">{% for item in everything %}</span><br><span class="line">- {{ item }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> furniture <span class="token operator">=</span> <span class="token string">"chairs, tables, shelves"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> everything <span class="token operator">=</span> fruits <span class="token operator">|</span> <span class="token function filter">concat</span><span class="token operator">:</span> vegetables <span class="token operator">|</span> <span class="token function filter">concat</span><span class="token operator">:</span> furniture <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> everything <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">- apples</span><br><span class="line">- oranges</span><br><span class="line">- peaches</span><br><span class="line">- carrots</span><br><span class="line">- turnips</span><br><span class="line">- potatoes</span><br><span class="line">- chairs</span><br><span class="line">- tables</span><br><span class="line">- shelves</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">- apples
|
||||
- oranges
|
||||
- peaches
|
||||
- carrots
|
||||
- turnips
|
||||
- potatoes
|
||||
- chairs
|
||||
- tables
|
||||
- shelves<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="compact.html" class="article-footer-prev" title="sidebar.filters.compact"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="date.html" class="article-footer-next" title="sidebar.filters.date"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+13
-5
@@ -113,7 +113,11 @@
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h3 id="Examples" class="article-heading"><a href="#Examples" class="headerlink" title="Examples"></a>Examples<a class="article-anchor" href="#Examples" aria-hidden="true"></a></h3><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{{ article.published_at | date: '%a, %b %d, %y' }} => Fri, Jul 17, 15</span><br><span class="line">{{ "now" | date: "%Y-%m-%d %H:%M" }} => 2020-03-25 15:57</span><br><span class="line"></span><br><span class="line">// equivalent to setting options.dateFormat = %d%q of %b %Y at %I:%M %P %Z</span><br><span class="line">{{ '1990-12-31T23:30:28Z' | date: '%d%q of %b %Y at %I:%M %P %Z', -330 }} => 01st of Jan 1991 at 05:00 am +0530;</span><br></pre></td></tr></table></figure>
|
||||
<h3 id="Examples" class="article-heading"><a href="#Examples" class="headerlink" title="Examples"></a>Examples<a class="article-anchor" href="#Examples" aria-hidden="true"></a></h3><pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">article</span><span class="token punctuation">.</span>published_at <span class="token operator">|</span> <span class="token object">date</span><span class="token operator">:</span> <span class="token string">'%a, %b %d, %y'</span> <span class="token delimiter punctuation">}}</span></span> => Fri, Jul 17, 15
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"now"</span> <span class="token operator">|</span> <span class="token object">date</span><span class="token operator">:</span> <span class="token string">"%Y-%m-%d %H:%M"</span> <span class="token delimiter punctuation">}}</span></span> => 2020-03-25 15:57
|
||||
|
||||
// equivalent to setting options.dateFormat = %d%q of %b %Y at %I:%M %P %Z
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">'1990-12-31T23:30:28Z'</span> <span class="token operator">|</span> <span class="token object">date</span><span class="token operator">:</span> <span class="token string">'%d%q of %b %Y at %I:%M %P %Z'</span><span class="token punctuation">,</span> <span class="token operator">-</span><span class="token number">330</span> <span class="token delimiter punctuation">}}</span></span> => 01st of Jan 1991 at 05:00 am +0530;<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<h1 id="TimeZone" class="article-heading"><a href="#TimeZone" class="headerlink" title="TimeZone"></a>TimeZone<a class="article-anchor" href="#TimeZone" aria-hidden="true"></a></h1><ul>
|
||||
<li>During output, LiquidJS uses local timezone which can override by:<ul>
|
||||
@@ -131,25 +135,29 @@
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h3 id="Examples-1" class="article-heading"><a href="#Examples-1" class="headerlink" title="Examples"></a>Examples<a class="article-anchor" href="#Examples-1" aria-hidden="true"></a></h3><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">// equivalent to setting `options.timezoneOffset` to `360`</span><br><span class="line">{{ "1990-12-31T23:00:00Z" | date: "%Y-%m-%dT%H:%M:%S", 360 }} => 1990-12-31T17:00:00</span><br><span class="line">{{ "1990-12-31T23:00:00Z" | date: "%Y-%m-%dT%H:%M:%S", "Asia/Colombo" }} => 1991-01-01T04:30:00</span><br></pre></td></tr></table></figure>
|
||||
<h3 id="Examples-1" class="article-heading"><a href="#Examples-1" class="headerlink" title="Examples"></a>Examples<a class="article-anchor" href="#Examples-1" aria-hidden="true"></a></h3><pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">// equivalent to setting `options.timezoneOffset` to `360`
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"1990-12-31T23:00:00Z"</span> <span class="token operator">|</span> <span class="token object">date</span><span class="token operator">:</span> <span class="token string">"%Y-%m-%dT%H:%M:%S"</span><span class="token punctuation">,</span> <span class="token number">360</span> <span class="token delimiter punctuation">}}</span></span> => 1990-12-31T17:00:00
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"1990-12-31T23:00:00Z"</span> <span class="token operator">|</span> <span class="token object">date</span><span class="token operator">:</span> <span class="token string">"%Y-%m-%dT%H:%M:%S"</span><span class="token punctuation">,</span> <span class="token string">"Asia/Colombo"</span> <span class="token delimiter punctuation">}}</span></span> => 1991-01-01T04:30:00<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<h1 id="Input" class="article-heading"><a href="#Input" class="headerlink" title="Input"></a>Input<a class="article-anchor" href="#Input" aria-hidden="true"></a></h1><ul>
|
||||
<li><code>date</code> works on strings if they contain well-formatted dates</li>
|
||||
<li>Note that LiquidJS is using <a target="_blank" rel="noopener external nofollow noreferrer" href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date">JavaScript Date</a> to parse the input string, that means <a target="_blank" rel="noopener external nofollow noreferrer" href="https://datatracker.ietf.org/doc/html/rfc2822#page-14">IETF-compliant RFC 2822 timestamps</a> and strings in <a target="_blank" rel="noopener external nofollow noreferrer" href="https://www.ecma-international.org/ecma-262/11.0/#sec-date.parse">a version of ISO8601</a> are supported.</li>
|
||||
</ul>
|
||||
<h3 id="Examples-2" class="article-heading"><a href="#Examples-2" class="headerlink" title="Examples"></a>Examples<a class="article-anchor" href="#Examples-2" aria-hidden="true"></a></h3><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{{ "1990-12-31T23:00:00Z" | date: "%Y-%m-%dT%H:%M:%S", 360 }} => 1990-12-31T17:00:00</span><br><span class="line">{{ "March 14, 2016" | date: "%b %d, %y" }} => Mar 14, 16</span><br></pre></td></tr></table></figure>
|
||||
<h3 id="Examples-2" class="article-heading"><a href="#Examples-2" class="headerlink" title="Examples"></a>Examples<a class="article-anchor" href="#Examples-2" aria-hidden="true"></a></h3><pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"1990-12-31T23:00:00Z"</span> <span class="token operator">|</span> <span class="token object">date</span><span class="token operator">:</span> <span class="token string">"%Y-%m-%dT%H:%M:%S"</span><span class="token punctuation">,</span> <span class="token number">360</span> <span class="token delimiter punctuation">}}</span></span> => 1990-12-31T17:00:00
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"March 14, 2016"</span> <span class="token operator">|</span> <span class="token object">date</span><span class="token operator">:</span> <span class="token string">"%b %d, %y"</span> <span class="token delimiter punctuation">}}</span></span> => Mar 14, 16<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
|
||||
<h1 id="Current-Date" class="article-heading"><a href="#Current-Date" class="headerlink" title="Current Date"></a>Current Date<a class="article-anchor" href="#Current-Date" aria-hidden="true"></a></h1><ul>
|
||||
<li>To get the current time, pass the special word <code>"now"</code> or <code>"today"</code> as input</li>
|
||||
<li>Note that the value will be the current time of when the page was last generated from the template, not when the page is presented to a user if caching or static site generation is involved</li>
|
||||
</ul>
|
||||
<h3 id="Example" class="article-heading"><a href="#Example" class="headerlink" title="Example"></a>Example<a class="article-anchor" href="#Example" aria-hidden="true"></a></h3><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">Last updated on: {{ "now" | date: "%Y-%m-%d %H:%M" }} => Last updated on: 2020-03-25 15:57</span><br><span class="line">Last updated on: {{ "today" | date: "%Y-%m-%d %H:%M" }} => Last updated on: 2020-03-25 15:57</span><br></pre></td></tr></table></figure>
|
||||
<h3 id="Example" class="article-heading"><a href="#Example" class="headerlink" title="Example"></a>Example<a class="article-anchor" href="#Example" aria-hidden="true"></a></h3><pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">Last updated on: <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"now"</span> <span class="token operator">|</span> <span class="token object">date</span><span class="token operator">:</span> <span class="token string">"%Y-%m-%d %H:%M"</span> <span class="token delimiter punctuation">}}</span></span> => Last updated on: 2020-03-25 15:57
|
||||
Last updated on: <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"today"</span> <span class="token operator">|</span> <span class="token object">date</span><span class="token operator">:</span> <span class="token string">"%Y-%m-%d %H:%M"</span> <span class="token delimiter punctuation">}}</span></span> => Last updated on: 2020-03-25 15:57<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="concat.html" class="article-footer-prev" title="sidebar.filters.concat"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="date_to_long_string.html" class="article-footer-next" title="sidebar.filters.date_to_long_string"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,22 +96,22 @@
|
||||
|
||||
<p>Convert a date to long format. Same with Jekyll <code>date_to_long_string</code> filter.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ site.time | date_to_long_string }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> site<span class="token punctuation">.</span>time <span class="token operator">|</span> <span class="token function filter">date_to_long_string</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">07 November 2008</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">07 November 2008<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ site.time | date_to_long_string: "ordinal" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> site<span class="token punctuation">.</span>time <span class="token operator">|</span> <span class="token function filter">date_to_long_string</span><span class="token operator">:</span> <span class="token string">"ordinal"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">7th November 2008</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">7th November 2008<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Note that JavaScript <code>Date</code> has not timezone information, see <a href="./date.html">date</a> filter for details.</p>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="date.html" class="article-footer-prev" title="sidebar.filters.date"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="date_to_rfc822.html" class="article-footer-next" title="sidebar.filters.date_to_rfc822"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,16 +96,16 @@
|
||||
|
||||
<p>Convert a Date into the RFC-822 format used for RSS feeds, same as Jekyll filter <code>date_to_rfc822</code>.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ site.time | date_to_rfc822 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> site<span class="token punctuation">.</span>time <span class="token operator">|</span> <span class="token function filter">date_to_rfc822</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Mon, 07 Nov 2008 13:07:54 -0800</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Mon, 07 Nov 2008 13:07:54 -0800<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Note that JavaScript <code>Date</code> has not timezone information, see <a href="./date.html">date</a> filter for details.</p>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="date_to_long_string.html" class="article-footer-prev" title="sidebar.filters.date_to_long_string"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="date_to_string.html" class="article-footer-next" title="sidebar.filters.date_to_string"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,22 +96,22 @@
|
||||
|
||||
<p>Convert a date to short format. Same with Jekyll <code>date_to_string</code> filter.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ site.time | date_to_string }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> site<span class="token punctuation">.</span>time <span class="token operator">|</span> <span class="token function filter">date_to_string</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">07 Nov 2008</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">07 Nov 2008<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ site.time | date_to_string: "ordinal", "US" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> site<span class="token punctuation">.</span>time <span class="token operator">|</span> <span class="token function filter">date_to_string</span><span class="token operator">:</span> <span class="token string">"ordinal"</span><span class="token punctuation">,</span> <span class="token string">"US"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Nov 7th, 2008</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Nov 7th, 2008<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Note that JavaScript <code>Date</code> has not timezone information, see <a href="./date.html">date</a> filter for details.</p>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="date_to_rfc822.html" class="article-footer-prev" title="sidebar.filters.date_to_rfc822"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="date_to_xmlschema.html" class="article-footer-next" title="sidebar.filters.date_to_xmlschema"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,16 +96,16 @@
|
||||
|
||||
<p>Convert a Date into XML Schema (ISO 8601) format, same as Jekyll filter <code>date_to_xmlschema</code>.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ site.time | date_to_xmlschema }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> site<span class="token punctuation">.</span>time <span class="token operator">|</span> <span class="token function filter">date_to_xmlschema</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">2008-11-07T13:07:54-08:00</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">2008-11-07T13:07:54-08:00<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Note that JavaScript <code>Date</code> has not timezone information, see <a href="./date.html">date</a> filter for details.</p>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="date_to_string.html" class="article-footer-prev" title="sidebar.filters.date_to_string"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="default.html" class="article-footer-next" title="sidebar.filters.default"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+12
-9
@@ -97,38 +97,41 @@
|
||||
<p>Allows you to specify a fallback in case a value doesn’t exist. <code>default</code> will show its value if the left side is <a href="../tutorials/truthy-and-falsy.html">falsy</a> or empty (<code>string</code> or <code>Array</code>).</p>
|
||||
<p>In this example, <code>product_price</code> is not defined, so the default value is used.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ product_price | default: 2.99 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> product_price <span class="token operator">|</span> <span class="token function filter">default</span><span class="token operator">:</span> <span class="token number">2.99</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">2.99</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">2.99<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>In this example, <code>product_price</code> is defined, so the default value is not used.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign product_price = 4.99 %}</span><br><span class="line">{{ product_price | default: 2.99 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> product_price <span class="token operator">=</span> <span class="token number">4.99</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> product_price <span class="token operator">|</span> <span class="token function filter">default</span><span class="token operator">:</span> <span class="token number">2.99</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">4.99</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">4.99<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>In this example, <code>product_price</code> is empty, so the default value is used.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign product_price = "" %}</span><br><span class="line">{{ product_price | default: 2.99 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> product_price <span class="token operator">=</span> <span class="token string">""</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> product_price <span class="token operator">|</span> <span class="token function filter">default</span><span class="token operator">:</span> <span class="token number">2.99</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">2.99</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">2.99<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Allowing-false" class="article-heading"><a href="#Allowing-false" class="headerlink" title="Allowing false"></a>Allowing <code>false</code><a class="article-anchor" href="#Allowing-false" aria-hidden="true"></a></h2><p class="since">v9.32.0</p>
|
||||
|
||||
<p>To allow variables to return <code>false</code> instead of the default value, you can use the <code>allow_false</code> parameter.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign display_price = false %}</span><br><span class="line">{{ display_price | default: true, allow_false: true }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> display_price <span class="token operator">=</span> <span class="token boolean">false</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> display_price <span class="token operator">|</span> <span class="token function filter">default</span><span class="token operator">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span> allow_false<span class="token operator">:</span> <span class="token boolean">true</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">false</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">false<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="date_to_xmlschema.html" class="article-footer-prev" title="sidebar.filters.date_to_xmlschema"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="divided_by.html" class="article-footer-next" title="sidebar.filters.divided_by"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,31 +96,32 @@
|
||||
|
||||
<p>Divides a number by another number. The result is the string obtained by JavaScript <code>.toString()</code> of the result number.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 16 | divided_by: 4 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">16</span> <span class="token operator">|</span> <span class="token function filter">divided_by</span><span class="token operator">:</span> <span class="token number">4</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">4</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">4<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 5 | divided_by: 3 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">5</span> <span class="token operator">|</span> <span class="token function filter">divided_by</span><span class="token operator">:</span> <span class="token number">3</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">1.6666666666666667</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">1.6666666666666667<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>In JavaScript, float and integer shares the same type <code>number</code> and we cannot tell the difference. For example:</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// always true</span></span><br><span class="line"><span class="number">5.0</span> === <span class="number">5</span></span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token comment">// always true</span>
|
||||
<span class="token number">5.0</span> <span class="token operator">===</span> <span class="token number">5</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>You’ll need to pass another <code>integerArithmetic</code> argument to enforce integer divide:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 5 | divided_by: 3, true }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">5</span> <span class="token operator">|</span> <span class="token function filter">divided_by</span><span class="token operator">:</span> <span class="token number">3</span><span class="token punctuation">,</span> <span class="token boolean">true</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">1</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">1<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="default.html" class="article-footer-prev" title="sidebar.filters.default"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="downcase.html" class="article-footer-next" title="sidebar.filters.downcase"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,20 +96,20 @@
|
||||
|
||||
<p>Makes each character in a string lowercase. It has no effect on strings which are already all lowercase.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Parker Moore" | downcase }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Parker Moore"</span> <span class="token operator">|</span> <span class="token function filter">downcase</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">parker moore</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">parker moore<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "apple" | downcase }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"apple"</span> <span class="token operator">|</span> <span class="token function filter">downcase</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">apple</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">apple<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="divided_by.html" class="article-footer-prev" title="sidebar.filters.divided_by"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="escape.html" class="article-footer-next" title="sidebar.filters.escape"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+4
-4
@@ -96,7 +96,7 @@
|
||||
|
||||
<p>Escapes a string by replacing HTML special characters with escape sequences. It doesn’t change strings that don’t have anything to escape.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Have you read 'James & the Giant Peach'?" | escape }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Have you read 'James & the Giant Peach'?"</span> <span class="token operator">|</span> <span class="token function filter">escape</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<pre class="highlight">
|
||||
@@ -104,14 +104,14 @@ Have you read &#39;James &amp; the Giant Peach&#39;?
|
||||
</pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Tetsuro Takara" | escape }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Tetsuro Takara"</span> <span class="token operator">|</span> <span class="token function filter">escape</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Tetsuro Takara</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Tetsuro Takara<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="downcase.html" class="article-footer-prev" title="sidebar.filters.downcase"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="escape_once.html" class="article-footer-next" title="sidebar.filters.escape_once"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,7 +96,7 @@
|
||||
|
||||
<p>Escapes a string without changing existing escaped entities. It doesn’t change strings that don’t have anything to escape.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "1 < 2 & 3" | escape_once }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"1 < 2 & 3"</span> <span class="token operator">|</span> <span class="token function filter">escape_once</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<pre class="highlight">
|
||||
@@ -115,7 +115,7 @@
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="escape.html" class="article-footer-prev" title="sidebar.filters.escape"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="find.html" class="article-footer-next" title="sidebar.filters.find"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+8
-4
@@ -95,17 +95,21 @@
|
||||
<p class="since">v10.11.0</p>
|
||||
|
||||
<p>Return the first object in an array for which the queried attribute has the given value or return <code>nil</code> if no item in the array satisfies the given criteria. For the following <code>members</code> array:</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">const</span> members = [</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2013</span>, <span class="attr">name</span>: <span class="string">'Jay'</span> },</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2014</span>, <span class="attr">name</span>: <span class="string">'John'</span> },</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2014</span>, <span class="attr">name</span>: <span class="string">'Jack'</span> }</span><br><span class="line">]</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token keyword">const</span> members <span class="token operator">=</span> <span class="token punctuation">[</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2013</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'Jay'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2014</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'John'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2014</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'Jack'</span> <span class="token punctuation">}</span>
|
||||
<span class="token punctuation">]</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ members | find: "graduation_year", 2014 | json }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> members <span class="token operator">|</span> <span class="token function filter">find</span><span class="token operator">:</span> <span class="token string">"graduation_year"</span><span class="token punctuation">,</span> <span class="token number">2014</span> <span class="token operator">|</span> <span class="token function filter">json</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{"graduation_year":2014,"name":"John"}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">{"graduation_year":2014,"name":"John"}<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="escape_once.html" class="article-footer-prev" title="sidebar.filters.escape_once"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="find_exp.html" class="article-footer-next" title="sidebar.filters.find_exp"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -95,17 +95,21 @@
|
||||
<p class="since">v10.11.0</p>
|
||||
|
||||
<p>Return the first object in an array for which the given expression evaluates to true or return <code>nil</code> if no item in the array satisfies the evaluated expression.</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">const</span> members = [</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2013</span>, <span class="attr">name</span>: <span class="string">'Jay'</span> },</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2014</span>, <span class="attr">name</span>: <span class="string">'John'</span> },</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2014</span>, <span class="attr">name</span>: <span class="string">'Jack'</span> }</span><br><span class="line">]</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token keyword">const</span> members <span class="token operator">=</span> <span class="token punctuation">[</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2013</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'Jay'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2014</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'John'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2014</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'Jack'</span> <span class="token punctuation">}</span>
|
||||
<span class="token punctuation">]</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ members | find_exp: "item", "item.graduation_year == 2014" | json }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> members <span class="token operator">|</span> <span class="token function filter">find_exp</span><span class="token operator">:</span> <span class="token string">"item"</span><span class="token punctuation">,</span> <span class="token string">"item.graduation_year == 2014"</span> <span class="token operator">|</span> <span class="token function filter">json</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{"graduation_year":2014,"name":"John"}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">{"graduation_year":2014,"name":"John"}<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="find.html" class="article-footer-prev" title="sidebar.filters.find"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="first.html" class="article-footer-next" title="sidebar.filters.first"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+10
-6
@@ -96,23 +96,27 @@
|
||||
|
||||
<p>Returns the first item of an array.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Ground control to Major Tom." | split: " " | first }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Ground control to Major Tom."</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">" "</span> <span class="token operator">|</span> <span class="token function filter">first</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Ground</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Ground<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_array = "zebra, octopus, giraffe, tiger" | split: ", " %}</span><br><span class="line">{{ my_array.first }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_array <span class="token operator">=</span> <span class="token string">"zebra, octopus, giraffe, tiger"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> my_array<span class="token punctuation">.</span><span class="token function">first</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">zebra</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">
|
||||
zebra<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>You can use <code>first</code> with dot notation when you need to use the filter inside a tag:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% if my_array.first == "zebra" %}</span><br><span class="line"> Here comes a zebra!</span><br><span class="line">{% endif %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">if</span> my_array<span class="token punctuation">.</span><span class="token function">first</span> <span class="token operator">==</span> <span class="token string">"zebra"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
Here comes a zebra!
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endif</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="find_exp.html" class="article-footer-prev" title="sidebar.filters.find_exp"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="floor.html" class="article-footer-next" title="sidebar.filters.floor"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+9
-9
@@ -96,33 +96,33 @@
|
||||
|
||||
<p>Rounds the input down to the nearest whole number. LiquidJS tries to convert the input to a number before the filter is applied.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 1.2 | floor }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">1.2</span> <span class="token operator">|</span> <span class="token function filter">floor</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">1</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">1<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 2.0 | floor }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">2.0</span> <span class="token operator">|</span> <span class="token function filter">floor</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">2</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">2<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 183.357 | floor }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">183.357</span> <span class="token operator">|</span> <span class="token function filter">floor</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">183</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">183<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Here the input value is a string:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "3.5" | floor }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"3.5"</span> <span class="token operator">|</span> <span class="token function filter">floor</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">3</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">3<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="first.html" class="article-footer-prev" title="sidebar.filters.first"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="group_by.html" class="article-footer-next" title="sidebar.filters.group_by"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+31
-4
@@ -95,17 +95,44 @@
|
||||
<p class="since">v10.11.0</p>
|
||||
|
||||
<p>Group an array’s items by a given property. For <code>members</code> array:</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">const</span> members = [</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2003</span>, <span class="attr">name</span>: <span class="string">'Jay'</span> },</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2003</span>, <span class="attr">name</span>: <span class="string">'John'</span> },</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2004</span>, <span class="attr">name</span>: <span class="string">'Jack'</span> }</span><br><span class="line">]</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token keyword">const</span> members <span class="token operator">=</span> <span class="token punctuation">[</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2003</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'Jay'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2003</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'John'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2004</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'Jack'</span> <span class="token punctuation">}</span>
|
||||
<span class="token punctuation">]</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ members | group_by: "graduation_year" | json: 2 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> members <span class="token operator">|</span> <span class="token function filter">group_by</span><span class="token operator">:</span> <span class="token string">"graduation_year"</span> <span class="token operator">|</span> <span class="token function filter">json</span><span class="token operator">:</span> <span class="token number">2</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br></pre></td><td class="code"><pre><span class="line">[</span><br><span class="line"> {</span><br><span class="line"> "name": 2003,</span><br><span class="line"> "items": [</span><br><span class="line"> {</span><br><span class="line"> "graduation_year": 2003,</span><br><span class="line"> "name": "Jay"</span><br><span class="line"> },</span><br><span class="line"> {</span><br><span class="line"> "graduation_year": 2003,</span><br><span class="line"> "name": "John"</span><br><span class="line"> }</span><br><span class="line"> ]</span><br><span class="line"> },</span><br><span class="line"> {</span><br><span class="line"> "name": 2004,</span><br><span class="line"> "items": [</span><br><span class="line"> {</span><br><span class="line"> "graduation_year": 2004,</span><br><span class="line"> "name": "Jack"</span><br><span class="line"> }</span><br><span class="line"> ]</span><br><span class="line"> }</span><br><span class="line">]</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">[
|
||||
{
|
||||
"name": 2003,
|
||||
"items": [
|
||||
{
|
||||
"graduation_year": 2003,
|
||||
"name": "Jay"
|
||||
},
|
||||
{
|
||||
"graduation_year": 2003,
|
||||
"name": "John"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": 2004,
|
||||
"items": [
|
||||
{
|
||||
"graduation_year": 2004,
|
||||
"name": "Jack"
|
||||
}
|
||||
]
|
||||
}
|
||||
]<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.756Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="floor.html" class="article-footer-prev" title="sidebar.filters.floor"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="group_by_exp.html" class="article-footer-next" title="sidebar.filters.group_by_exp"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -95,17 +95,44 @@
|
||||
<p class="since">v10.11.0</p>
|
||||
|
||||
<p>Group an array’s items using a Liquid expression. For <code>members</code> array below:</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">const</span> members = [</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2013</span>, <span class="attr">name</span>: <span class="string">'Jay'</span> },</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2014</span>, <span class="attr">name</span>: <span class="string">'John'</span> },</span><br><span class="line"> { <span class="attr">graduation_year</span>: <span class="number">2009</span>, <span class="attr">name</span>: <span class="string">'Jack'</span> }</span><br><span class="line">]</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token keyword">const</span> members <span class="token operator">=</span> <span class="token punctuation">[</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2013</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'Jay'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2014</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'John'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">graduation_year</span><span class="token operator">:</span> <span class="token number">2009</span><span class="token punctuation">,</span> <span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'Jack'</span> <span class="token punctuation">}</span>
|
||||
<span class="token punctuation">]</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ members | group_by_exp: "item", "item.graduation_year | truncate: 3, ''" | json: 2 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> members <span class="token operator">|</span> <span class="token function filter">group_by_exp</span><span class="token operator">:</span> <span class="token string">"item"</span><span class="token punctuation">,</span> <span class="token string">"item.graduation_year | truncate: 3, ''"</span> <span class="token operator">|</span> <span class="token function filter">json</span><span class="token operator">:</span> <span class="token number">2</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br></pre></td><td class="code"><pre><span class="line">[</span><br><span class="line"> {</span><br><span class="line"> "name": "201",</span><br><span class="line"> "items": [</span><br><span class="line"> {</span><br><span class="line"> "graduation_year": 2013,</span><br><span class="line"> "name": "Jay"</span><br><span class="line"> },</span><br><span class="line"> {</span><br><span class="line"> "graduation_year": 2014,</span><br><span class="line"> "name": "John"</span><br><span class="line"> }</span><br><span class="line"> ]</span><br><span class="line"> },</span><br><span class="line"> {</span><br><span class="line"> "name": "200",</span><br><span class="line"> "items": [</span><br><span class="line"> {</span><br><span class="line"> "graduation_year": 2009,</span><br><span class="line"> "name": "Jack"</span><br><span class="line"> }</span><br><span class="line"> ]</span><br><span class="line"> }</span><br><span class="line">]</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">[
|
||||
{
|
||||
"name": "201",
|
||||
"items": [
|
||||
{
|
||||
"graduation_year": 2013,
|
||||
"name": "Jay"
|
||||
},
|
||||
{
|
||||
"graduation_year": 2014,
|
||||
"name": "John"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "200",
|
||||
"items": [
|
||||
{
|
||||
"graduation_year": 2009,
|
||||
"name": "Jack"
|
||||
}
|
||||
]
|
||||
}
|
||||
]<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="group_by.html" class="article-footer-prev" title="sidebar.filters.group_by"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="inspect.html" class="article-footer-next" title="sidebar.filters.inspect"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+13
-6
@@ -95,24 +95,31 @@
|
||||
<p class="since">v10.13.0</p>
|
||||
|
||||
<p>Similar with <code>json</code>, but <code>inspect</code> allows cyclic structure. For the scope below:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">const foo = {</span><br><span class="line"> bar: 'BAR'</span><br><span class="line">}</span><br><span class="line">foo.foo = foo</span><br><span class="line">const scope = { foo }</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-none"><code class="language-none">const foo = {
|
||||
bar: 'BAR'
|
||||
}
|
||||
foo.foo = foo
|
||||
const scope = { foo }<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% foo | inspect %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> foo <span class="token operator">|</span> <span class="token function filter">inspect</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{"bar":"BAR","foo":"[Circular]"}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">{"bar":"BAR","foo":"[Circular]"}<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Formatting" class="article-heading"><a href="#Formatting" class="headerlink" title="Formatting"></a>Formatting<a class="article-anchor" href="#Formatting" aria-hidden="true"></a></h2><p>An additional <code>space</code> argument can be specified for the indent width.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ foo | inspect: 4 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> foo <span class="token operator">|</span> <span class="token function filter">inspect</span><span class="token operator">:</span> <span class="token number">4</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{</span><br><span class="line"> "bar": "BAR",</span><br><span class="line"> "foo": "[Circular]"</span><br><span class="line">}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">{
|
||||
"bar": "BAR",
|
||||
"foo": "[Circular]"
|
||||
}<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="group_by_exp.html" class="article-footer-prev" title="sidebar.filters.group_by_exp"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="join.html" class="article-footer-next" title="sidebar.filters.join"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+5
-3
@@ -96,14 +96,16 @@
|
||||
|
||||
<p>Combines the items in an array into a single string using the argument as a separator.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign beatles = "John, Paul, George, Ringo" | split: ", " %}</span><br><span class="line">{{ beatles | join: " and " }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> beatles <span class="token operator">=</span> <span class="token string">"John, Paul, George, Ringo"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> beatles <span class="token operator">|</span> <span class="token function filter">join</span><span class="token operator">:</span> <span class="token string">" and "</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">John and Paul and George and Ringo</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">
|
||||
John and Paul and George and Ringo<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="inspect.html" class="article-footer-prev" title="sidebar.filters.inspect"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="json.html" class="article-footer-next" title="sidebar.filters.json"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+11
-5
@@ -96,23 +96,29 @@
|
||||
|
||||
<p>Convert values to string via <code>JSON.stringify()</code>, for debug purpose.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign arr = "foo bar coo" | split: " " %}</span><br><span class="line">{{ arr | json }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> arr <span class="token operator">=</span> <span class="token string">"foo bar coo"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">" "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> arr <span class="token operator">|</span> <span class="token function filter">json</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">["foo","bar","coo"]</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">["foo","bar","coo"]<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Space" class="article-heading"><a href="#Space" class="headerlink" title="Space"></a>Space<a class="article-anchor" href="#Space" aria-hidden="true"></a></h2><p class="since">v10.11.0</p>
|
||||
|
||||
<p>An additional <code>space</code> parameter can be specified to format the JSON.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign arr = "foo bar coo" | split: " " %}</span><br><span class="line">{{ arr | json: 4 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> arr <span class="token operator">=</span> <span class="token string">"foo bar coo"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">" "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> arr <span class="token operator">|</span> <span class="token function filter">json</span><span class="token operator">:</span> <span class="token number">4</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">[</span><br><span class="line"> "foo",</span><br><span class="line"> "bar",</span><br><span class="line"> "coo"</span><br><span class="line">]</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">[
|
||||
"foo",
|
||||
"bar",
|
||||
"coo"
|
||||
]<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="join.html" class="article-footer-prev" title="sidebar.filters.join"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="jsonify.html" class="article-footer-next" title="sidebar.filters.jsonify"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -98,7 +98,7 @@
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="json.html" class="article-footer-prev" title="sidebar.filters.json"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="last.html" class="article-footer-next" title="sidebar.filters.last"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+10
-6
@@ -96,23 +96,27 @@
|
||||
|
||||
<p>Returns the last item of an array.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Ground control to Major Tom." | split: " " | last }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Ground control to Major Tom."</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">" "</span> <span class="token operator">|</span> <span class="token function filter">last</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Tom.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Tom.<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_array = "zebra, octopus, giraffe, tiger" | split: ", " %}</span><br><span class="line">{{ my_array.last }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_array <span class="token operator">=</span> <span class="token string">"zebra, octopus, giraffe, tiger"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> my_array<span class="token punctuation">.</span><span class="token function">last</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">tiger</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">
|
||||
tiger<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>You can use <code>last</code> with dot notation when you need to use the filter inside a tag:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% if my_array.last == "tiger" %}</span><br><span class="line"> There goes a tiger!</span><br><span class="line">{% endif %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">if</span> my_array<span class="token punctuation">.</span><span class="token function">last</span> <span class="token operator">==</span> <span class="token string">"tiger"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
There goes a tiger!
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endif</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="jsonify.html" class="article-footer-prev" title="sidebar.filters.jsonify"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="lstrip.html" class="article-footer-next" title="sidebar.filters.lstrip"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+3
-3
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Removes all whitespace (tabs, spaces, and newlines) from the left side of a string. It does not affect spaces between words.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">BEGIN{{ " So much room for activities! " | lstrip }}END</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">BEGIN<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">" So much room for activities! "</span> <span class="token operator">|</span> <span class="token function filter">lstrip</span> <span class="token delimiter punctuation">}}</span></span>END<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">BEGINSo much room for activities! END</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">BEGINSo much room for activities! END<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="last.html" class="article-footer-prev" title="sidebar.filters.last"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="map.html" class="article-footer-next" title="sidebar.filters.map"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+11
-3
@@ -97,14 +97,22 @@
|
||||
<p>Creates an array of values by extracting the values of a named property from another object.</p>
|
||||
<p>In this example, assume the object <code>site.pages</code> contains all the metadata for a website. Using <code>assign</code> with the <code>map</code> filter creates a variable that contains only the values of the <code>category</code> properties of everything in the <code>site.pages</code> object.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% assign all_categories = site.pages | map: "category" %}</span><br><span class="line"></span><br><span class="line">{% for item in all_categories %}</span><br><span class="line">- {{ item }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> all_categories <span class="token operator">=</span> site<span class="token punctuation">.</span>pages <span class="token operator">|</span> <span class="token function filter">map</span><span class="token operator">:</span> <span class="token string">"category"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> all_categories <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">- business</span><br><span class="line">- celebrities</span><br><span class="line">- lifestyle</span><br><span class="line">- sports</span><br><span class="line">- technology</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">- business
|
||||
- celebrities
|
||||
- lifestyle
|
||||
- sports
|
||||
- technology<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="lstrip.html" class="article-footer-prev" title="sidebar.filters.lstrip"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="minus.html" class="article-footer-next" title="sidebar.filters.minus"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+7
-7
@@ -96,26 +96,26 @@
|
||||
|
||||
<p>Subtracts a number from another number.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 4 | minus: 2 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">4</span> <span class="token operator">|</span> <span class="token function filter">minus</span><span class="token operator">:</span> <span class="token number">2</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">2</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">2<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 16 | minus: 4 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">16</span> <span class="token operator">|</span> <span class="token function filter">minus</span><span class="token operator">:</span> <span class="token number">4</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">12</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">12<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 183.357 | minus: 12 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">183.357</span> <span class="token operator">|</span> <span class="token function filter">minus</span><span class="token operator">:</span> <span class="token number">12</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">171.357</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">171.357<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="map.html" class="article-footer-prev" title="sidebar.filters.map"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="modulo.html" class="article-footer-next" title="sidebar.filters.modulo"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+7
-7
@@ -96,26 +96,26 @@
|
||||
|
||||
<p>Returns the remainder of a division operation.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 3 | modulo: 2 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">3</span> <span class="token operator">|</span> <span class="token function filter">modulo</span><span class="token operator">:</span> <span class="token number">2</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">1</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">1<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 24 | modulo: 7 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">24</span> <span class="token operator">|</span> <span class="token function filter">modulo</span><span class="token operator">:</span> <span class="token number">7</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">3</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">3<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 183.357 | modulo: 12 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">183.357</span> <span class="token operator">|</span> <span class="token function filter">modulo</span><span class="token operator">:</span> <span class="token number">12</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">3.3569999999999993</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">3.3569999999999993<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="minus.html" class="article-footer-prev" title="sidebar.filters.minus"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="newline_to_br.html" class="article-footer-next" title="sidebar.filters.newline_to_br"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,20 @@
|
||||
|
||||
<p>Replaces every newline (<code>\n</code>) in a string with an HTML line break (<code><br /></code>).</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">{% capture string_with_newlines %}</span><br><span class="line">Hello</span><br><span class="line">there</span><br><span class="line">{% endcapture %}</span><br><span class="line"></span><br><span class="line">{{ string_with_newlines | newline_to_br }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">capture</span> string_with_newlines <span class="token delimiter punctuation">%}</span></span>
|
||||
Hello
|
||||
there
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endcapture</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> string_with_newlines <span class="token operator">|</span> <span class="token function filter">newline_to_br</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line"><span class="tag"><<span class="name">br</span>/></span>Hello<span class="tag"><<span class="name">br</span>/></span>there<span class="tag"><<span class="name">br</span>/></span></span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-markup" data-language="markup"><code class="language-markup">
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>br</span><span class="token punctuation">/></span></span>Hello<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>br</span><span class="token punctuation">/></span></span>there<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>br</span><span class="token punctuation">/></span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="modulo.html" class="article-footer-prev" title="sidebar.filters.modulo"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="normalize_whitespace.html" class="article-footer-next" title="sidebar.filters.normalize_whitespace"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Replace any occurrence of whitespace with a single space.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "a \n b" | normalize_whitespace }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"a \n b"</span> <span class="token operator">|</span> <span class="token function filter">normalize_whitespace</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">a b</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-markup" data-language="markup"><code class="language-markup">a b<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="newline_to_br.html" class="article-footer-prev" title="sidebar.filters.newline_to_br"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="number_of_words.html" class="article-footer-next" title="sidebar.filters.number_of_words"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -100,32 +100,32 @@
|
||||
<li>Passing <code>'auto'</code> (auto-detect) works similar to <code>'cjk'</code> but is more performant if the filter is used on a variable string that may or may not contain CJK chars.</li>
|
||||
</ul>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Hello world!" | number_of_words }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Hello world!"</span> <span class="token operator">|</span> <span class="token function filter">number_of_words</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">2</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">2<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "你好hello世界world" | number_of_words }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"你好hello世界world"</span> <span class="token operator">|</span> <span class="token function filter">number_of_words</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">1</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">1<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "你好hello世界world" | number_of_words: "cjk" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"你好hello世界world"</span> <span class="token operator">|</span> <span class="token function filter">number_of_words</span><span class="token operator">:</span> <span class="token string">"cjk"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">6</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">6<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "你好hello世界world" | number_of_words: "auto" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"你好hello世界world"</span> <span class="token operator">|</span> <span class="token function filter">number_of_words</span><span class="token operator">:</span> <span class="token string">"auto"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">6</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">6<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="normalize_whitespace.html" class="article-footer-prev" title="sidebar.filters.normalize_whitespace"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="plus.html" class="article-footer-next" title="sidebar.filters.plus"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -129,7 +129,7 @@
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="abs.html" class="article-footer-next" title="sidebar.filters.abs"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+7
-7
@@ -96,26 +96,26 @@
|
||||
|
||||
<p>Adds a number to another number.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 4 | plus: 2 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">4</span> <span class="token operator">|</span> <span class="token function filter">plus</span><span class="token operator">:</span> <span class="token number">2</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">6</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">6<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 16 | plus: 4 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">16</span> <span class="token operator">|</span> <span class="token function filter">plus</span><span class="token operator">:</span> <span class="token number">4</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">20</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">20<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 183.357 | plus: 12 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">183.357</span> <span class="token operator">|</span> <span class="token function filter">plus</span><span class="token operator">:</span> <span class="token number">12</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">195.357</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">195.357<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="number_of_words.html" class="article-footer-prev" title="sidebar.filters.number_of_words"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="pop.html" class="article-footer-next" title="sidebar.filters.pop"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+10
-3
@@ -96,14 +96,21 @@
|
||||
|
||||
<p>Pop an element from the array. It’s NON-DESTRUCTIVE, i.e. it does not mutate the array, but rather make a copy and mutate that.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% assign fruits = "apples, oranges, peaches" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{% assign everything = fruits | pop %}</span><br><span class="line"></span><br><span class="line">{% for item in everything %}</span><br><span class="line">- {{ item }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> fruits <span class="token operator">=</span> <span class="token string">"apples, oranges, peaches"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> everything <span class="token operator">=</span> fruits <span class="token operator">|</span> <span class="token function filter">pop</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> everything <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">- apples</span><br><span class="line">- oranges</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">- apples
|
||||
- oranges<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="plus.html" class="article-footer-prev" title="sidebar.filters.plus"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="push.html" class="article-footer-next" title="sidebar.filters.push"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,21 +96,23 @@
|
||||
|
||||
<p>Adds the specified string to the beginning of another string.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "apples, oranges, and bananas" | prepend: "Some fruit: " }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"apples, oranges, and bananas"</span> <span class="token operator">|</span> <span class="token function filter">prepend</span><span class="token operator">:</span> <span class="token string">"Some fruit: "</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Some fruit: apples, oranges, and bananas</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Some fruit: apples, oranges, and bananas<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p><code>prepend</code> can also be used with variables:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign url = "example.com" %}</span><br><span class="line">{{ "/index.html" | prepend: url }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> url <span class="token operator">=</span> <span class="token string">"example.com"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"/index.html"</span> <span class="token operator">|</span> <span class="token function filter">prepend</span><span class="token operator">:</span> url <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">example.com/index.html</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">
|
||||
example.com/index.html<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="push.html" class="article-footer-prev" title="sidebar.filters.push"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="raw.html" class="article-footer-next" title="sidebar.filters.raw"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+11
-3
@@ -96,14 +96,22 @@
|
||||
|
||||
<p>Push an element into array. It’s NON-DESTRUCTIVE, i.e. it does not mutate the array, but rather make a copy and mutate that.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% assign fruits = "apples, oranges" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{% assign everything = fruits | push: "peaches" %}</span><br><span class="line"></span><br><span class="line">{% for item in everything %}</span><br><span class="line">- {{ item }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> fruits <span class="token operator">=</span> <span class="token string">"apples, oranges"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> everything <span class="token operator">=</span> fruits <span class="token operator">|</span> <span class="token function filter">push</span><span class="token operator">:</span> <span class="token string">"peaches"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> everything <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">- apples</span><br><span class="line">- oranges</span><br><span class="line">- peaches</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">- apples
|
||||
- oranges
|
||||
- peaches<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="pop.html" class="article-footer-prev" title="sidebar.filters.pop"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="prepend.html" class="article-footer-next" title="sidebar.filters.prepend"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+9
-9
@@ -99,32 +99,32 @@
|
||||
</blockquote>
|
||||
|
||||
<p>Input (<code>outputEscape</code> not set)</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "<" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"<"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text"><<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input (<code>outputEscape="escape"</code>)</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "<" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"<"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">&lt;</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">&lt;<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input (<code>outputEscape="json"</code>)</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "<" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"<"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">"<"</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">"<"<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input (<code>outputEscape="escape"</code>)</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "<" | raw }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"<"</span> <span class="token operator">|</span> <span class="token keyword">raw</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text"><<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="prepend.html" class="article-footer-prev" title="sidebar.filters.prepend"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="remove.html" class="article-footer-next" title="sidebar.filters.remove"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+3
-3
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Removes every occurrence of the specified substring from a string.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "I strained to see the train through the rain" | remove: "rain" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"I strained to see the train through the rain"</span> <span class="token operator">|</span> <span class="token function filter">remove</span><span class="token operator">:</span> <span class="token string">"rain"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">I sted to see the t through the </span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">I sted to see the t through the <span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="raw.html" class="article-footer-prev" title="sidebar.filters.raw"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="remove_first.html" class="article-footer-next" title="sidebar.filters.remove_first"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Removes only the first occurrence of the specified substring from a string.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "I strained to see the train through the rain" | remove_first: "rain" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"I strained to see the train through the rain"</span> <span class="token operator">|</span> <span class="token function filter">remove_first</span><span class="token operator">:</span> <span class="token string">"rain"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">I sted to see the train through the rain</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">I sted to see the train through the rain<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="remove.html" class="article-footer-prev" title="sidebar.filters.remove"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="remove_last.html" class="article-footer-next" title="sidebar.filters.remove_last"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Removes only the last occurrence of the specified substring from a string.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "I strained to see the train through the rain" | remove_last: "rain" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"I strained to see the train through the rain"</span> <span class="token operator">|</span> <span class="token function filter">remove_last</span><span class="token operator">:</span> <span class="token string">"rain"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">I strained to see the train through the</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">I strained to see the train through the<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="remove_first.html" class="article-footer-prev" title="sidebar.filters.remove_first"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="replace.html" class="article-footer-next" title="sidebar.filters.replace"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Replaces every occurrence of the first argument in a string with the second argument.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Take my protein pills and put my helmet on" | replace: "my", "your" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Take my protein pills and put my helmet on"</span> <span class="token operator">|</span> <span class="token function filter">replace</span><span class="token operator">:</span> <span class="token string">"my"</span><span class="token punctuation">,</span> <span class="token string">"your"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Take your protein pills and put your helmet on</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Take your protein pills and put your helmet on<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="remove_last.html" class="article-footer-prev" title="sidebar.filters.remove_last"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="replace_first.html" class="article-footer-next" title="sidebar.filters.replace_first"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Replaces only the first occurrence of the first argument in a string with the second argument.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Take my protein pills and put my helmet on" | replace_first: "my", "your" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Take my protein pills and put my helmet on"</span> <span class="token operator">|</span> <span class="token function filter">replace_first</span><span class="token operator">:</span> <span class="token string">"my"</span><span class="token punctuation">,</span> <span class="token string">"your"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Take your protein pills and put my helmet on</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Take your protein pills and put my helmet on<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="replace.html" class="article-footer-prev" title="sidebar.filters.replace"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="replace_last.html" class="article-footer-next" title="sidebar.filters.replace_last"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Replaces only the last occurrence of the first argument in a string with the second argument.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Take my protein pills and put my helmet on" | replace_last: "my", "your" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Take my protein pills and put my helmet on"</span> <span class="token operator">|</span> <span class="token function filter">replace_last</span><span class="token operator">:</span> <span class="token string">"my"</span><span class="token punctuation">,</span> <span class="token string">"your"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Take my protein pills and put your helmet on</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Take my protein pills and put your helmet on<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="replace_first.html" class="article-footer-prev" title="sidebar.filters.replace_first"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="reverse.html" class="article-footer-next" title="sidebar.filters.reverse"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,21 +96,25 @@
|
||||
|
||||
<p>Reverses the order of the items in an array. <code>reverse</code> cannot reverse a string.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{{ my_array | reverse | join: ", " }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_array <span class="token operator">=</span> <span class="token string">"apples, oranges, peaches, plums"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> my_array <span class="token operator">|</span> <span class="token function filter">reverse</span> <span class="token operator">|</span> <span class="token function filter">join</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line"></span><br><span class="line">plums, peaches, oranges, apples</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">
|
||||
|
||||
plums, peaches, oranges, apples<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Although <code>reverse</code> cannot be used directly on a string, you can split a string into an array, reverse the array, and rejoin it by chaining together filters:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Ground control to Major Tom." | split: "" | reverse | join: "" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Ground control to Major Tom."</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">""</span> <span class="token operator">|</span> <span class="token function filter">reverse</span> <span class="token operator">|</span> <span class="token function filter">join</span><span class="token operator">:</span> <span class="token string">""</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">.moT rojaM ot lortnoc dnuorG</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">.moT rojaM ot lortnoc dnuorG<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="replace_last.html" class="article-footer-prev" title="sidebar.filters.replace_last"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="round.html" class="article-footer-next" title="sidebar.filters.round"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+7
-7
@@ -96,26 +96,26 @@
|
||||
|
||||
<p>Rounds a number to the nearest integer or, if a number is passed as an argument, to that number of decimal places.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 1.2 | round }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">1.2</span> <span class="token operator">|</span> <span class="token function filter">round</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">1</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">1<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 2.7 | round }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">2.7</span> <span class="token operator">|</span> <span class="token function filter">round</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">3</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">3<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 183.357 | round: 2 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">183.357</span> <span class="token operator">|</span> <span class="token function filter">round</span><span class="token operator">:</span> <span class="token number">2</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">183.36</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">183.36<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="reverse.html" class="article-footer-prev" title="sidebar.filters.reverse"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="rstrip.html" class="article-footer-next" title="sidebar.filters.rstrip"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+3
-3
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Removes all whitespace (tabs, spaces, and newlines) from the right side of a string. It does not affect spaces between words.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">BEGIN{{ " So much room for activities! " | rstrip }}END</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">BEGIN<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">" So much room for activities! "</span> <span class="token operator">|</span> <span class="token function filter">rstrip</span> <span class="token delimiter punctuation">}}</span></span>END<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">BEGIN So much room for activities!END</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">BEGIN So much room for activities!END<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="round.html" class="article-footer-prev" title="sidebar.filters.round"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="shift.html" class="article-footer-next" title="sidebar.filters.shift"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+10
-3
@@ -96,14 +96,21 @@
|
||||
|
||||
<p>Shift an element from the array. It’s NON-DESTRUCTIVE, i.e. it does not mutate the array, but rather make a copy and mutate that.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% assign fruits = "apples, oranges, peaches" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{% assign everything = fruits | shift %}</span><br><span class="line"></span><br><span class="line">{% for item in everything %}</span><br><span class="line">- {{ item }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> fruits <span class="token operator">=</span> <span class="token string">"apples, oranges, peaches"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> everything <span class="token operator">=</span> fruits <span class="token operator">|</span> <span class="token function filter">shift</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> everything <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">- oranges</span><br><span class="line">- peaches</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">- oranges
|
||||
- peaches<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="rstrip.html" class="article-footer-prev" title="sidebar.filters.rstrip"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="size.html" class="article-footer-next" title="sidebar.filters.size"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+12
-6
@@ -96,23 +96,29 @@
|
||||
|
||||
<p>Returns the number of characters in a string or the number of items in an array.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Ground control to Major Tom." | size }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Ground control to Major Tom."</span> <span class="token operator">|</span> <span class="token function filter">size</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">28</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">28<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{{ my_array.size }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_array <span class="token operator">=</span> <span class="token string">"apples, oranges, peaches, plums"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> my_array<span class="token punctuation">.</span><span class="token function">size</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line"></span><br><span class="line">4</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">
|
||||
|
||||
4<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>You can use <code>size</code> with dot notation when you need to use the filter inside a tag:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% if site.pages.size > 10 %}</span><br><span class="line"> This is a big website!</span><br><span class="line">{% endif %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">if</span> site<span class="token punctuation">.</span>pages<span class="token punctuation">.</span><span class="token function">size</span> <span class="token operator">></span> <span class="token number">10</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
This is a big website!
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endif</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="shift.html" class="article-footer-prev" title="sidebar.filters.shift"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="slice.html" class="article-footer-next" title="sidebar.filters.slice"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+9
-9
@@ -97,33 +97,33 @@
|
||||
<p>Returns a substring of 1 character beginning at the index specified by the first argument. An optional second argument specifies the length of the substring to be returned.</p>
|
||||
<p>String indices are numbered starting from 0.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Liquid" | slice: 0 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Liquid"</span> <span class="token operator">|</span> <span class="token function filter">slice</span><span class="token operator">:</span> <span class="token number">0</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">L</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">L<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Liquid" | slice: 2 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Liquid"</span> <span class="token operator">|</span> <span class="token function filter">slice</span><span class="token operator">:</span> <span class="token number">2</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">q</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">q<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Liquid" | slice: 2, 5 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Liquid"</span> <span class="token operator">|</span> <span class="token function filter">slice</span><span class="token operator">:</span> <span class="token number">2</span><span class="token punctuation">,</span> <span class="token number">5</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">quid</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">quid<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>If the first argument is a negative number, the indices are counted from the end of the string:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Liquid" | slice: -3, 2 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Liquid"</span> <span class="token operator">|</span> <span class="token function filter">slice</span><span class="token operator">:</span> <span class="token operator">-</span><span class="token number">3</span><span class="token punctuation">,</span> <span class="token number">2</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">ui</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">ui<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="size.html" class="article-footer-prev" title="sidebar.filters.size"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="slugify.html" class="article-footer-next" title="sidebar.filters.slugify"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+11
-11
@@ -108,33 +108,33 @@
|
||||
<li><code>case: boolean</code>. The default is <code>false</code>. The original case of slug will be retained if set to <code>true</code>.</li>
|
||||
</ol>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "The _config.yml file" | slugify }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"The _config.yml file"</span> <span class="token operator">|</span> <span class="token function filter">slugify</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
<p>Output</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">the-config-yml-file</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-none"><code class="language-none">the-config-yml-file<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "The _config.yml file" | slugify: "pretty" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"The _config.yml file"</span> <span class="token operator">|</span> <span class="token function filter">slugify</span><span class="token operator">:</span> <span class="token string">"pretty"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
<p>Output</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">the-_config.yml-file</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-none"><code class="language-none">the-_config.yml-file<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "The _cönfig.yml file" | slugify: "ascii" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"The _cönfig.yml file"</span> <span class="token operator">|</span> <span class="token function filter">slugify</span><span class="token operator">:</span> <span class="token string">"ascii"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
<p>Output</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">the-c-nfig-yml-file</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-none"><code class="language-none">the-c-nfig-yml-file<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "The cönfig.yml file" | slugify: "latin" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"The cönfig.yml file"</span> <span class="token operator">|</span> <span class="token function filter">slugify</span><span class="token operator">:</span> <span class="token string">"latin"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
<p>Output</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">the-config-yml-file</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-none"><code class="language-none">the-config-yml-file<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "The cönfig.yml file" | slugify: "latin", true }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"The cönfig.yml file"</span> <span class="token operator">|</span> <span class="token function filter">slugify</span><span class="token operator">:</span> <span class="token string">"latin"</span><span class="token punctuation">,</span> <span class="token boolean">true</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
<p>Output</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">The-config-yml-file</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-none"><code class="language-none">The-config-yml-file<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="slice.html" class="article-footer-prev" title="sidebar.filters.slice"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="sort.html" class="article-footer-next" title="sidebar.filters.sort"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+11
-4
@@ -96,17 +96,24 @@
|
||||
|
||||
<p>Sorts items in an array in case-sensitive order.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_array = "zebra, octopus, giraffe, Sally Snake" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{{ my_array | sort | join: ", " }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_array <span class="token operator">=</span> <span class="token string">"zebra, octopus, giraffe, Sally Snake"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> my_array <span class="token operator">|</span> <span class="token function filter">sort</span> <span class="token operator">|</span> <span class="token function filter">join</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line"></span><br><span class="line">Sally Snake, giraffe, octopus, zebra</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">
|
||||
|
||||
Sally Snake, giraffe, octopus, zebra<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>An optional argument specifies which property of the array’s items to use for sorting.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{% assign products_by_price = collection.products | sort: "price" %}</span><br><span class="line">{% for product in products_by_price %}</span><br><span class="line"> <h4>{{ product.title }}</h4></span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> products_by_price <span class="token operator">=</span> <span class="token object">collection</span><span class="token punctuation">.</span>products <span class="token operator">|</span> <span class="token function filter">sort</span><span class="token operator">:</span> <span class="token string">"price"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> <span class="token object">product</span> <span class="token keyword">in</span> products_by_price <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h4</span><span class="token punctuation">></span></span><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h4</span><span class="token punctuation">></span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="slugify.html" class="article-footer-prev" title="sidebar.filters.slugify"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="sort_natural.html" class="article-footer-next" title="sidebar.filters.sort_natural"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,17 +96,24 @@
|
||||
|
||||
<p>Sorts items in an array in case-insensitive order.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_array = "zebra, octopus, giraffe, Sally Snake" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{{ my_array | sort_natural | join: ", " }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_array <span class="token operator">=</span> <span class="token string">"zebra, octopus, giraffe, Sally Snake"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> my_array <span class="token operator">|</span> <span class="token function filter">sort_natural</span> <span class="token operator">|</span> <span class="token function filter">join</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line"></span><br><span class="line">giraffe, octopus, Sally Snake, zebra</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">
|
||||
|
||||
giraffe, octopus, Sally Snake, zebra<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>An optional argument specifies which property of the array’s items to use for sorting.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{% assign products_by_company = collection.products | sort_natural: "company" %}</span><br><span class="line">{% for product in products_by_company %}</span><br><span class="line"> <h4>{{ product.title }}</h4></span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> products_by_company <span class="token operator">=</span> <span class="token object">collection</span><span class="token punctuation">.</span>products <span class="token operator">|</span> <span class="token function filter">sort_natural</span><span class="token operator">:</span> <span class="token string">"company"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> <span class="token object">product</span> <span class="token keyword">in</span> products_by_company <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h4</span><span class="token punctuation">></span></span><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h4</span><span class="token punctuation">></span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="sort.html" class="article-footer-prev" title="sidebar.filters.sort"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="split.html" class="article-footer-next" title="sidebar.filters.split"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+17
-3
@@ -96,14 +96,28 @@
|
||||
|
||||
<p>Divides a string into an array using the argument as a separator. <code>split</code> is commonly used to convert comma-separated items from a string to an array.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% assign beatles = "John, Paul, George, Ringo" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{% for member in beatles %}</span><br><span class="line"> {{ member }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> beatles <span class="token operator">=</span> <span class="token string">"John, Paul, George, Ringo"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> member <span class="token keyword">in</span> beatles <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> member <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line"></span><br><span class="line">John</span><br><span class="line"></span><br><span class="line">Paul</span><br><span class="line"></span><br><span class="line">George</span><br><span class="line"></span><br><span class="line">Ringo</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">
|
||||
|
||||
|
||||
|
||||
John
|
||||
|
||||
Paul
|
||||
|
||||
George
|
||||
|
||||
Ringo<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="sort_natural.html" class="article-footer-prev" title="sidebar.filters.sort_natural"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="strip.html" class="article-footer-next" title="sidebar.filters.strip"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+3
-3
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Removes all whitespace (tabs, spaces, and newlines) from both the left and right sides of a string. It does not affect spaces between words.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">BEGIN{{ " So much room for activities! " | strip }}END</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">BEGIN<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">" So much room for activities! "</span> <span class="token operator">|</span> <span class="token function filter">strip</span> <span class="token delimiter punctuation">}}</span></span>END<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">BEGINSo much room for activities!END</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">BEGINSo much room for activities!END<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="split.html" class="article-footer-prev" title="sidebar.filters.split"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="strip_html.html" class="article-footer-next" title="sidebar.filters.strip_html"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Removes any HTML tags from a string.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Have <em>you</em> read <strong>Ulysses</strong>?" | strip_html }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Have <em>you</em> read <strong>Ulysses</strong>?"</span> <span class="token operator">|</span> <span class="token function filter">strip_html</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Have you read Ulysses?</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Have you read Ulysses?<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="strip.html" class="article-footer-prev" title="sidebar.filters.strip"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="strip_newlines.html" class="article-footer-next" title="sidebar.filters.strip_newlines"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,20 @@
|
||||
|
||||
<p>Removes any newline characters (line breaks) from a string.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">{% capture string_with_newlines %}</span><br><span class="line">Hello</span><br><span class="line">there</span><br><span class="line">{% endcapture %}</span><br><span class="line"></span><br><span class="line">{{ string_with_newlines | strip_newlines }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">capture</span> string_with_newlines <span class="token delimiter punctuation">%}</span></span>
|
||||
Hello
|
||||
there
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endcapture</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> string_with_newlines <span class="token operator">|</span> <span class="token function filter">strip_newlines</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"></span><br><span class="line">Hellothere</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-markup" data-language="markup"><code class="language-markup">
|
||||
Hellothere<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="strip_html.html" class="article-footer-prev" title="sidebar.filters.strip_html"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="sum.html" class="article-footer-next" title="sidebar.filters.sum"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+3
-3
@@ -97,14 +97,14 @@
|
||||
<p>Computes the sum of all the numbers in an array.<br>An optional argument specifies which property of the array’s items to sum up.</p>
|
||||
<p>In this example, assume the object <code>cart.products</code> contains an array of all products in the cart of a website.<br>Assume each cart product has a <code>qty</code> property that gives the count of that product instance in the cart.<br>Using the <code>sum</code> filter we can calculate the total number of products in the cart.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">The cart has {{ order.products | sum: "qty" }} products.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">The cart has <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">order</span><span class="token punctuation">.</span>products <span class="token operator">|</span> <span class="token function filter">sum</span><span class="token operator">:</span> <span class="token string">"qty"</span> <span class="token delimiter punctuation">}}</span></span> products.<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">The cart has 7 products.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">The cart has 7 products.<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="strip_newlines.html" class="article-footer-prev" title="sidebar.filters.strip_newlines"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="times.html" class="article-footer-next" title="sidebar.filters.times"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+7
-7
@@ -96,26 +96,26 @@
|
||||
|
||||
<p>Multiplies a number by another number.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 3 | times: 2 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">3</span> <span class="token operator">|</span> <span class="token function filter">times</span><span class="token operator">:</span> <span class="token number">2</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">6</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">6<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 24 | times: 7 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">24</span> <span class="token operator">|</span> <span class="token function filter">times</span><span class="token operator">:</span> <span class="token number">7</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">168</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">168<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ 183.357 | times: 12 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token number">183.357</span> <span class="token operator">|</span> <span class="token function filter">times</span><span class="token operator">:</span> <span class="token number">12</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">2200.284</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">2200.284<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="sum.html" class="article-footer-prev" title="sidebar.filters.sum"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="to_integer.html" class="article-footer-next" title="sidebar.filters.to_integer"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Convert values to number.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "123" | to_integer | json }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"123"</span> <span class="token operator">|</span> <span class="token function filter">to_integer</span> <span class="token operator">|</span> <span class="token function filter">json</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">123</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">123<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="times.html" class="article-footer-prev" title="sidebar.filters.times"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="truncate.html" class="article-footer-next" title="sidebar.filters.truncate"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,29 +96,29 @@
|
||||
|
||||
<p>Shortens a string down to the number of characters passed as an argument. If the specified number of characters is less than the length of the string, an ellipsis (…) is appended to the string and is included in the character count.</p>
|
||||
<h2 id="Basic-Usage" class="article-heading"><a href="#Basic-Usage" class="headerlink" title="Basic Usage"></a>Basic Usage<a class="article-anchor" href="#Basic-Usage" aria-hidden="true"></a></h2><p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Ground control to Major Tom." | truncate: 20 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Ground control to Major Tom."</span> <span class="token operator">|</span> <span class="token function filter">truncate</span><span class="token operator">:</span> <span class="token number">20</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Ground control to...</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Ground control to...<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Custom-ellipsis" class="article-heading"><a href="#Custom-ellipsis" class="headerlink" title="Custom ellipsis"></a>Custom ellipsis<a class="article-anchor" href="#Custom-ellipsis" aria-hidden="true"></a></h2><p><code>truncate</code> takes an optional second argument that specifies the sequence of characters to be appended to the truncated string. By default this is an ellipsis (…), but you can specify a different sequence.</p>
|
||||
<p>The length of the second argument counts against the number of characters specified by the first argument. For example, if you want to truncate a string to exactly 10 characters, and use a 3-character ellipsis, use <strong>13</strong> for the first argument of <code>truncate</code>, since the ellipsis counts as 3 characters.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Ground control to Major Tom." | truncate: 25, ", and so on" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Ground control to Major Tom."</span> <span class="token operator">|</span> <span class="token function filter">truncate</span><span class="token operator">:</span> <span class="token number">25</span><span class="token punctuation">,</span> <span class="token string">", and so on"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Ground control, and so on</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Ground control, and so on<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h2 id="No-ellipsis" class="article-heading"><a href="#No-ellipsis" class="headerlink" title="No ellipsis"></a>No ellipsis<a class="article-anchor" href="#No-ellipsis" aria-hidden="true"></a></h2><p>You can truncate to the exact number of characters specified by the first argument and avoid showing trailing characters by passing a blank string as the second argument:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Ground control to Major Tom." | truncate: 20, "" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Ground control to Major Tom."</span> <span class="token operator">|</span> <span class="token function filter">truncate</span><span class="token operator">:</span> <span class="token number">20</span><span class="token punctuation">,</span> <span class="token string">""</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Ground control to Ma</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Ground control to Ma<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="to_integer.html" class="article-footer-prev" title="sidebar.filters.to_integer"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="truncatewords.html" class="article-footer-next" title="sidebar.filters.truncatewords"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,28 +96,28 @@
|
||||
|
||||
<p>Shortens a string down to the number of words passed as an argument. If the specified number of words is less than the number of words in the string, an ellipsis (…) is appended to the string.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Ground control to Major Tom." | truncatewords: 3 }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Ground control to Major Tom."</span> <span class="token operator">|</span> <span class="token function filter">truncatewords</span><span class="token operator">:</span> <span class="token number">3</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Ground control to...</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Ground control to...<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h3 id="Custom-ellipsis" class="article-heading"><a href="#Custom-ellipsis" class="headerlink" title="Custom ellipsis"></a>Custom ellipsis<a class="article-anchor" href="#Custom-ellipsis" aria-hidden="true"></a></h3><p><code>truncatewords</code> takes an optional second argument that specifies the sequence of characters to be appended to the truncated string. By default this is an ellipsis (…), but you can specify a different sequence.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Ground control to Major Tom." | truncatewords: 3, "--" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Ground control to Major Tom."</span> <span class="token operator">|</span> <span class="token function filter">truncatewords</span><span class="token operator">:</span> <span class="token number">3</span><span class="token punctuation">,</span> <span class="token string">"--"</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Ground control to--</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Ground control to--<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h3 id="No-ellipsis" class="article-heading"><a href="#No-ellipsis" class="headerlink" title="No ellipsis"></a>No ellipsis<a class="article-anchor" href="#No-ellipsis" aria-hidden="true"></a></h3><p>You can avoid showing trailing characters by passing a blank string as the second argument:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Ground control to Major Tom." | truncatewords: 3, "" }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Ground control to Major Tom."</span> <span class="token operator">|</span> <span class="token function filter">truncatewords</span><span class="token operator">:</span> <span class="token number">3</span><span class="token punctuation">,</span> <span class="token string">""</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Ground control to</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Ground control to<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="truncate.html" class="article-footer-prev" title="sidebar.filters.truncate"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="uniq.html" class="article-footer-next" title="sidebar.filters.uniq"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+4
-3
@@ -96,14 +96,15 @@
|
||||
|
||||
<p>Removes any duplicate elements in an array.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_array = "ants, bugs, bees, bugs, ants" | split: ", " %}</span><br><span class="line">{{ my_array | uniq | join: ", " }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_array <span class="token operator">=</span> <span class="token string">"ants, bugs, bees, bugs, ants"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> my_array <span class="token operator">|</span> <span class="token function filter">uniq</span> <span class="token operator">|</span> <span class="token function filter">join</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">ants, bugs, bees</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">ants, bugs, bees<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="truncatewords.html" class="article-footer-prev" title="sidebar.filters.truncatewords"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="unshift.html" class="article-footer-next" title="sidebar.filters.unshift"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+11
-3
@@ -96,14 +96,22 @@
|
||||
|
||||
<p>Unshift an element to the front of the array. It’s NON-DESTRUCTIVE, i.e. it does not mutate the array, but rather make a copy and mutate that.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% assign fruits = "oranges, peaches" | split: ", " %}</span><br><span class="line"></span><br><span class="line">{% assign everything = fruits | unshift: "apples" %}</span><br><span class="line"></span><br><span class="line">{% for item in everything %}</span><br><span class="line">- {{ item }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> fruits <span class="token operator">=</span> <span class="token string">"oranges, peaches"</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">", "</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> everything <span class="token operator">=</span> fruits <span class="token operator">|</span> <span class="token function filter">unshift</span><span class="token operator">:</span> <span class="token string">"apples"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> everything <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">- apples</span><br><span class="line">- oranges</span><br><span class="line">- peaches</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">- apples
|
||||
- oranges
|
||||
- peaches<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="uniq.html" class="article-footer-prev" title="sidebar.filters.uniq"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="upcase.html" class="article-footer-next" title="sidebar.filters.upcase"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+5
-5
@@ -96,20 +96,20 @@
|
||||
|
||||
<p>Makes each character in a string uppercase. It has no effect on strings which are already all uppercase.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Parker Moore" | upcase }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Parker Moore"</span> <span class="token operator">|</span> <span class="token function filter">upcase</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">PARKER MOORE</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">PARKER MOORE<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "APPLE" | upcase }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"APPLE"</span> <span class="token operator">|</span> <span class="token function filter">upcase</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">APPLE</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">APPLE<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="unshift.html" class="article-footer-prev" title="sidebar.filters.unshift"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="uri_escape.html" class="article-footer-next" title="sidebar.filters.uri_escape"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,15 +96,15 @@
|
||||
|
||||
<p>Percent encodes any special characters in a URI. URI escape normally replaces a space with <code>%20</code>. <a target="_blank" rel="noopener external nofollow noreferrer" href="https://en.wikipedia.org/wiki/Percent-encoding#Types_of_URI_characters">Reserved characters</a> will not be escaped.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "https://example.com/?q=foo, \bar?" | uri_escape }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"https://example.com/?q=foo, \bar?"</span> <span class="token operator">|</span> <span class="token function filter">uri_escape</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">https://example.com/?q=foo,%20%5Cbar?</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">https://example.com/?q=foo,%20%5Cbar?<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="upcase.html" class="article-footer-prev" title="sidebar.filters.upcase"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="url_decode.html" class="article-footer-next" title="sidebar.filters.url_decode"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Decodes a string that has been encoded as a URL.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "%27Stop%21%27+said+Fred" | url_decode }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"%27Stop%21%27+said+Fred"</span> <span class="token operator">|</span> <span class="token function filter">url_decode</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">'Stop!' said Fred</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">'Stop!' said Fred<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="uri_escape.html" class="article-footer-prev" title="sidebar.filters.uri_escape"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="url_encode.html" class="article-footer-next" title="sidebar.filters.url_encode"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,20 +96,20 @@
|
||||
|
||||
<p>Converts any URL-unsafe characters in a string into percent-encoded characters.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "[email protected]" | url_encode }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"[email protected]"</span> <span class="token operator">|</span> <span class="token function filter">url_encode</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">john%40liquid.com</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">john%40liquid.com<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Tetsuro Takara" | url_encode }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Tetsuro Takara"</span> <span class="token operator">|</span> <span class="token function filter">url_encode</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Tetsuro+Takara</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Tetsuro+Takara<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="url_decode.html" class="article-footer-prev" title="sidebar.filters.url_decode"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="where.html" class="article-footer-next" title="sidebar.filters.where"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+55
-10
@@ -97,38 +97,83 @@
|
||||
<p>Creates an array including only the objects with a given property value, or any <a href="../tutorials/truthy-and-falsy.html">truthy</a> value by default.</p>
|
||||
<p>In this example, assume you have a list of products and you want to show your kitchen products separately. Using <code>where</code>, you can create an array containing only the products that have a <code>"type"</code> of <code>"kitchen"</code>.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line">All products:</span><br><span class="line">{% for product in products %}</span><br><span class="line">- {{ product.title }}</span><br><span class="line">{% endfor %}</span><br><span class="line"></span><br><span class="line">{% assign kitchen_products = products | where: "type", "kitchen" %}</span><br><span class="line"></span><br><span class="line">Kitchen products:</span><br><span class="line">{% for product in kitchen_products %}</span><br><span class="line">- {{ product.title }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">All products:
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> <span class="token object">product</span> <span class="token keyword">in</span> products <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> kitchen_products <span class="token operator">=</span> products <span class="token operator">|</span> <span class="token function filter">where</span><span class="token operator">:</span> <span class="token string">"type"</span><span class="token punctuation">,</span> <span class="token string">"kitchen"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
Kitchen products:
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> <span class="token object">product</span> <span class="token keyword">in</span> kitchen_products <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">All products:</span><br><span class="line">- Vacuum</span><br><span class="line">- Spatula</span><br><span class="line">- Television</span><br><span class="line">- Garlic press</span><br><span class="line"></span><br><span class="line">Kitchen products:</span><br><span class="line">- Spatula</span><br><span class="line">- Garlic press</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">All products:
|
||||
- Vacuum
|
||||
- Spatula
|
||||
- Television
|
||||
- Garlic press
|
||||
|
||||
Kitchen products:
|
||||
- Spatula
|
||||
- Garlic press<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Say instead you have a list of products and you only want to show those that are available to buy. You can <code>where</code> with a property name but no target value to include all products with a <a href="../tutorials/truthy-and-falsy.html">truthy</a> <code>"available"</code> value.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line">All products:</span><br><span class="line">{% for product in products %}</span><br><span class="line">- {{ product.title }}</span><br><span class="line">{% endfor %}</span><br><span class="line"></span><br><span class="line">{% assign available_products = products | where: "available" %}</span><br><span class="line"></span><br><span class="line">Available products:</span><br><span class="line">{% for product in available_products %}</span><br><span class="line">- {{ product.title }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">All products:
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> <span class="token object">product</span> <span class="token keyword">in</span> products <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> available_products <span class="token operator">=</span> products <span class="token operator">|</span> <span class="token function filter">where</span><span class="token operator">:</span> <span class="token string">"available"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
Available products:
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> <span class="token object">product</span> <span class="token keyword">in</span> available_products <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">All products:</span><br><span class="line">- Coffee mug</span><br><span class="line">- Limited edition sneakers</span><br><span class="line">- Boring sneakers</span><br><span class="line"></span><br><span class="line">Available products:</span><br><span class="line">- Coffee mug</span><br><span class="line">- Boring sneakers</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">All products:
|
||||
- Coffee mug
|
||||
- Limited edition sneakers
|
||||
- Boring sneakers
|
||||
|
||||
Available products:
|
||||
- Coffee mug
|
||||
- Boring sneakers<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>The <code>where</code> filter can also be used to find a single object in an array when combined with the <code>first</code> filter. For example, say you want to show off the shirt in your new fall collection.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% assign new_shirt = products | where: "type", "shirt" | first %}</span><br><span class="line"></span><br><span class="line">Featured product: {{ new_shirt.title }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> new_shirt <span class="token operator">=</span> products <span class="token operator">|</span> <span class="token function filter">where</span><span class="token operator">:</span> <span class="token string">"type"</span><span class="token punctuation">,</span> <span class="token string">"shirt"</span> <span class="token operator">|</span> <span class="token function filter">first</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
Featured product: <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> new_shirt<span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Featured product: Hawaiian print sweater vest</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Featured product: Hawaiian print sweater vest<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Additionally, <code>property</code> can be any valid Liquid variable expression as used in output syntax, except that the scope of this expression is within each item. For the following <code>products</code> array:</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">const</span> products = [</span><br><span class="line"> { <span class="attr">meta</span>: { <span class="attr">details</span>: { <span class="attr">class</span>: <span class="string">'A'</span> } }, <span class="attr">order</span>: <span class="number">1</span> },</span><br><span class="line"> { <span class="attr">meta</span>: { <span class="attr">details</span>: { <span class="attr">class</span>: <span class="string">'B'</span> } }, <span class="attr">order</span>: <span class="number">2</span> },</span><br><span class="line"> { <span class="attr">meta</span>: { <span class="attr">details</span>: { <span class="attr">class</span>: <span class="string">'B'</span> } }, <span class="attr">order</span>: <span class="number">3</span> }</span><br><span class="line">]</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token keyword">const</span> products <span class="token operator">=</span> <span class="token punctuation">[</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">meta</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">details</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token keyword">class</span><span class="token operator">:</span> <span class="token string">'A'</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token literal-property property">order</span><span class="token operator">:</span> <span class="token number">1</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">meta</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">details</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token keyword">class</span><span class="token operator">:</span> <span class="token string">'B'</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token literal-property property">order</span><span class="token operator">:</span> <span class="token number">2</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
|
||||
<span class="token punctuation">{</span> <span class="token literal-property property">meta</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">details</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token keyword">class</span><span class="token operator">:</span> <span class="token string">'B'</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token literal-property property">order</span><span class="token operator">:</span> <span class="token number">3</span> <span class="token punctuation">}</span>
|
||||
<span class="token punctuation">]</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{% assign selected = products | where: 'meta.details["class"]', "B" %}</span><br><span class="line">{% for item in selected -%}</span><br><span class="line">- {{ item.order }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> selected <span class="token operator">=</span> products <span class="token operator">|</span> <span class="token function filter">where</span><span class="token operator">:</span> <span class="token string">'meta.details["class"]'</span><span class="token punctuation">,</span> <span class="token string">"B"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> selected <span class="token delimiter punctuation">-%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item<span class="token punctuation">.</span><span class="token object">order</span> <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">- 2</span><br><span class="line">- 3</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">- 2
|
||||
- 3<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="url_encode.html" class="article-footer-prev" title="sidebar.filters.url_encode"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="where_exp.html" class="article-footer-next" title="sidebar.filters.where_exp"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+21
-3
@@ -96,15 +96,33 @@
|
||||
|
||||
<p>Select all the objects in an array where the expression is true. In this example, assume you have a list of products and you want to show your kitchen products separately. Using <code>where_exp</code>, you can create an array containing only the products that have a <code>"type"</code> of <code>"kitchen"</code>.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line">All products:</span><br><span class="line">{% for product in products %}</span><br><span class="line">- {{ product.title }}</span><br><span class="line">{% endfor %}</span><br><span class="line"></span><br><span class="line">{% assign kitchen_products = products | where_exp: "item", "item.type == 'kitchen'" %}</span><br><span class="line"></span><br><span class="line">Kitchen products:</span><br><span class="line">{% for product in kitchen_products %}</span><br><span class="line">- {{ product.title }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">All products:
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> <span class="token object">product</span> <span class="token keyword">in</span> products <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> kitchen_products <span class="token operator">=</span> products <span class="token operator">|</span> <span class="token function filter">where_exp</span><span class="token operator">:</span> <span class="token string">"item"</span><span class="token punctuation">,</span> <span class="token string">"item.type == 'kitchen'"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
Kitchen products:
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> <span class="token object">product</span> <span class="token keyword">in</span> kitchen_products <span class="token delimiter punctuation">%}</span></span>
|
||||
- <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">All products:</span><br><span class="line">- Vacuum</span><br><span class="line">- Spatula</span><br><span class="line">- Television</span><br><span class="line">- Garlic press</span><br><span class="line"></span><br><span class="line">Kitchen products:</span><br><span class="line">- Spatula</span><br><span class="line">- Garlic press</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">All products:
|
||||
- Vacuum
|
||||
- Spatula
|
||||
- Television
|
||||
- Garlic press
|
||||
|
||||
Kitchen products:
|
||||
- Spatula
|
||||
- Garlic press<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="where.html" class="article-footer-prev" title="sidebar.filters.where"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="xml_escape.html" class="article-footer-next" title="sidebar.filters.xml_escape"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,14 +96,14 @@
|
||||
|
||||
<p>Escape some text for use in XML.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{{ "Have you read \'James & the Giant Peach\'?" | xml_escape }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token string">"Have you read \'James & the Giant Peach\'?"</span> <span class="token operator">|</span> <span class="token function filter">xml_escape</span> <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Have you read &#39;James &amp; the Giant Peach&#39;?</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Have you read &#39;James &amp; the Giant Peach&#39;?<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.422Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="where_exp.html" class="article-footer-prev" title="sidebar.filters.where_exp"><i class="icon-chevron-left"></i><span>Prev</span></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+635
-635
File diff suppressed because it is too large
Load Diff
+9
-5
@@ -96,21 +96,25 @@
|
||||
|
||||
<p>Creates a new variable.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_variable = false %}</span><br><span class="line">{% if my_variable != true %}</span><br><span class="line"> This statement is valid.</span><br><span class="line">{% endif %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_variable <span class="token operator">=</span> <span class="token boolean">false</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">if</span> my_variable <span class="token operator">!=</span> <span class="token boolean">true</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
This statement is valid.
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endif</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">This statement is valid.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">This statement is valid.<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Wrap a variable value in quotations <code>"</code> to save it as a string.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign foo = "bar" %}</span><br><span class="line">{{ foo }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> foo <span class="token operator">=</span> <span class="token string">"bar"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> foo <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">bar</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">bar<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="inline_comment.html" class="article-footer-prev" title="sidebar.tags.#"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="capture.html" class="article-footer-next" title="sidebar.tags.capture"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+13
-5
@@ -96,21 +96,29 @@
|
||||
|
||||
<p>Captures the string inside of the opening and closing tags and assigns it to a variable. Variables created through <code>capture</code> are strings.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% capture my_variable %}I am being captured.{% endcapture %}</span><br><span class="line">{{ my_variable }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">capture</span> my_variable <span class="token delimiter punctuation">%}</span></span>I am being captured.<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endcapture</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> my_variable <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">I am being captured.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">I am being captured.<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Using <code>capture</code>, you can create complex strings using other variables created with <code>assign</code>:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">{% assign favorite_food = "pizza" %}</span><br><span class="line">{% assign age = 35 %}</span><br><span class="line"></span><br><span class="line">{% capture about_me %}</span><br><span class="line">I am {{ age }} and my favorite food is {{ favorite_food }}.</span><br><span class="line">{% endcapture %}</span><br><span class="line"></span><br><span class="line">{{ about_me }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> favorite_food <span class="token operator">=</span> <span class="token string">"pizza"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> age <span class="token operator">=</span> <span class="token number">35</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">capture</span> about_me <span class="token delimiter punctuation">%}</span></span>
|
||||
I am <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> age <span class="token delimiter punctuation">}}</span></span> and my favorite food is <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> favorite_food <span class="token delimiter punctuation">}}</span></span>.
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endcapture</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> about_me <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">I am 35 and my favourite food is pizza.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">I am 35 and my favourite food is pizza.<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="assign.html" class="article-footer-prev" title="sidebar.tags.assign"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="case.html" class="article-footer-next" title="sidebar.tags.when"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+11
-3
@@ -96,14 +96,22 @@
|
||||
|
||||
<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>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">{% assign handle = "cake" %}</span><br><span class="line">{% case handle %}</span><br><span class="line"> {% when "cake" %}</span><br><span class="line"> This is a cake</span><br><span class="line"> {% when "cookie", "biscuit" %}</span><br><span class="line"> This is a cookie</span><br><span class="line"> {% else %}</span><br><span class="line"> This is neither a cake nor a cookie</span><br><span class="line">{% endcase %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> <span class="token object">handle</span> <span class="token operator">=</span> <span class="token string">"cake"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">case</span> <span class="token object">handle</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">when</span> <span class="token string">"cake"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
This is a cake
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">when</span> <span class="token string">"cookie"</span><span class="token punctuation">,</span> <span class="token string">"biscuit"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
This is a cookie
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">else</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
This is neither a cake nor a cookie
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endcase</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">This is a cake</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">This is a cake<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="capture.html" class="article-footer-prev" title="sidebar.tags.capture"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="comment.html" class="article-footer-next" title="sidebar.tags.comment"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+5
-3
@@ -96,14 +96,16 @@
|
||||
|
||||
<p>Allows you to leave un-rendered code inside a Liquid template. Any text within the opening and closing <code>comment</code> blocks will not be printed, and any Liquid code within will not be executed.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">Anything you put between {% comment %} and {% endcomment %} tags</span><br><span class="line">is turned into a comment.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">Anything you put between <span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">comment</span> <span class="token delimiter punctuation">%}</span><span class="token comment"> and </span><span class="token delimiter punctuation">{%</span> <span class="token keyword">endcomment</span> <span class="token delimiter punctuation">%}</span></span> tags
|
||||
is turned into a comment.<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">Anything you put between tags</span><br><span class="line">is turned into a comment.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">Anything you put between tags
|
||||
is turned into a comment.<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="case.html" class="article-footer-prev" title="sidebar.tags.when"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="cycle.html" class="article-footer-next" title="sidebar.tags.cycle"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+17
-5
@@ -96,10 +96,16 @@
|
||||
|
||||
<p>Loops through a group of strings and prints them in the order that they were passed as arguments. Each time <code>cycle</code> is called, the next string argument is printed.</p>
|
||||
<h2 id="Basic-Usage" class="article-heading"><a href="#Basic-Usage" class="headerlink" title="Basic Usage"></a>Basic Usage<a class="article-anchor" href="#Basic-Usage" aria-hidden="true"></a></h2><p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{% cycle "one", "two", "three" %}</span><br><span class="line">{% cycle "one", "two", "three" %}</span><br><span class="line">{% cycle "one", "two", "three" %}</span><br><span class="line">{% cycle "one", "two", "three" %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">cycle</span> <span class="token string">"one"</span><span class="token punctuation">,</span> <span class="token string">"two"</span><span class="token punctuation">,</span> <span class="token string">"three"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">cycle</span> <span class="token string">"one"</span><span class="token punctuation">,</span> <span class="token string">"two"</span><span class="token punctuation">,</span> <span class="token string">"three"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">cycle</span> <span class="token string">"one"</span><span class="token punctuation">,</span> <span class="token string">"two"</span><span class="token punctuation">,</span> <span class="token string">"three"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">cycle</span> <span class="token string">"one"</span><span class="token punctuation">,</span> <span class="token string">"two"</span><span class="token punctuation">,</span> <span class="token string">"three"</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">one</span><br><span class="line">two</span><br><span class="line">three</span><br><span class="line">one</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">one
|
||||
two
|
||||
three
|
||||
one<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Uses for <code>cycle</code> include:</p>
|
||||
<ul>
|
||||
@@ -108,14 +114,20 @@
|
||||
</ul>
|
||||
<h2 id="Parameters" class="article-heading"><a href="#Parameters" class="headerlink" title="Parameters"></a>Parameters<a class="article-anchor" href="#Parameters" aria-hidden="true"></a></h2><p><code>cycle</code> accepts a “cycle group” parameter in cases where you need multiple <code>cycle</code> blocks in one template. If no name is supplied for the cycle group, then it is assumed that multiple calls with the same parameters are one group.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{% cycle "first": "one", "two", "three" %}</span><br><span class="line">{% cycle "second": "one", "two", "three" %}</span><br><span class="line">{% cycle "second": "one", "two", "three" %}</span><br><span class="line">{% cycle "first": "one", "two", "three" %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">cycle</span> <span class="token string">"first"</span><span class="token operator">:</span> <span class="token string">"one"</span><span class="token punctuation">,</span> <span class="token string">"two"</span><span class="token punctuation">,</span> <span class="token string">"three"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">cycle</span> <span class="token string">"second"</span><span class="token operator">:</span> <span class="token string">"one"</span><span class="token punctuation">,</span> <span class="token string">"two"</span><span class="token punctuation">,</span> <span class="token string">"three"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">cycle</span> <span class="token string">"second"</span><span class="token operator">:</span> <span class="token string">"one"</span><span class="token punctuation">,</span> <span class="token string">"two"</span><span class="token punctuation">,</span> <span class="token string">"three"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">cycle</span> <span class="token string">"first"</span><span class="token operator">:</span> <span class="token string">"one"</span><span class="token punctuation">,</span> <span class="token string">"two"</span><span class="token punctuation">,</span> <span class="token string">"three"</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">one</span><br><span class="line">one</span><br><span class="line">two</span><br><span class="line">two</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">one
|
||||
one
|
||||
two
|
||||
two<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="comment.html" class="article-footer-prev" title="sidebar.tags.comment"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="decrement.html" class="article-footer-next" title="sidebar.tags.decrement"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+7
-3
@@ -96,16 +96,20 @@
|
||||
|
||||
<p>Creates a new number variable, and decreases its value by one every time it is called. The first value is <code>-1</code>.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% decrement variable %}</span><br><span class="line">{% decrement variable %}</span><br><span class="line">{% decrement variable %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">decrement</span> variable <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">decrement</span> variable <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">decrement</span> variable <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">-1</span><br><span class="line">-2</span><br><span class="line">-3</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">-1
|
||||
-2
|
||||
-3<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Like <a href="./increment.html">increment</a>, variables declared inside <code>decrement</code> are independent from variables created through <a href="./assign.html">assign</a> or <a href="./capture.html">capture</a>.</p>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="cycle.html" class="article-footer-prev" title="sidebar.tags.cycle"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="echo.html" class="article-footer-next" title="sidebar.tags.echo"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+4
-3
@@ -96,14 +96,15 @@
|
||||
|
||||
<p>Outputs an expression in the rendered HTML. This is identical to wrapping an expression in <code>{{` and `}}</code>, but works inside liquid tags and supports filters.</p>
|
||||
<h2 id="echo" class="article-heading"><a href="#echo" class="headerlink" title="echo"></a>echo<a class="article-anchor" href="#echo" aria-hidden="true"></a></h2><p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign username = 'Bob' %}</span><br><span class="line">{% echo username | append: ", welcome to LiquidJS!" | capitalize %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> username <span class="token operator">=</span> <span class="token string">'Bob'</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">echo</span> username <span class="token operator">|</span> <span class="token function filter">append</span><span class="token operator">:</span> <span class="token string">", welcome to LiquidJS!"</span> <span class="token operator">|</span> <span class="token function filter">capitalize</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Bob, welcome to LiquidJS!</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Bob, welcome to LiquidJS!<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="decrement.html" class="article-footer-prev" title="sidebar.tags.decrement"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="if.html" class="article-footer-next" title="sidebar.tags.if"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+104
-31
@@ -97,115 +97,188 @@
|
||||
<p>Iteration tags run blocks of code repeatedly.</p>
|
||||
<h2 id="Basic-Usage" class="article-heading"><a href="#Basic-Usage" class="headerlink" title="Basic Usage"></a>Basic Usage<a class="article-anchor" href="#Basic-Usage" aria-hidden="true"></a></h2><h3 id="for…in" class="article-heading"><a href="#for…in" class="headerlink" title="for…in"></a>for…in<a class="article-anchor" href="#for…in" aria-hidden="true"></a></h3><p>Repeatedly executes a block of code. For a full list of attributes available within a <code>for</code> loop, see <a href="#forloop">forloop</a>.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% for product in collection.products %}</span><br><span class="line"> {{ product.title }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> <span class="token object">product</span> <span class="token keyword">in</span> <span class="token object">collection</span><span class="token punctuation">.</span>products <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">hat shirt pants</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">hat shirt pants<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>For loops can iterate over arrays, hashes, and <a href="#range">ranges of integers</a>.</p>
|
||||
<p>When iterating a hash, item[0] contains the key, and item[1] contains the value:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% for item in hash %}</span><br><span class="line"> * {{ item[0] }}: {{ item[1] }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> hash <span class="token delimiter punctuation">%}</span></span>
|
||||
* <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span> <span class="token delimiter punctuation">}}</span></span>: <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item<span class="token punctuation">[</span><span class="token number">1</span><span class="token punctuation">]</span> <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">* key1: value1</span><br><span class="line">* key2: value2</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">* key1: value1
|
||||
* key2: value2<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<h3 id="else" class="article-heading"><a href="#else" class="headerlink" title="else"></a>else<a class="article-anchor" href="#else" aria-hidden="true"></a></h3><p>Specifies a fallback case for a <code>for</code> loop which will run if the loop has zero length.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% for product in collection.products %}</span><br><span class="line"> {{ product.title }}</span><br><span class="line">{% else %}</span><br><span class="line"> The collection is empty.</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> <span class="token object">product</span> <span class="token keyword">in</span> <span class="token object">collection</span><span class="token punctuation">.</span>products <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">else</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
The collection is empty.
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">The collection is empty.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">The collection is empty.<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h3 id="break" class="article-heading"><a href="#break" class="headerlink" title="break"></a>break<a class="article-anchor" href="#break" aria-hidden="true"></a></h3><p>Causes the loop to stop iterating when it encounters the <code>break</code> tag.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% for i in (1..5) %}</span><br><span class="line"> {%- if i == 4 -%}</span><br><span class="line"> {% break %}</span><br><span class="line"> {%- else -%}</span><br><span class="line"> {{ i }}</span><br><span class="line"> {%- endif -%}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> i <span class="token keyword">in</span> <span class="token punctuation">(</span><span class="token number">1</span><span class="token range operator">..</span><span class="token number">5</span><span class="token punctuation">)</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">if</span> i <span class="token operator">==</span> <span class="token number">4</span> <span class="token delimiter punctuation">-%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">break</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">else</span> <span class="token delimiter punctuation">-%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> i <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">endif</span> <span class="token delimiter punctuation">-%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">123</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">123<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h3 id="continue" class="article-heading"><a href="#continue" class="headerlink" title="continue"></a>continue<a class="article-anchor" href="#continue" aria-hidden="true"></a></h3><p>Causes the loop to skip the current iteration when it encounters the <code>continue</code> tag.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">{% for i in (1..5) %}</span><br><span class="line"> {%- if i == 4 -%}</span><br><span class="line"> {%- continue -%}</span><br><span class="line"> {%- else -%}</span><br><span class="line"> {{ i }}</span><br><span class="line"> {%- endif -%}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> i <span class="token keyword">in</span> <span class="token punctuation">(</span><span class="token number">1</span><span class="token range operator">..</span><span class="token number">5</span><span class="token punctuation">)</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">if</span> i <span class="token operator">==</span> <span class="token number">4</span> <span class="token delimiter punctuation">-%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">continue</span> <span class="token delimiter punctuation">-%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">else</span> <span class="token delimiter punctuation">-%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> i <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">endif</span> <span class="token delimiter punctuation">-%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">1235</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">1235<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h3 id="forloop" class="article-heading"><a href="#forloop" class="headerlink" title="forloop"></a>forloop<a class="article-anchor" href="#forloop" aria-hidden="true"></a></h3><p>There’s a <code>forloop</code> object available inside <code>for</code> loops. It’s used to indicate the current state of <code>for</code> loop.</p>
|
||||
<p>The <code>forloop.first</code>, <code>forloop.last</code> and <code>forloop.length</code> property:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">{% for i in (1..5) %}</span><br><span class="line"> {%- if forloop.first == true -%} First</span><br><span class="line"> {%- elsif forloop.last == true -%} Last</span><br><span class="line"> {%- else -%} {{ forloop.length }}</span><br><span class="line"> {%- endif %}</span><br><span class="line">{% endfor -%}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> i <span class="token keyword">in</span> <span class="token punctuation">(</span><span class="token number">1</span><span class="token range operator">..</span><span class="token number">5</span><span class="token punctuation">)</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">if</span> <span class="token object">forloop</span><span class="token punctuation">.</span><span class="token function">first</span> <span class="token operator">==</span> <span class="token boolean">true</span> <span class="token delimiter punctuation">-%}</span></span> First
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">elsif</span> <span class="token object">forloop</span><span class="token punctuation">.</span><span class="token function">last</span> <span class="token operator">==</span> <span class="token boolean">true</span> <span class="token delimiter punctuation">-%}</span></span> Last
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">else</span> <span class="token delimiter punctuation">-%}</span></span> <span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">forloop</span><span class="token punctuation">.</span>length <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> <span class="token keyword">endif</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">-%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">First</span><br><span class="line">5</span><br><span class="line">5</span><br><span class="line">5</span><br><span class="line">Last</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">First
|
||||
5
|
||||
5
|
||||
5
|
||||
Last<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>The <code>forloop.index</code>, <code>forloop.index0</code>, <code>forloop.rindex</code> and <code>forloop.rindex0</code> property:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">index index0 rindex rindex0</span><br><span class="line">{% for i in (1..5) %}</span><br><span class="line"> {{- forloop.index }} {{ forloop.index0 }} {{ forloop.rindex }} {{ forloop.rindex0 }}</span><br><span class="line">{% endfor -%}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-none"><code class="language-none">index index0 rindex rindex0
|
||||
{% for i in (1..5) %}
|
||||
{{- forloop.index }} {{ forloop.index0 }} {{ forloop.rindex }} {{ forloop.rindex0 }}
|
||||
{% endfor -%}<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">index index0 rindex rindex0</span><br><span class="line">1 0 5 4</span><br><span class="line">2 1 4 3</span><br><span class="line">3 2 3 2</span><br><span class="line">4 3 2 1</span><br><span class="line">5 4 1 0</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-none"><code class="language-none">index index0 rindex rindex0
|
||||
1 0 5 4
|
||||
2 1 4 3
|
||||
3 2 3 2
|
||||
4 3 2 1
|
||||
5 4 1 0<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Parameters" class="article-heading"><a href="#Parameters" class="headerlink" title="Parameters"></a>Parameters<a class="article-anchor" href="#Parameters" aria-hidden="true"></a></h2><h3 id="limit" class="article-heading"><a href="#limit" class="headerlink" title="limit"></a>limit<a class="article-anchor" href="#limit" aria-hidden="true"></a></h3><p>Limits the loop to the specified number of iterations.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><!-- for array = [1,2,3,4,5,6] --></span><br><span class="line">{% for item in array limit:2 %}</span><br><span class="line"> {{- item -}}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token comment"><!-- for array = [1,2,3,4,5,6] --></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> array <span class="token keyword">limit</span><span class="token operator">:</span><span class="token number">2</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{-</span> item <span class="token delimiter punctuation">-}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">12</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">12<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h3 id="offset" class="article-heading"><a href="#offset" class="headerlink" title="offset"></a>offset<a class="article-anchor" href="#offset" aria-hidden="true"></a></h3><p>Begins the loop at the specified index.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><!-- for array = [1,2,3,4,5,6] --></span><br><span class="line">{% for item in array offset:2 %}</span><br><span class="line"> {{- item -}}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token comment"><!-- for array = [1,2,3,4,5,6] --></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> array <span class="token keyword">offset</span><span class="token operator">:</span><span class="token number">2</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{-</span> item <span class="token delimiter punctuation">-}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">3456</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">3456<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h4 id="offset-continue" class="article-heading"><a href="#offset-continue" class="headerlink" title="offset:continue"></a>offset:continue<a class="article-anchor" href="#offset-continue" aria-hidden="true"></a></h4><p class="since">v9.33.0</p>
|
||||
|
||||
<p>Offset value can be <code>continue</code> to continue previous loop. For example:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line"><!-- for array = [1,2,3,4,5,6] --></span><br><span class="line">{% for item in array limit:2 %}</span><br><span class="line"> {{- item -}}</span><br><span class="line">{% endfor%}</span><br><span class="line">{% for item in array offset:continue %}</span><br><span class="line"> {{- item -}}</span><br><span class="line">{% endfor%}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token comment"><!-- for array = [1,2,3,4,5,6] --></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> array <span class="token keyword">limit</span><span class="token operator">:</span><span class="token number">2</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{-</span> item <span class="token delimiter punctuation">-}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span><span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> array <span class="token keyword">offset</span><span class="token operator">:</span><span class="token keyword">continue</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{-</span> item <span class="token delimiter punctuation">-}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span><span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">12</span><br><span class="line">3456</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">12
|
||||
3456<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>For the same variable name (<code>"item"</code> in this case) and same collection (<code>"array"</code> in this case), there’s one position record. That means you can start a new loop with a different variable name:</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line"><!-- for array = [1,2,3,4,5,6] --></span><br><span class="line">{% for item in array limit:2 %}</span><br><span class="line"> {{- item -}}</span><br><span class="line">{% endfor%}</span><br><span class="line">{% for item2 in array offset:continue %}</span><br><span class="line"> {{- item2 -}}</span><br><span class="line">{% endfor%}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token comment"><!-- for array = [1,2,3,4,5,6] --></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> array <span class="token keyword">limit</span><span class="token operator">:</span><span class="token number">2</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{-</span> item <span class="token delimiter punctuation">-}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span><span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item2 <span class="token keyword">in</span> array <span class="token keyword">offset</span><span class="token operator">:</span><span class="token keyword">continue</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{-</span> item2 <span class="token delimiter punctuation">-}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span><span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">12</span><br><span class="line">123456</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">12
|
||||
123456<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<h3 id="range" class="article-heading"><a href="#range" class="headerlink" title="range"></a>range<a class="article-anchor" href="#range" aria-hidden="true"></a></h3><p>Defines a range of numbers to loop through. The range can be defined by both literal and variable numbers.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">{% for i in (3..5) %}</span><br><span class="line"> {{- i -}}</span><br><span class="line">{% endfor-%}</span><br><span class="line"></span><br><span class="line">{% assign num = 4 %}</span><br><span class="line">{% for i in (1..num) %}</span><br><span class="line"> {{- i -}}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> i <span class="token keyword">in</span> <span class="token punctuation">(</span><span class="token number">3</span><span class="token range operator">..</span><span class="token number">5</span><span class="token punctuation">)</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{-</span> i <span class="token delimiter punctuation">-}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span><span class="token delimiter punctuation">-%}</span></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> num <span class="token operator">=</span> <span class="token number">4</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> i <span class="token keyword">in</span> <span class="token punctuation">(</span><span class="token number">1</span><span class="token range operator">..</span>num<span class="token punctuation">)</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{-</span> i <span class="token delimiter punctuation">-}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">345</span><br><span class="line">1234</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">345
|
||||
1234<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<h3 id="reversed" class="article-heading"><a href="#reversed" class="headerlink" title="reversed"></a>reversed<a class="article-anchor" href="#reversed" aria-hidden="true"></a></h3><p>Reverses the order of the loop. Note that this flag’s spelling is different from the filter <code>reverse</code>.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><!-- if array = [1,2,3,4,5,6] --></span><br><span class="line">{% for item in array reversed %}</span><br><span class="line"> {{ item }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token comment"><!-- if array = [1,2,3,4,5,6] --></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> item <span class="token keyword">in</span> array <span class="token keyword">reversed</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> item <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">6 5 4 3 2 1</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">6 5 4 3 2 1<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>When used with additional parameters, order is important. Leading with <code>reversed</code> reverses the order of the loop before executing the other parameters.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% for i in (1..8) reversed limit: 4 %}</span><br><span class="line"> {{ i }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> i <span class="token keyword">in</span> <span class="token punctuation">(</span><span class="token number">1</span><span class="token range operator">..</span><span class="token number">8</span><span class="token punctuation">)</span> <span class="token keyword">reversed</span> <span class="token keyword">limit</span><span class="token operator">:</span> <span class="token number">4</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> i <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">8 7 6 5</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">8 7 6 5<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% for i in (1..8) limit: 4 reversed %}</span><br><span class="line"> {{ i }}</span><br><span class="line">{% endfor %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">for</span> i <span class="token keyword">in</span> <span class="token punctuation">(</span><span class="token number">1</span><span class="token range operator">..</span><span class="token number">8</span><span class="token punctuation">)</span> <span class="token keyword">limit</span><span class="token operator">:</span> <span class="token number">4</span> <span class="token keyword">reversed</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> i <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endfor</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">4 3 2 1</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">4 3 2 1<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="if.html" class="article-footer-prev" title="sidebar.tags.if"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="include.html" class="article-footer-next" title="sidebar.tags.include"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+14
-5
@@ -96,21 +96,30 @@
|
||||
|
||||
<p>Executes a block of code only if a certain condition is <code>true</code>.</p>
|
||||
<h2 id="if" class="article-heading"><a href="#if" class="headerlink" title="if"></a>if<a class="article-anchor" href="#if" aria-hidden="true"></a></h2><p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% if product.title == "Awesome Shoes" %}</span><br><span class="line"> These shoes are awesome!</span><br><span class="line">{% endif %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">if</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token operator">==</span> <span class="token string">"Awesome Shoes"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
These shoes are awesome!
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endif</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">These shoes are awesome!</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">These shoes are awesome!<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h2 id="elsif-else" class="article-heading"><a href="#elsif-else" class="headerlink" title="elsif / else"></a>elsif / else<a class="article-anchor" href="#elsif-else" aria-hidden="true"></a></h2><p>Adds more conditions within an <code>if</code> or <code>unless</code> block.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><!-- If customer.name = "anonymous" --></span><br><span class="line">{% if customer.name == "kevin" %}</span><br><span class="line"> Hey Kevin!</span><br><span class="line">{% elsif customer.name == "anonymous" %}</span><br><span class="line"> Hey Anonymous!</span><br><span class="line">{% else %}</span><br><span class="line"> Hi Stranger!</span><br><span class="line">{% endif %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token comment"><!-- If customer.name = "anonymous" --></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">if</span> <span class="token object">customer</span><span class="token punctuation">.</span>name <span class="token operator">==</span> <span class="token string">"kevin"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
Hey Kevin!
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">elsif</span> <span class="token object">customer</span><span class="token punctuation">.</span>name <span class="token operator">==</span> <span class="token string">"anonymous"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
Hey Anonymous!
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">else</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
Hi Stranger!
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endif</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Hey Anonymous!</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Hey Anonymous!<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="echo.html" class="article-footer-prev" title="sidebar.tags.echo"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="for.html" class="article-footer-next" title="sidebar.tags.for"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+19
-11
@@ -98,30 +98,32 @@
|
||||
</blockquote>
|
||||
|
||||
<h2 id="Include-a-Template" class="article-heading"><a href="#Include-a-Template" class="headerlink" title="Include a Template"></a>Include a Template<a class="article-anchor" href="#Include-a-Template" aria-hidden="true"></a></h2><p>Renders a partial template from the template <a href="/api/interfaces/LiquidOptions.html#root">roots</a>.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% include 'footer.liquid' %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">include</span> <span class="token string">'footer.liquid'</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>If <a href="/api/interfaces/LiquidOptions.html#extname">extname</a> option is set, the above <code>.liquid</code> extension becomes optional:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% include 'footer' %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">include</span> <span class="token string">'footer'</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>When a partial template is rendered by <code>include</code>, the code inside it can access its parent’s variables but its parent cannot access variables defined inside a included template.</p>
|
||||
<h2 id="Passing-Variables" class="article-heading"><a href="#Passing-Variables" class="headerlink" title="Passing Variables"></a>Passing Variables<a class="article-anchor" href="#Passing-Variables" aria-hidden="true"></a></h2><p>Variables defined in parent’s scope can be passed to a the partial template by listing them as parameters on the <code>include</code> tag:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_variable = 'apples' %}</span><br><span class="line">{% include 'name', my_variable: my_variable, my_other_variable: 'oranges' %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_variable <span class="token operator">=</span> <span class="token string">'apples'</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">include</span> <span class="token string">'name'</span><span class="token punctuation">,</span> my_variable<span class="token operator">:</span> my_variable<span class="token punctuation">,</span> my_other_variable<span class="token operator">:</span> <span class="token string">'oranges'</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<h2 id="The-with-Parameter" class="article-heading"><a href="#The-with-Parameter" class="headerlink" title="The with Parameter"></a>The <code>with</code> Parameter<a class="article-anchor" href="#The-with-Parameter" aria-hidden="true"></a></h2><p>A single object can be passed to a snippet by using the <code>with...as</code> syntax:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign featured_product = all_products['product_handle'] %}</span><br><span class="line">{% include 'product' with featured_product as product %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> featured_product <span class="token operator">=</span> all_products<span class="token punctuation">[</span><span class="token string">'product_handle'</span><span class="token punctuation">]</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">include</span> <span class="token string">'product'</span> <span class="token keyword">with</span> featured_product <span class="token keyword">as</span> <span class="token object">product</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>In the example above, the <code>product</code> variable in the partial template will hold the value of <code>featured_product</code> in the parent template.</p>
|
||||
<h2 id="Outputs-amp-Filters" class="article-heading"><a href="#Outputs-amp-Filters" class="headerlink" title="Outputs & Filters"></a>Outputs & Filters<a class="article-anchor" href="#Outputs-amp-Filters" aria-hidden="true"></a></h2><p>When filename is specified as literal string, it supports Liquid output and filter syntax. Useful when concatenating strings for a complex filename.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% include "prefix/{{name | append: \".html\"}}" %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">include</span> <span class="token string">"prefix/{{name | append: \"</span><span class="token punctuation">.</span>html\<span class="token string">"}}"</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<blockquote class="note info"><strong class="note-title">Escaping</strong><p>In LiquidJS, <code>"</code> within quoted string literals need to be escaped by adding a slash before the quote, e.g. <code>\"</code>. Using Jekyll-like filenames can make this easier, see below.</p>
|
||||
</blockquote>
|
||||
|
||||
<h2 id="Jekyll-like-filenames" class="article-heading"><a href="#Jekyll-like-filenames" class="headerlink" title="Jekyll-like filenames"></a>Jekyll-like filenames<a class="article-anchor" href="#Jekyll-like-filenames" aria-hidden="true"></a></h2><p>Setting <a href="/api/interfaces/LiquidOptions.html#dynamicPartials">dynamicPartials</a> to <code>false</code> will enable Jekyll-like filenames, where file names are specified as literal string without surrounding quotes. Liquid outputs and filters are also supported within that, for example:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% include prefix/{{ page.my_variable }}/suffix %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">include</span> prefix/{{ <span class="token object">page</span><span class="token punctuation">.</span>my_variable }}/suffix <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>This way, you don’t need to escape <code>"</code> in the filename expression.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% include prefix/{{name | append: ".html"}} %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">include</span> prefix/{{name <span class="token operator">|</span> <span class="token function filter">append</span><span class="token operator">:</span> <span class="token string">".html"</span>}} <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Jekyll-include" class="article-heading"><a href="#Jekyll-include" class="headerlink" title="Jekyll include"></a>Jekyll include<a class="article-anchor" href="#Jekyll-include" aria-hidden="true"></a></h2><p class="since">v9.33.0</p>
|
||||
|
||||
@@ -132,18 +134,24 @@
|
||||
<li>Parameters are under <code>include</code> variable instead of current scope.</li>
|
||||
</ul>
|
||||
<p>For example, the following template:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% include article.html header="HEADER" content="CONTENT" %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">include</span> <span class="token object">article</span><span class="token punctuation">.</span>html header<span class="token operator">=</span><span class="token string">"HEADER"</span> content<span class="token operator">=</span><span class="token string">"CONTENT"</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p><code>article.html</code> with following content:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><article></span><br><span class="line"> <header>{{include.header}}</header></span><br><span class="line"> {{include.content}}</span><br><span class="line"></article></span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>article</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>header</span><span class="token punctuation">></span></span><span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span><span class="token keyword">include</span><span class="token punctuation">.</span>header<span class="token delimiter punctuation">}}</span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>header</span><span class="token punctuation">></span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span><span class="token keyword">include</span><span class="token punctuation">.</span>content<span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>article</span><span class="token punctuation">></span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Note that we’re referencing the first parameter by <code>include.header</code> instead of <code>header</code>. Will output following:</p>
|
||||
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="tag"><<span class="name">article</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">header</span>></span>HEADER<span class="tag"></<span class="name">header</span>></span></span><br><span class="line"> CONTENT</span><br><span class="line"><span class="tag"></<span class="name">article</span>></span></span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-markup" data-language="markup"><code class="language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>article</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>header</span><span class="token punctuation">></span></span>HEADER<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>header</span><span class="token punctuation">></span></span>
|
||||
CONTENT
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>article</span><span class="token punctuation">></span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="for.html" class="article-footer-prev" title="sidebar.tags.for"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="increment.html" class="article-footer-next" title="sidebar.tags.increment"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+16
-5
@@ -96,23 +96,34 @@
|
||||
|
||||
<p>Creates a new number variable, and increases its value by one every time it is called. The first value is <code>0</code>.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% increment my_counter %}</span><br><span class="line">{% increment my_counter %}</span><br><span class="line">{% increment my_counter %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">increment</span> my_counter <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">increment</span> my_counter <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">increment</span> my_counter <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">0</span><br><span class="line">1</span><br><span class="line">2</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">0
|
||||
1
|
||||
2<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Variables created through the <code>increment</code> tag are independent from variables created through <a href="./assign.html">assign</a> or <a href="./capture.html">capture</a>.</p>
|
||||
<p>In the example below, a variable named “var” is created through <code>assign</code>. The <code>increment</code> tag is then used several times on a variable with the same name. Note that the <code>increment</code> tag does not affect the value of “var” that was created through <code>assign</code>.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">{% assign var = 10 %}</span><br><span class="line">{% increment var %}</span><br><span class="line">{% increment var %}</span><br><span class="line">{% increment var %}</span><br><span class="line">{{ var }}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> var <span class="token operator">=</span> <span class="token number">10</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">increment</span> var <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">increment</span> var <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">increment</span> var <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> var <span class="token delimiter punctuation">}}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">0</span><br><span class="line">1</span><br><span class="line">2</span><br><span class="line">10</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">0
|
||||
1
|
||||
2
|
||||
10<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="include.html" class="article-footer-prev" title="sidebar.tags.include"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="layout.html" class="article-footer-next" title="sidebar.tags.layout"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -96,24 +96,39 @@
|
||||
|
||||
<p>Add comments to a Liquid template using an inline tag. Text enclosed in an inline comment tag will not be printed.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">Anything inside an inline comment tag will not be printed.</span><br><span class="line">{% # this is an inline comment %}</span><br><span class="line">But every line must start with a '#'.</span><br><span class="line">{%</span><br><span class="line"> # this is a comment</span><br><span class="line"> # that spans multiple lines</span><br><span class="line">%}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">Anything inside an inline comment tag will not be printed.
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> # this is an inline <span class="token keyword">comment</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
But every line must start with a '#'.
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span>
|
||||
# this is a <span class="token keyword">comment</span>
|
||||
# that spans multiple lines
|
||||
<span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">Anything inside an inline comment tag will not be printed.</span><br><span class="line">But every line must start with a '#'.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Anything inside an inline comment tag will not be printed.
|
||||
But every line must start with a '#'.<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Inline comments are useful inside <a href="./liquid.html"><code>liquid</code></a> tags too.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">{% liquid</span><br><span class="line"> # required args</span><br><span class="line"> assign product = collection.products.first</span><br><span class="line"></span><br><span class="line"> # optional args</span><br><span class="line"> assign should_show_border = should_show_border | default: true</span><br><span class="line"> assign should_highlight = should_highlight | default: false</span><br><span class="line">%}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">liquid</span>
|
||||
# required args
|
||||
<span class="token keyword">assign</span> <span class="token object">product</span> <span class="token operator">=</span> <span class="token object">collection</span><span class="token punctuation">.</span>products<span class="token punctuation">.</span><span class="token function">first</span>
|
||||
|
||||
# optional args
|
||||
<span class="token keyword">assign</span> should_show_border <span class="token operator">=</span> should_show_border <span class="token operator">|</span> <span class="token function filter">default</span><span class="token operator">:</span> <span class="token boolean">true</span>
|
||||
<span class="token keyword">assign</span> should_highlight <span class="token operator">=</span> should_highlight <span class="token operator">|</span> <span class="token function filter">default</span><span class="token operator">:</span> <span class="token boolean">false</span>
|
||||
<span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>But they don’t work well for commenting out blocks of Liquid code. The <a href="./comment.html"><code>comment</code></a> block tag is the better option when you need to temporarily stop other tags from being executed.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{%- # {% echo 'Welcome to LiquidJS!' %} -%}</span><br><span class="line">{% comment %}{% echo 'Welcome to LiquidJS!' %}{% endcomment %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%-</span> # {% <span class="token keyword">echo</span> <span class="token string">'Welcome to LiquidJS!'</span> <span class="token delimiter punctuation">%}</span></span> -%}
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">comment</span> <span class="token delimiter punctuation">%}</span><span class="token comment">{% echo 'Welcome to LiquidJS!' %}</span><span class="token delimiter punctuation">{%</span> <span class="token keyword">endcomment</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">-%}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">-%}<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="overview.html" class="article-footer-prev" title="Overview"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="assign.html" class="article-footer-next" title="sidebar.tags.assign"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+38
-9
@@ -95,39 +95,68 @@
|
||||
<p class="since">v1.9.1</p>
|
||||
|
||||
<h2 id="Using-a-Layout" class="article-heading"><a href="#Using-a-Layout" class="headerlink" title="Using a Layout"></a>Using a Layout<a class="article-anchor" href="#Using-a-Layout" aria-hidden="true"></a></h2><p>Introduce a layout template for the current template to render in. The directory for layout files are defined by <a href="/api/interfaces/LiquidOptions.html#layouts">layouts</a> or <a href="/api/interfaces/LiquidOptions.html#root">root</a>.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line">// default-layout.liquid</span><br><span class="line">Header</span><br><span class="line">{% block %}{% endblock %}</span><br><span class="line">Footer</span><br><span class="line"></span><br><span class="line">// page.liquid</span><br><span class="line">{% layout "default-layout.liquid" %}</span><br><span class="line">{% block %}My page content{% endblock %}</span><br><span class="line"></span><br><span class="line">// result</span><br><span class="line">Header</span><br><span class="line">My page content</span><br><span class="line">Footer</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">// default-layout.liquid
|
||||
Header
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> <span class="token delimiter punctuation">%}</span></span><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span>
|
||||
Footer
|
||||
|
||||
// page.liquid
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> layout <span class="token string">"default-layout.liquid"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> <span class="token delimiter punctuation">%}</span></span>My page content<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
// result
|
||||
Header
|
||||
My page content
|
||||
Footer<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>If <a href="/api/interfaces/LiquidOptions.html#extname">extname</a> option is set, the <code>.liquid</code> extension becomes optional:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% layout 'default-layout' %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> layout <span class="token string">'default-layout'</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<blockquote class="note info"><strong class="note-title">Scoping</strong><p>When a partial template is rendered by <code>layout</code>, its template have access for its caller’s variables but not vice versa. Variables defined in layout will be popped out before control returning to its caller.</p>
|
||||
</blockquote>
|
||||
|
||||
<h2 id="Multiple-Blocks" class="article-heading"><a href="#Multiple-Blocks" class="headerlink" title="Multiple Blocks"></a>Multiple Blocks<a class="article-anchor" href="#Multiple-Blocks" aria-hidden="true"></a></h2><p>The layout file can contain multiple blocks, each with a specified name. The following snippets yield same result as in the above example.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">// default-layout.liquid</span><br><span class="line">{% block header %}{% endblock %}</span><br><span class="line">{% block content %}{% endblock %}</span><br><span class="line">{% block footer %}{% endblock %}</span><br><span class="line"></span><br><span class="line">// page.liquid</span><br><span class="line">{% layout "default-layout.liquid" %}</span><br><span class="line">{% block header %}Header{% endblock %}</span><br><span class="line">{% block content %}My page content{% endblock %}</span><br><span class="line">{% block footer %}Footer{% endblock %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">// default-layout.liquid
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> header <span class="token delimiter punctuation">%}</span></span><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> content <span class="token delimiter punctuation">%}</span></span><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> footer <span class="token delimiter punctuation">%}</span></span><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
// page.liquid
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> layout <span class="token string">"default-layout.liquid"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> header <span class="token delimiter punctuation">%}</span></span>Header<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> content <span class="token delimiter punctuation">%}</span></span>My page content<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> footer <span class="token delimiter punctuation">%}</span></span>Footer<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Default-Block-Contents" class="article-heading"><a href="#Default-Block-Contents" class="headerlink" title="Default Block Contents"></a>Default Block Contents<a class="article-anchor" href="#Default-Block-Contents" aria-hidden="true"></a></h2><p>In the above layout files, blocks has empty contents. But it’s not necessarily be empty, in which case, the block contents in layout files will be used as default templates. The following snippets are also equivalent to the above examples:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line">// default-layout.liquid</span><br><span class="line">{% block header %}Header{% endblock %}</span><br><span class="line">{% block content %}{% endblock %}</span><br><span class="line">{% block footer %}Footer{% endblock %}</span><br><span class="line"></span><br><span class="line">// page.liquid</span><br><span class="line">{% layout "default-layout.liquid" %}</span><br><span class="line">{% block content %}My page content{% endblock %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">// default-layout.liquid
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> header <span class="token delimiter punctuation">%}</span></span>Header<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> content <span class="token delimiter punctuation">%}</span></span><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> footer <span class="token delimiter punctuation">%}</span></span>Footer<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
// page.liquid
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> layout <span class="token string">"default-layout.liquid"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token object">block</span> content <span class="token delimiter punctuation">%}</span></span>My page content<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> endblock <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Passing-Variables" class="article-heading"><a href="#Passing-Variables" class="headerlink" title="Passing Variables"></a>Passing Variables<a class="article-anchor" href="#Passing-Variables" aria-hidden="true"></a></h2><p>Variables defined in current template can be passed to a the layout template by listing them as parameters on the <code>layout</code> tag:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_variable = 'apples' %}</span><br><span class="line">{% layout 'name', my_variable: my_variable, my_other_variable: 'oranges' %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_variable <span class="token operator">=</span> <span class="token string">'apples'</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> layout <span class="token string">'name'</span><span class="token punctuation">,</span> my_variable<span class="token operator">:</span> my_variable<span class="token punctuation">,</span> my_other_variable<span class="token operator">:</span> <span class="token string">'oranges'</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Outputs-amp-Filters" class="article-heading"><a href="#Outputs-amp-Filters" class="headerlink" title="Outputs & Filters"></a>Outputs & Filters<a class="article-anchor" href="#Outputs-amp-Filters" aria-hidden="true"></a></h2><p>When filename is specified as literal string, it supports Liquid output and filter syntax. Useful when concatenating strings for a complex filename.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% layout "prefix/{{name | append: \".html\"}}" %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> layout <span class="token string">"prefix/{{name | append: \"</span><span class="token punctuation">.</span>html\<span class="token string">"}}"</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<blockquote class="note info"><strong class="note-title">Escaping</strong><p>In LiquidJS, <code>"</code> within quoted string literals need to be escaped. Adding a slash before the quote, e.g. <code>\"</code>. Using Jekyll-like filenames can make this easier, see below.</p>
|
||||
</blockquote>
|
||||
|
||||
<h2 id="Jekyll-like-Filenames" class="article-heading"><a href="#Jekyll-like-Filenames" class="headerlink" title="Jekyll-like Filenames"></a>Jekyll-like Filenames<a class="article-anchor" href="#Jekyll-like-Filenames" aria-hidden="true"></a></h2><p>Setting <a href="/api/interfaces/LiquidOptions.html#dynamicPartials">dynamicPartials</a> to <code>false</code> will enable Jekyll-like filenames, file names are specified as literal string. And it also supports Liquid outputs and filters.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% layout prefix/{{ page.my_variable }}/suffix %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> layout prefix/{{ <span class="token object">page</span><span class="token punctuation">.</span>my_variable }}/suffix <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>This way, you don’t need to escape <code>"</code> in the filename expression.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% layout prefix/{{name | append: ".html"}} %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> layout prefix/{{name <span class="token operator">|</span> <span class="token function filter">append</span><span class="token operator">:</span> <span class="token string">".html"</span>}} <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="increment.html" class="article-footer-prev" title="sidebar.tags.increment"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="liquid.html" class="article-footer-next" title="sidebar.tags.liquid"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+12
-3
@@ -96,14 +96,23 @@
|
||||
|
||||
<p>Encloses multiple tags within one set of delimiters, to allow writing Liquid logic more concisely.</p>
|
||||
<h2 id="liquid" class="article-heading"><a href="#liquid" class="headerlink" title="liquid"></a>liquid<a class="article-anchor" href="#liquid" aria-hidden="true"></a></h2><p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">{% liquid</span><br><span class="line"> assign names = 'Bob, Sally' | split: ', '</span><br><span class="line"></span><br><span class="line"> for name in names</span><br><span class="line"> echo 'Hello, ' | append: name</span><br><span class="line"> unless forloop.last</span><br><span class="line"> echo ', '</span><br><span class="line"> endunless</span><br><span class="line"> endfor</span><br><span class="line">%}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">liquid</span>
|
||||
<span class="token keyword">assign</span> names <span class="token operator">=</span> <span class="token string">'Bob, Sally'</span> <span class="token operator">|</span> <span class="token function filter">split</span><span class="token operator">:</span> <span class="token string">', '</span>
|
||||
|
||||
<span class="token keyword">for</span> name <span class="token keyword">in</span> names
|
||||
<span class="token keyword">echo</span> <span class="token string">'Hello, '</span> <span class="token operator">|</span> <span class="token function filter">append</span><span class="token operator">:</span> name
|
||||
<span class="token keyword">unless</span> <span class="token object">forloop</span><span class="token punctuation">.</span><span class="token function">last</span>
|
||||
<span class="token keyword">echo</span> <span class="token string">', '</span>
|
||||
<span class="token keyword">endunless</span>
|
||||
<span class="token keyword">endfor</span>
|
||||
<span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">Hello, Bob, Hello Sally</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">Hello, Bob, Hello Sally<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="layout.html" class="article-footer-prev" title="sidebar.tags.layout"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="raw.html" class="article-footer-next" title="sidebar.tags.raw"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+1
-1
@@ -131,7 +131,7 @@
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="inline_comment.html" class="article-footer-next" title="sidebar.tags.#"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+6
-3
@@ -96,14 +96,17 @@
|
||||
|
||||
<p>Raw temporarily disables tag processing. This is useful for generating content<br>(eg, Mustache, Handlebars) which uses conflicting syntax.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">{% raw %}</span><br><span class="line"> In Handlebars, {{ this }} will be HTML-escaped, but</span><br><span class="line"> {{{ that }}} will not.</span><br><span class="line">{% endraw %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">raw</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
In Handlebars, {{ this }} will be HTML-escaped, but
|
||||
{{{ that }}} will not.
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endraw</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">In Handlebars, {{ this }} will be HTML-escaped, but {{{ that }}} will not.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">In Handlebars, {{ this }} will be HTML-escaped, but {{{ that }}} will not.<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="liquid.html" class="article-footer-prev" title="sidebar.tags.liquid"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="render.html" class="article-footer-next" title="sidebar.tags.render"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+21
-9
@@ -95,36 +95,48 @@
|
||||
<p class="since">v9.2.0</p>
|
||||
|
||||
<h2 id="Render-a-Template" class="article-heading"><a href="#Render-a-Template" class="headerlink" title="Render a Template"></a>Render a Template<a class="article-anchor" href="#Render-a-Template" aria-hidden="true"></a></h2><p>Render a partial template from partials directory specified by <a href="/api/interfaces/LiquidOptions.html#partials">partials</a> or <a href="/api/interfaces/LiquidOptions.html#root">root</a>.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">// index.liquid</span><br><span class="line">Contents</span><br><span class="line">{% render 'footer.liquid' %}</span><br><span class="line"></span><br><span class="line">// footer.liquid</span><br><span class="line">Footer</span><br><span class="line"></span><br><span class="line">// result</span><br><span class="line">Contents</span><br><span class="line">Footer</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid">// index.liquid
|
||||
Contents
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">render</span> <span class="token string">'footer.liquid'</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
|
||||
// footer.liquid
|
||||
Footer
|
||||
|
||||
// result
|
||||
Contents
|
||||
Footer<span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>If <a href="/api/interfaces/LiquidOptions.html#extname">extname</a> option is set, the above <code>.liquid</code> extension becomes optional:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% render 'footer' %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">render</span> <span class="token string">'footer'</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<blockquote class="note info"><strong class="note-title">Variable Scope</strong><p>When a partial template is rendered, the code inside it can’t access its parent’s variables and its variables won’t be accessible by its parent. This encapsulation makes partials easier to understand and maintain.</p>
|
||||
</blockquote>
|
||||
|
||||
<h2 id="Passing-Variables" class="article-heading"><a href="#Passing-Variables" class="headerlink" title="Passing Variables"></a>Passing Variables<a class="article-anchor" href="#Passing-Variables" aria-hidden="true"></a></h2><p>Variables defined in parent’s scope can be passed to a the partial template by listing them as parameters on the render tag:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign my_variable = 'apples' %}</span><br><span class="line">{% render 'name', my_variable: my_variable, my_other_variable: 'oranges' %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> my_variable <span class="token operator">=</span> <span class="token string">'apples'</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">render</span> <span class="token string">'name'</span><span class="token punctuation">,</span> my_variable<span class="token operator">:</span> my_variable<span class="token punctuation">,</span> my_other_variable<span class="token operator">:</span> <span class="token string">'oranges'</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p><a href="/api/interfaces/LiquidOptions.html#globals">globals</a> don’t need to be passed down. They are accessible from all files.</p>
|
||||
<h2 id="Outputs-amp-Filters" class="article-heading"><a href="#Outputs-amp-Filters" class="headerlink" title="Outputs & Filters"></a>Outputs & Filters<a class="article-anchor" href="#Outputs-amp-Filters" aria-hidden="true"></a></h2><p>When filename is specified as literal string, it supports Liquid output and filter syntax. Useful when concatenating strings for a complex filename.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% render "prefix/{{name | append: \".html\"}}" %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">render</span> <span class="token string">"prefix/{{name | append: \"</span><span class="token punctuation">.</span>html\<span class="token string">"}}"</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<blockquote class="note info"><strong class="note-title">Escaping</strong><p>In LiquidJS, <code>"</code> within quoted string literals need to be escaped. Adding a slash before the quote, e.g. <code>\"</code>. Using Jekyll-like filenames can make this easier, see below.</p>
|
||||
</blockquote>
|
||||
|
||||
<h2 id="Jekyll-like-Filenames" class="article-heading"><a href="#Jekyll-like-Filenames" class="headerlink" title="Jekyll-like Filenames"></a>Jekyll-like Filenames<a class="article-anchor" href="#Jekyll-like-Filenames" aria-hidden="true"></a></h2><p>Setting <a href="/api/interfaces/LiquidOptions.html#dynamicPartials">dynamicPartials</a> to <code>false</code> will enable Jekyll-like filenames, file names are specified as literal string. And it also supports Liquid outputs and filters.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% render prefix/{{ page.my_variable }}/suffix %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">render</span> prefix/{{ <span class="token object">page</span><span class="token punctuation">.</span>my_variable }}/suffix <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>This way, you don’t need to escape <code>"</code> in the filename expression.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">{% render prefix/{{name | append: ".html"}} %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">render</span> prefix/{{name <span class="token operator">|</span> <span class="token function filter">append</span><span class="token operator">:</span> <span class="token string">".html"</span>}} <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Parameters" class="article-heading"><a href="#Parameters" class="headerlink" title="Parameters"></a>Parameters<a class="article-anchor" href="#Parameters" aria-hidden="true"></a></h2><h3 id="The-with-Parameter" class="article-heading"><a href="#The-with-Parameter" class="headerlink" title="The with Parameter"></a>The <code>with</code> Parameter<a class="article-anchor" href="#The-with-Parameter" aria-hidden="true"></a></h3><p>A single object can be passed to a snippet by using the <code>with...as</code> syntax:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign featured_product = all_products['product_handle'] %}</span><br><span class="line">{% render 'product' with featured_product as product %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> featured_product <span class="token operator">=</span> all_products<span class="token punctuation">[</span><span class="token string">'product_handle'</span><span class="token punctuation">]</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">render</span> <span class="token string">'product'</span> <span class="token keyword">with</span> featured_product <span class="token keyword">as</span> <span class="token object">product</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>In the example above, the <code>product</code> variable in the partial template will hold the value of <code>featured_product</code> in the parent template.</p>
|
||||
<h3 id="The-for-Parameter" class="article-heading"><a href="#The-for-Parameter" class="headerlink" title="The for Parameter"></a>The <code>for</code> Parameter<a class="article-anchor" href="#The-for-Parameter" aria-hidden="true"></a></h3><p>A partial template can be rendered once for each value of an enumerable by using the <code>for...as</code> syntax:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">{% assign variants = product.variants %}</span><br><span class="line">{% render 'variant' for variants as variant %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> variants <span class="token operator">=</span> <span class="token object">product</span><span class="token punctuation">.</span>variants <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">render</span> <span class="token string">'variant'</span> <span class="token keyword">for</span> variants <span class="token keyword">as</span> <span class="token object">variant</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>In the example above, the partial template will be rendered once for each <code>variant</code> of the <code>product</code>, and the <code>variant</code> variable will hold a product’s variant object within the snippet.</p>
|
||||
<blockquote class="note tip"><strong class="note-title">The forloop object</strong><p>When using the for parameter, the <a href="./for.html#forloop">forloop</a> object is accessible within the snippet.</p>
|
||||
@@ -133,7 +145,7 @@
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="raw.html" class="article-footer-prev" title="sidebar.tags.raw"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="tablerow.html" class="article-footer-next" title="sidebar.tags.tablerow"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+79
-8
@@ -96,30 +96,101 @@
|
||||
|
||||
<p>Generates an HTML table. Must be wrapped in opening <code><table></code> and closing <code></table></code> HTML tags.</p>
|
||||
<h2 id="Basic-Usage" class="article-heading"><a href="#Basic-Usage" class="headerlink" title="Basic Usage"></a>Basic Usage<a class="article-anchor" href="#Basic-Usage" aria-hidden="true"></a></h2><p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><table></span><br><span class="line">{% tablerow product in collection.products %}</span><br><span class="line"> {{ product.title }}</span><br><span class="line">{% endtablerow %}</span><br><span class="line"></table></span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>table</span><span class="token punctuation">></span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">tablerow</span> <span class="token object">product</span> <span class="token keyword">in</span> <span class="token object">collection</span><span class="token punctuation">.</span>products <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endtablerow</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>table</span><span class="token punctuation">></span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br></pre></td><td class="code"><pre><span class="line"><span class="tag"><<span class="name">table</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">tr</span> <span class="attr">class</span>=<span class="string">"row1"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col1"</span>></span></span><br><span class="line"> Cool Shirt</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col2"</span>></span></span><br><span class="line"> Alien Poster</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col3"</span>></span></span><br><span class="line"> Batman Poster</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col4"</span>></span></span><br><span class="line"> Bullseye Shirt</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col5"</span>></span></span><br><span class="line"> Another Classic Vinyl</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col6"</span>></span></span><br><span class="line"> Awesome Jeans</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"></<span class="name">tr</span>></span></span><br><span class="line"><span class="tag"></<span class="name">table</span>></span></span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-markup" data-language="markup"><code class="language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>table</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>tr</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Cool Shirt
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Alien Poster
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Batman Poster
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col4<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Bullseye Shirt
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Another Classic Vinyl
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col6<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Awesome Jeans
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>tr</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>table</span><span class="token punctuation">></span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<h2 id="Parameters" class="article-heading"><a href="#Parameters" class="headerlink" title="Parameters"></a>Parameters<a class="article-anchor" href="#Parameters" aria-hidden="true"></a></h2><h3 id="cols" class="article-heading"><a href="#cols" class="headerlink" title="cols"></a>cols<a class="article-anchor" href="#cols" aria-hidden="true"></a></h3><p>Defines how many columns the tables should have.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% tablerow product in collection.products cols:2 %}</span><br><span class="line"> {{ product.title }}</span><br><span class="line">{% endtablerow %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">tablerow</span> <span class="token object">product</span> <span class="token keyword">in</span> <span class="token object">collection</span><span class="token punctuation">.</span>products cols<span class="token operator">:</span><span class="token number">2</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endtablerow</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight html"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br></pre></td><td class="code"><pre><span class="line"><span class="tag"><<span class="name">table</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">tr</span> <span class="attr">class</span>=<span class="string">"row1"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col1"</span>></span></span><br><span class="line"> Cool Shirt</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col2"</span>></span></span><br><span class="line"> Alien Poster</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"></<span class="name">tr</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">tr</span> <span class="attr">class</span>=<span class="string">"row2"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col1"</span>></span></span><br><span class="line"> Batman Poster</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col2"</span>></span></span><br><span class="line"> Bullseye Shirt</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"></<span class="name">tr</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">tr</span> <span class="attr">class</span>=<span class="string">"row3"</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col1"</span>></span></span><br><span class="line"> Another Classic Vinyl</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"><<span class="name">td</span> <span class="attr">class</span>=<span class="string">"col2"</span>></span></span><br><span class="line"> Awesome Jeans</span><br><span class="line"> <span class="tag"></<span class="name">td</span>></span></span><br><span class="line"> <span class="tag"></<span class="name">tr</span>></span></span><br><span class="line"><span class="tag"></<span class="name">table</span>></span></span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-markup" data-language="markup"><code class="language-markup"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>table</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>tr</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Cool Shirt
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Alien Poster
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>tr</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>tr</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Batman Poster
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Bullseye Shirt
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>tr</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>tr</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Another Classic Vinyl
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col2<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
Awesome Jeans
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>tr</span><span class="token punctuation">></span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>table</span><span class="token punctuation">></span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<h3 id="limit" class="article-heading"><a href="#limit" class="headerlink" title="limit"></a>limit<a class="article-anchor" href="#limit" aria-hidden="true"></a></h3><p>Exits the tablerow after a specific index.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% tablerow product in collection.products cols:2 limit:3 %}</span><br><span class="line"> {{ product.title }}</span><br><span class="line">{% endtablerow %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">tablerow</span> <span class="token object">product</span> <span class="token keyword">in</span> <span class="token object">collection</span><span class="token punctuation">.</span>products cols<span class="token operator">:</span><span class="token number">2</span> <span class="token keyword">limit</span><span class="token operator">:</span><span class="token number">3</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endtablerow</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<h3 id="offset" class="article-heading"><a href="#offset" class="headerlink" title="offset"></a>offset<a class="article-anchor" href="#offset" aria-hidden="true"></a></h3><p>Starts the tablerow after a specific index.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% tablerow product in collection.products cols:2 offset:3 %}</span><br><span class="line"> {{ product.title }}</span><br><span class="line">{% endtablerow %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">tablerow</span> <span class="token object">product</span> <span class="token keyword">in</span> <span class="token object">collection</span><span class="token punctuation">.</span>products cols<span class="token operator">:</span><span class="token number">2</span> <span class="token keyword">offset</span><span class="token operator">:</span><span class="token number">3</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endtablerow</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<h3 id="range" class="article-heading"><a href="#range" class="headerlink" title="range"></a>range<a class="article-anchor" href="#range" aria-hidden="true"></a></h3><p>Defines a range of numbers to loop through. The range can be defined by both literal and variable numbers.</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><span class="line"><!--variable number example--></span><br><span class="line"></span><br><span class="line">{% assign num = 4 %}</span><br><span class="line"><table></span><br><span class="line">{% tablerow i in (1..num) %}</span><br><span class="line"> {{ i }}</span><br><span class="line">{% endtablerow %}</span><br><span class="line"></table></span><br><span class="line"></span><br><span class="line"><!--literal number example--></span><br><span class="line"></span><br><span class="line"><table></span><br><span class="line">{% tablerow i in (3..5) %}</span><br><span class="line"> {{ i }}</span><br><span class="line">{% endtablerow %}</span><br><span class="line"></table></span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token comment"><!--variable number example--></span>
|
||||
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">assign</span> num <span class="token operator">=</span> <span class="token number">4</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>table</span><span class="token punctuation">></span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">tablerow</span> i <span class="token keyword">in</span> <span class="token punctuation">(</span><span class="token number">1</span><span class="token range operator">..</span>num<span class="token punctuation">)</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> i <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endtablerow</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>table</span><span class="token punctuation">></span></span>
|
||||
|
||||
<span class="token comment"><!--literal number example--></span>
|
||||
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>table</span><span class="token punctuation">></span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">tablerow</span> i <span class="token keyword">in</span> <span class="token punctuation">(</span><span class="token number">3</span><span class="token range operator">..</span><span class="token number">5</span><span class="token punctuation">)</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{{</span> i <span class="token delimiter punctuation">}}</span></span>
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endtablerow</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>table</span><span class="token punctuation">></span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="render.html" class="article-footer-prev" title="sidebar.tags.render"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="unless.html" class="article-footer-next" title="sidebar.tags.unless"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+8
-4
@@ -96,17 +96,21 @@
|
||||
|
||||
<p>The opposite of <code>if</code> – executes a block of code only if a certain condition is <strong>not</strong> met.</p>
|
||||
<p>Input</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% unless product.title == "Awesome Shoes" %}</span><br><span class="line"> These shoes are not awesome.</span><br><span class="line">{% endunless %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">unless</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token operator">==</span> <span class="token string">"Awesome Shoes"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
These shoes are not awesome.
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endunless</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Output</p>
|
||||
<figure class="highlight text"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">These shoes are not awesome.</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-text" data-language="text"><code class="language-text">These shoes are not awesome.<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
|
||||
|
||||
<p>This would be the equivalent of doing the following:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">{% if product.title != "Awesome Shoes" %}</span><br><span class="line"> These shoes are not awesome.</span><br><span class="line">{% endif %}</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-liquid" data-language="liquid"><code class="language-liquid"><span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">if</span> <span class="token object">product</span><span class="token punctuation">.</span>title <span class="token operator">!=</span> <span class="token string">"Awesome Shoes"</span> <span class="token delimiter punctuation">%}</span></span>
|
||||
These shoes are not awesome.
|
||||
<span class="token liquid language-liquid"><span class="token delimiter punctuation">{%</span> <span class="token keyword">endif</span> <span class="token delimiter punctuation">%}</span></span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.760Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="tablerow.html" class="article-footer-prev" title="sidebar.tags.tablerow"><i class="icon-chevron-left"></i><span>Prev</span></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -93,10 +93,19 @@
|
||||
</header>
|
||||
<div class="article-content" itemprop="articleBody">
|
||||
<p>As covered in <a href="/tutorials/register-filters-tags.html">Register Filters/Tags</a>, we can access filter arguments directly in filter function like:</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// Usage: {{ 1 | add: 2, 3 }}</span></span><br><span class="line"><span class="comment">// Output: 6</span></span><br><span class="line">engine.<span class="title function_">registerFilter</span>(<span class="string">'add'</span>, <span class="function">(<span class="params">initial, arg1, arg2</span>) =></span> initial + arg1 + arg2)</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token comment">// Usage: {{ 1 | add: 2, 3 }}</span>
|
||||
<span class="token comment">// Output: 6</span>
|
||||
engine<span class="token punctuation">.</span><span class="token function">registerFilter</span><span class="token punctuation">(</span><span class="token string">'add'</span><span class="token punctuation">,</span> <span class="token punctuation">(</span><span class="token parameter">initial<span class="token punctuation">,</span> arg1<span class="token punctuation">,</span> arg2</span><span class="token punctuation">)</span> <span class="token operator">=></span> initial <span class="token operator">+</span> arg1 <span class="token operator">+</span> arg2<span class="token punctuation">)</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>When it comes to stateful filters, for example transform a URL path to full URL, we’ll need to access a <code>origin</code> in current scope:</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="comment">// Usage: {{ '/index.html' | fullURL }}</span></span><br><span class="line"><span class="comment">// Scope: { origin: "https://liquidjs.com" }</span></span><br><span class="line"><span class="comment">// Output: https://liquidjs.com/index.html</span></span><br><span class="line"></span><br><span class="line">engine.<span class="title function_">registerFilter</span>(<span class="string">'fullURL'</span>, <span class="keyword">function</span> (<span class="params">path</span>) {</span><br><span class="line"> <span class="keyword">const</span> origin = <span class="variable language_">this</span>.<span class="property">context</span>.<span class="title function_">get</span>([<span class="string">'origin'</span>])</span><br><span class="line"> <span class="keyword">return</span> <span class="keyword">new</span> <span class="title function_">URL</span>(path, origin).<span class="title function_">toString</span>() </span><br><span class="line">})</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token comment">// Usage: {{ '/index.html' | fullURL }}</span>
|
||||
<span class="token comment">// Scope: { origin: "https://liquidjs.com" }</span>
|
||||
<span class="token comment">// Output: https://liquidjs.com/index.html</span>
|
||||
|
||||
engine<span class="token punctuation">.</span><span class="token function">registerFilter</span><span class="token punctuation">(</span><span class="token string">'fullURL'</span><span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token parameter">path</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
|
||||
<span class="token keyword">const</span> origin <span class="token operator">=</span> <span class="token keyword">this</span><span class="token punctuation">.</span>context<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string">'origin'</span><span class="token punctuation">]</span><span class="token punctuation">)</span>
|
||||
<span class="token keyword">return</span> <span class="token keyword">new</span> <span class="token class-name">URL</span><span class="token punctuation">(</span>path<span class="token punctuation">,</span> origin<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">toString</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">)</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>See this JSFiddle: <a target="_blank" rel="noopener external nofollow noreferrer" href="https://jsfiddle.net/ctj364up/1/">https://jsfiddle.net/ctj364up/1/</a></p>
|
||||
<blockquote class="note warn"><strong class="note-title">Arrow Functions</strong><p><code>this</code> in arrow functions is bound to current JavaScript context, you’ll need to use <code>function(){}</code> instead of <code>()=>{}</code> syntax to access <code>this.context</code> correctly.</p>
|
||||
@@ -105,7 +114,7 @@
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.764Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="register-filters-tags.html" class="article-footer-prev" title="Register Filters/Tags"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="parse-parameters.html" class="article-footer-next" title="Parse Parameters"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
+19
-4
@@ -96,19 +96,34 @@
|
||||
<p>LiquidJS provides multiple ways to cache the parsed templates to improve performance.</p>
|
||||
<h2 id="Programmatically" class="article-heading"><a href="#Programmatically" class="headerlink" title="Programmatically"></a>Programmatically<a class="article-anchor" href="#Programmatically" aria-hidden="true"></a></h2><p>The <a href="/api/classes/Liquid.html#parse">.parse()</a>, <a href="/api/classes/Liquid.html#parseFile">.parseFile()</a>, <a href="/api/classes/Liquid.html#parseFileSync">.parseFileSync()</a> APIs are used to parse templates from string or files. The result template can be then rendered multiple times with different context.</p>
|
||||
<p>Parse from string:</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">var</span> tpl = engine.<span class="title function_">parse</span>(<span class="string">'{{name | capitalize}}'</span>);</span><br><span class="line"></span><br><span class="line">engine.<span class="title function_">renderSync</span>(tpl, {<span class="attr">name</span>: <span class="string">'alice'</span>}) <span class="comment">// 'Alice'</span></span><br><span class="line">engine.<span class="title function_">renderSync</span>(tpl, {<span class="attr">name</span>: <span class="string">'bob'</span>}) <span class="comment">// 'Bob'</span></span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token keyword">var</span> tpl <span class="token operator">=</span> engine<span class="token punctuation">.</span><span class="token function">parse</span><span class="token punctuation">(</span><span class="token string">'{{name | capitalize}}'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
|
||||
engine<span class="token punctuation">.</span><span class="token function">renderSync</span><span class="token punctuation">(</span>tpl<span class="token punctuation">,</span> <span class="token punctuation">{</span><span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'alice'</span><span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token comment">// 'Alice'</span>
|
||||
engine<span class="token punctuation">.</span><span class="token function">renderSync</span><span class="token punctuation">(</span>tpl<span class="token punctuation">,</span> <span class="token punctuation">{</span><span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'bob'</span><span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token comment">// 'Bob'</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>Parse from file:</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">var</span> tpl = engine.<span class="title function_">parseFileSync</span>(<span class="string">'hello'</span>); <span class="comment">// contents of `hello.liquid`: {{name}}</span></span><br><span class="line"></span><br><span class="line">engine.<span class="title function_">renderSync</span>(tpl, {<span class="attr">name</span>: <span class="string">'alice'</span>}) <span class="comment">// 'Alice'</span></span><br><span class="line">engine.<span class="title function_">renderSync</span>(tpl, {<span class="attr">name</span>: <span class="string">'bob'</span>}) <span class="comment">// 'Bob'</span></span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token keyword">var</span> tpl <span class="token operator">=</span> engine<span class="token punctuation">.</span><span class="token function">parseFileSync</span><span class="token punctuation">(</span><span class="token string">'hello'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// contents of `hello.liquid`: {{name}}</span>
|
||||
|
||||
engine<span class="token punctuation">.</span><span class="token function">renderSync</span><span class="token punctuation">(</span>tpl<span class="token punctuation">,</span> <span class="token punctuation">{</span><span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'alice'</span><span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token comment">// 'Alice'</span>
|
||||
engine<span class="token punctuation">.</span><span class="token function">renderSync</span><span class="token punctuation">(</span>tpl<span class="token punctuation">,</span> <span class="token punctuation">{</span><span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'bob'</span><span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token comment">// 'Bob'</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
<p>The template string/file is parsed only once and rendered multiple times using different context. Templates for different files can be stored into a <code>Map</code> and can be retrieved directly for subsequent renders.</p>
|
||||
<h2 id="The-cache-Option" class="article-heading"><a href="#The-cache-Option" class="headerlink" title="The cache Option"></a>The <code>cache</code> Option<a class="article-anchor" href="#The-cache-Option" aria-hidden="true"></a></h2><p>The <a href="/api/interfaces/LiquidOptions.html#cache">cache option</a> can be set to instruct liquidjs to use cached parsed templates each time you call <a href="/api/classes/Liquid.html#renderFile">renderFile</a> or <a href="/api/classes/Liquid.html#renderFileSync">renderFileSync</a>.</p>
|
||||
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">var</span> { <span class="title class_">Liquid</span> } = <span class="built_in">require</span>(<span class="string">'liquidjs'</span>);</span><br><span class="line"><span class="keyword">var</span> engine = <span class="keyword">new</span> <span class="title class_">Liquid</span>({</span><br><span class="line"> <span class="attr">cache</span>: <span class="literal">true</span></span><br><span class="line">});</span><br><span class="line"></span><br><span class="line"><span class="comment">// liquidjs parses the hello.liquid, then renders it with {name: 'alice'}</span></span><br><span class="line">engine.<span class="title function_">renderFileSync</span>(<span class="string">'hello'</span>, {<span class="attr">name</span>: <span class="string">'alice'</span>})</span><br><span class="line"></span><br><span class="line"><span class="comment">// liquidjs finds the cached template, then renders it with {name: 'bob'}</span></span><br><span class="line">engine.<span class="title function_">renderFileSync</span>(<span class="string">'hello'</span>, {<span class="attr">name</span>: <span class="string">'bob'</span>})</span><br></pre></td></tr></table></figure>
|
||||
<pre class="line-numbers language-javascript" data-language="javascript"><code class="language-javascript"><span class="token keyword">var</span> <span class="token punctuation">{</span> Liquid <span class="token punctuation">}</span> <span class="token operator">=</span> <span class="token function">require</span><span class="token punctuation">(</span><span class="token string">'liquidjs'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
<span class="token keyword">var</span> engine <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">Liquid</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
|
||||
<span class="token literal-property property">cache</span><span class="token operator">:</span> <span class="token boolean">true</span>
|
||||
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
|
||||
|
||||
<span class="token comment">// liquidjs parses the hello.liquid, then renders it with {name: 'alice'}</span>
|
||||
engine<span class="token punctuation">.</span><span class="token function">renderFileSync</span><span class="token punctuation">(</span><span class="token string">'hello'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span><span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'alice'</span><span class="token punctuation">}</span><span class="token punctuation">)</span>
|
||||
|
||||
<span class="token comment">// liquidjs finds the cached template, then renders it with {name: 'bob'}</span>
|
||||
engine<span class="token punctuation">.</span><span class="token function">renderFileSync</span><span class="token punctuation">(</span><span class="token string">'hello'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span><span class="token literal-property property">name</span><span class="token operator">:</span> <span class="token string">'bob'</span><span class="token punctuation">}</span><span class="token punctuation">)</span><span aria-hidden="true" class="line-numbers-rows"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span></code></pre>
|
||||
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:36:26.426Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:05.764Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="use-in-expressjs.html" class="article-footer-prev" title="Use in Express.js"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="escaping.html" class="article-footer-next" title="Escaping"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@@ -746,7 +746,7 @@
|
||||
</script></li></ul>
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2024-08-19T19:37:03.734Z" itemprop="dateModified">Last updated: 2024-08-19</time>
|
||||
<time class="article-footer-updated" datetime="2024-08-20T01:26:42.372Z" itemprop="dateModified">Last updated: 2024-08-20</time>
|
||||
<a href="migrate-to-9.html" class="article-footer-prev" title="Migrate to LiquidJS 9"><i class="icon-chevron-left"></i><span>Prev</span></a><a href="differences.html" class="article-footer-next" title="Differences with Shopify/liquid"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user