variables.html

---
layout: default
order: 300
param_1: set_in_page_front_matter
title: Variable Test
---
<!-- #region intro -->
<p>
  Variables can be defined in one of the following ways:
</p>
<ol>
  <li>
    Page front matter.
    Variable assignments made in the front matter of a page are stored in the <code>page</code> and <code>layout</code> hashes,
    along with many other name/value pairs.
  </li>
  <li>
    By <code>assign</code> and <code>capture</code> statements within a page or include.
    Liquid employs a flat namespace for the symbol table.
    Assignments made in an include can overwrite previous assignments made in a calling page.
    The most recent assignment is used throughout.
  </li>
  <li>By passing parameters to includes (includes can recurse).</li>
  <li>By adding name/value pairs to the <code>liquid_context.scopes</code> hash.</li>
</ol>
<p>
  Variable references can be explicit in scope,
  for example <code>include.my_var</code> and <code>page.my_var</code>.
</p>
<p>
  Unqualified variable references are resolved according to the first of the following possible definitions:
</p>
<ol>
  <li>Include parameter of the same name</li>
  <li>
    Assigned value provided by <code>assign</code> and <code>capture</code> statements in a page or an include.
  </li>
</ol>
<p>
  Variable definitions are store in <code>liquid_context.scopes</code>,
  which is a list of hashes.
  It operates as a push-down stack,
  with innermost includes at the front of the list.
  Unqualified variables reside in the last element of the list.
</p>
<p>
  The following demonstrates all of the above.
</p>
<!-- endregion -->


<!-- #region Prior to including anything -->
<h2 id="x1">Prior to including anything</h2>
<pre>Unqualified param_1={{param_1}} # param_1 has not been assigned a value yet
page.param_1='{{page.param_1}}'
layout.default_layout_var='{{layout.default_layout_var}}'</pre>
{% assign param_1 = 'Set by assignment in variables.html' %}
<pre>Unqualified param_1='{{param_1}}'' # param_1 now has a value
page.param_1='{{page.param_1}}'
layout.default_layout_var='{{layout.default_layout_var}}'</pre>
<!-- endregion -->

<!-- #region After include_test_plugin -->
<h2 id="x2">After include_test_plugin</h2>
<pre>{% include_test_plugin %}</pre>
<pre>Unqualified param_1='{{param_1}}'
page.param_1='{{page.param_1}}'
layout.default_layout_var='{{layout.default_layout_var}}'</pre>
<!-- endregion -->


<!-- #region Include without passing parameters -->
<h2 id="x3">Include without passing parameters</h2>
<pre>{% include a.html %}
Back in include_test.html.
Unqualified param_1='{{param_1}}'
page.param_1='{{page.param_1}}'
layout.default_layout_var='{{layout.default_layout_var}}'</pre>
<!-- endregion -->


<!-- #region Include that passes param_1 as a parameter -->
<h2>Include that passes param_1 as a parameter</h2>
<p>
  Passing <code>param_1</code> as a parameter adds a definition for
  <code>param_1</code> to an <code>include</code> scope.
  Each nested <code>include</code> has its own scope, as we are about to discover.
</p>
<pre>{% include a.html param_1="param_1_overridden_as_parameter_to_include" %}</pre>

<p>Back in <code>include_test.html</code>, <code>param_1='{{param_1}}'</code>.</p>
<pre>{% include b.html %}</pre>

<p>
  After the includes, overridden variables have been redefined in the calling page.
</p>

<pre>{% include_test_plugin %}</pre>
<!-- endregion -->