mirror of
https://github.com/harttle/liquidjs.git
synced 2026-09-16 21:00:40 -07:00
Deploying to gh-pages from @ harttle/liquidjs@70fdb7af48 🚀
This commit is contained in:
harttle
@@ -36,8 +36,8 @@
|
||||
|
||||
<link rel="stylesheet" href="../css/navy.css">
|
||||
|
||||
<link rel="alternate" href="../atom.xml" title="LiquidJS">
|
||||
</head>
|
||||
<link rel="alternate" href="../atom.xml" title="LiquidJS" type="application/atom+xml">
|
||||
<meta name="generator" content="Hexo 5.4.0"></head>
|
||||
|
||||
<body>
|
||||
<div id="container">
|
||||
@@ -63,7 +63,7 @@
|
||||
|
||||
</select>
|
||||
</div>
|
||||
<a href="https://github.com/harttle/liquidjs" target="_blank" rel="noopener external nofollow noreferrer" id="github-link-wrap" class="main-nav-link"><i class="icon-github"></i>Github</a>
|
||||
<a target="_blank" rel="noopener external nofollow noreferrer" href="https://github.com/harttle/liquidjs" id="github-link-wrap" class="main-nav-link"><i class="icon-github"></i>Github</a>
|
||||
<a id="mobile-nav-toggle">
|
||||
<span class="mobile-nav-toggle-bar"></span>
|
||||
<span class="mobile-nav-toggle-bar"></span>
|
||||
@@ -87,24 +87,24 @@
|
||||
<header class="article-header">
|
||||
<h1 class="article-title" itemprop="name">Whitespace Control</h1>
|
||||
|
||||
<a href="https://github.com/harttle/liquidjs/edit/master/docs/source/tutorials/whitespace-control.md" target="_blank" rel="noopener external nofollow noreferrer" class="article-edit-link" title="Improve this doc"><i class="icon-pencil"></i></a>
|
||||
<a target="_blank" rel="noopener external nofollow noreferrer" href="https://github.com/harttle/liquidjs/edit/master/docs/source/tutorials/whitespace-control.md" class="article-edit-link" title="Improve this doc"><i class="icon-pencil"></i></a>
|
||||
|
||||
</header>
|
||||
<div class="article-content" itemprop="articleBody">
|
||||
<p>To keep source code neat and indented, we’re adding spaces to our templates. LiquidJS offers whitespace control capabilities to eliminate these unwanted whitespaces in output HTML.</p>
|
||||
<h2 id="via-Markups" class="article-heading"><a href="#via-Markups" class="headerlink" title="via Markups"></a>via Markups<a class="article-anchor" href="#via-Markups" aria-hidden="true"></a></h2><p>By default, all tags and output markups lines will generate a NL (<code>\n</code>), and whitespaces if there’s any indentation. For example:</p>
|
||||
<figure class="highlight plain"><table><tr><td class="code"><pre><span class="line">{% author = "harttle" %}</span><br><span class="line">{{ author }}</span><br></pre></td></tr></table></figure>
|
||||
<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">{% author = "harttle" %}</span><br><span class="line">{{ author }}</span><br></pre></td></tr></table></figure>
|
||||
|
||||
<p>Outputs (note the blank link):</p>
|
||||
<figure class="highlight plain"><table><tr><td class="code"><pre><span class="line"></span><br><span class="line">harttle</span><br></pre></td></tr></table></figure>
|
||||
<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line"></span><br><span class="line">harttle</span><br></pre></td></tr></table></figure>
|
||||
|
||||
<p>We can include hyphens in your tag syntax (<code>{{-</code>, <code>-}}</code>, <code>{%-</code>, <code>-%}</code>) to strip whitespace from left or right. For example:</p>
|
||||
<figure class="highlight plain"><table><tr><td class="code"><pre><span class="line">{% assign author = "harttle" -%}</span><br><span class="line">{{ author }}</span><br></pre></td></tr></table></figure>
|
||||
<p>We can include hyphens in your tag syntax (<code>{{-`, `-}}`, `{%-</code>, <code>-%}</code>) to strip whitespace from left or right. For example:</p>
|
||||
<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">{% assign author = "harttle" -%}</span><br><span class="line">{{ author }}</span><br></pre></td></tr></table></figure>
|
||||
|
||||
<p>Outputs:</p>
|
||||
<figure class="highlight plain"><table><tr><td class="code"><pre><span class="line">harttle</span><br></pre></td></tr></table></figure>
|
||||
<figure class="highlight plaintext"><table><tr><td class="code"><pre><span class="line">harttle</span><br></pre></td></tr></table></figure>
|
||||
|
||||
<p>In this case, the <code>-%}</code> strips the whitespace from the right side of the <code>assign</code> tag.</p>
|
||||
<p>In this case, the <code>-%}</code> strips the whitespace from the right side of the <code>assign</code> tag.</p>
|
||||
<h2 id="via-Options" class="article-heading"><a href="#via-Options" class="headerlink" title="via Options"></a>via Options<a class="article-anchor" href="#via-Options" aria-hidden="true"></a></h2><p>Alternatively, LiquidJS provides these per engine options to enable whitespace control without sweeping changes of your templates:</p>
|
||||
<ul>
|
||||
<li><code>trimTagLeft</code></li>
|
||||
@@ -112,12 +112,12 @@
|
||||
<li><code>trimValueRight</code></li>
|
||||
<li><code>trimValueRight</code></li>
|
||||
</ul>
|
||||
<p><a href="https://github.com/harttle/liquidjs" target="_blank" rel="noopener external nofollow noreferrer">LiquidJS</a> will <strong>NOT</strong> trim any whitespace by default, aka. above options all default to <code>false</code>. For details of these options, see the <a href="../api/interfaces/liquid_options_.liquidoptions.html">options</a>.</p>
|
||||
<h2 id="Greedy-Mode" class="article-heading"><a href="#Greedy-Mode" class="headerlink" title="Greedy Mode"></a>Greedy Mode<a class="article-anchor" href="#Greedy-Mode" aria-hidden="true"></a></h2><p>In greedy mode (enabled by the <a href="../api/interfaces/liquid_options_.liquidoptions.html#Optional-greedy">greedy option</a>), all consecutive whitespace chars (including <code>\n</code>) will be trimmed. Greedy mode is enabled by default to be compliant with <a href="https://github.com/Shopify/liquid" target="_blank" rel="noopener external nofollow noreferrer">shopify/liquid</a>.</p>
|
||||
<p><a target="_blank" rel="noopener external nofollow noreferrer" href="https://github.com/harttle/liquidjs">LiquidJS</a> will <strong>NOT</strong> trim any whitespace by default, aka. above options all default to <code>false</code>. For details of these options, see the <a href="../api/interfaces/liquid_options_.liquidoptions.html">options</a>.</p>
|
||||
<h2 id="Greedy-Mode" class="article-heading"><a href="#Greedy-Mode" class="headerlink" title="Greedy Mode"></a>Greedy Mode<a class="article-anchor" href="#Greedy-Mode" aria-hidden="true"></a></h2><p>In greedy mode (enabled by the <a href="../api/interfaces/liquid_options_.liquidoptions.html#Optional-greedy">greedy option</a>), all consecutive whitespace chars (including <code>\n</code>) will be trimmed. Greedy mode is enabled by default to be compliant with <a target="_blank" rel="noopener external nofollow noreferrer" href="https://github.com/Shopify/liquid">shopify/liquid</a>.</p>
|
||||
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
<time class="article-footer-updated" datetime="2021-09-26T12:45:03.359Z" itemprop="dateModified">Last updated: 2021-09-26</time>
|
||||
<time class="article-footer-updated" datetime="2021-09-30T16:54:19.718Z" itemprop="dateModified">Last updated: 2021-09-30</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="plugins.html" class="article-footer-next" title="Plugins"><span>Next</span><i class="icon-chevron-right"></i></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user