title: Liquid not rendering on seperate pages
body: <p>I've recently been having this problem where includes on separate pages that are not loading correctly.</p>
  <p>This is my <code>downloads.html</code>:</p>
  <pre class="lang-html prettyprint-override"><code>---
  layout: default
  ---
  
  {% if site.downloads %}
      &lt;div class=&quot;my-6&quot;&gt;{% include downloads.html %}&lt;/div&gt;
  {% else %}
      &lt;h2&gt;Downloads&lt;/h2&gt;
      &lt;p&gt;There are no downloads at the time. Come back later!&lt;/p&gt;
  {% endif %}
  </code></pre>
  <p>But what all that shows are:
  <img src="https://i.imgur.com/w4ttk05.png" alt="Screenshot" /></p>
  <p>Here is my <code>_layouts/default.html</code>:</p>
  <pre class="lang-html prettyprint-override"><code>{% include header.html %}
  
  {% if site.layout == 'stacked' %}
    &lt;div class=&quot;container-lg py-6 p-responsive text-center&quot;&gt;
      {% include masthead.html metadata=false %}
  
      &lt;div class=&quot;container-md f4 text-left border rounded-2 bg-white p-3 p-sm-5 mt-6&quot;&gt;
        &lt;p class=&quot;f5&quot;&gt;&lt;a href=&quot;/&quot; class=&quot;d-flex flex-items-center&quot;&gt;{% octicon chevron-left height:16 class:&quot;mr-2 v-align-middle&quot; fill:#0366d6 aria-label:Home %}Home&lt;/a&gt;&lt;/p&gt;
        &lt;h1 class=&quot;f00-light lh-condensed mb-5&quot;&gt;{{ page.title }}&lt;/h1&gt;
        {{ content }}
      &lt;/div&gt;
    &lt;/div&gt;
  {% else %}
    &lt;div class=&quot;d-md-flex min-height-full {% unless site.style == 'dark' %}border-md-bottom{% endunless %}&quot;&gt;
      &lt;div class=&quot;flex-self-stretch {% if site.style == 'dark' %}bg-gray-dark{% else %}border-md-right border-gray-light bg-white{% endif %} col-md-5 col-lg-4 col-xl-3 px-4 px-md-6 px-lg-7 py-6&quot;&gt;
        {% include masthead.html metadata=true %}
      &lt;/div&gt;
  
      &lt;div class=&quot;col-md-7 col-lg-8 col-xl-9 px-4 py-6 px-lg-7 border-top border-md-top-0 bg-gray-light&quot; {% if site.style == 'dark' %}style=&quot;background-color: #2f363d !important&quot;{% endif %}&gt;
        &lt;div class=&quot;mx-auto&quot; style=&quot;max-width: 900px;&quot;&gt;
          &lt;div class=&quot;f4 {% if site.style == 'dark' %}text-white{% endif %} mb-6&quot;&gt;
            &lt;div class=&quot;f4 {% if site.style == 'dark' %}text-white{% endif %}&quot;&gt;
              &lt;p class=&quot;f5&quot;&gt;&lt;a href=&quot;{{ site.url }}{{ site.baseurl | append:'/' }}&quot; class=&quot;d-flex flex-items-center {% if site.style == 'dark' %}text-white{% endif %}&quot;&gt;{% octicon chevron-left height:16 class:&quot;mr-2 v-align-middle&quot; fill:{{ icon_color }} aria-label:Home %}Home&lt;/a&gt;&lt;/p&gt;
              &lt;h1 class=&quot;f00-light lh-condensed mb-5&quot;&gt;{{ page.title }}&lt;/h1&gt;
              {{ content }}
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  {% endif %}
  
  {% include footer.html %}
  </code></pre>
  <p>Here is my <code>_includes/downloads.html</code>:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;h2 {% if site.style == 'dark' %}class=&quot;text-white&quot;{% endif %}&gt;Downloads&lt;/h2&gt;
  &lt;p class=&quot;f4 mb-4 {% if site.style == 'dark' %}text-white{% else %}text-gray{% endif %}&quot;&gt;Most of my downloads/others on GitHub.&lt;/p&gt;
  &lt;div class=&quot;d-flex flex-wrap gutter-condensed mb-4&quot;&gt;
    {% for download in site.downloads %}
      &lt;div class=&quot;col-6 col-md-12 col-lg-6 col-xl-4 mb-3&quot;&gt;
        {% include download-card.html %}
      &lt;/div&gt;
    {% endfor %}
  &lt;/div&gt;
  </code></pre>
  <p>Here is my <code>_includes/download-card.html</code>:</p>
  <pre class="lang-html prettyprint-override"><code>{% if download.download_url %}
    &lt;a href=&quot;{{ download.download_url }}&quot; class=&quot;github-component position-relative hover-grow height-full no-underline d-flex flex-column flex-justify-center text-center border border-gray-light rounded-1 bg-white p-5&quot;&gt;
      {% if download.image_url %}
        &lt;img src=&quot;{{ download.image_url }}&quot; width=&quot;64&quot; height=&quot;64&quot; class=&quot;mx-auto rounded-1 mb-3&quot; alt=&quot;{{ download.name }}&quot;&gt;
      {% else %}
        &lt;div
          class=&quot;bg-blue-light f4 text-gray-light text-bold rounded-1 flex-shrink-0 text-center mx-auto mb-3&quot;
          style=&quot;width:64px; height:64px; line-height:64px;&quot;
        &gt;
          #
        &lt;/div&gt;
      {% endif %}
      &lt;p class=&quot;f3 lh-condensed text-center link-gray-dark mb-0 mt-1&quot;&gt;{{ download.name }}&lt;/p&gt;
      {% if download.description %}
        &lt;p class=&quot;f5 text-gray text-center mb-0 mt-1&quot;&gt;{{ download.description }}&lt;/p&gt;
      {% endif %}
    &lt;/a&gt;
  {% endif %}
  </code></pre>
  <p>And here is my <code>_config.yml</code>:</p>
  <pre class="lang-yaml prettyprint-override"><code>layout: sidebar
  style: dark
  
  plugins:
      - jekyll-octicons
      - jekyll-github-metadata
      - jemoji
  
  permalink: /:year/:month/:day/:title/
  
  defaults:
      - scope:
            path: &quot;&quot;
            type: &quot;posts&quot;
        values:
            layout: &quot;post&quot;
  
  downloads:
      - name: Test
        description: This is just a test item
        image_url: https://raw.githubusercontent.com/github/explore/6c6508f34230f0ac0d49e847a326429eefbfc030/topics/css/css.png
        download_url: https://example.com
  </code></pre>
  <p>It renders perfectly fine on my <code>home</code> layout:</p>
  <pre class="lang-html prettyprint-override"><code>{% include header.html %}
  
  {% if site.layout == 'stacked' %}
    &lt;div class=&quot;container-lg py-6 p-responsive text-center&quot;&gt;
      {% include masthead.html metadata=true %}
  
      &lt;div {% if site.style == 'dark' %}class=&quot;text-white&quot;{% endif %}&gt;
        {{ content }}
      &lt;/div&gt;
  
      {% if site.topics %}
        &lt;div class=&quot;my-6&quot;&gt;
          {% include interests.html %}
        &lt;/div&gt;
      {% endif %}
  
      {% unless posts_total == 0 %}
        &lt;div class=&quot;my-6&quot;&gt;
          {% include thoughts.html %}
        &lt;/div&gt;
      {% endunless %}
    &lt;/div&gt;
  {% else %}
    &lt;div class=&quot;d-md-flex min-height-full {% unless site.style == 'dark' %}border-md-bottom{% endunless %}&quot;&gt;
      &lt;div class=&quot;flex-self-stretch {% if site.style == 'dark' %}bg-gray-dark{% else %}border-md-right border-gray-light bg-white{% endif %} col-md-5 col-lg-4 col-xl-3 px-4 px-md-6 px-lg-7 py-6&quot;&gt;
        {% include masthead.html metadata=true %}
      &lt;/div&gt;
  
      &lt;div class=&quot;col-md-7 col-lg-8 col-xl-9 px-4 py-6 px-lg-7 border-top border-md-top-0 bg-gray-light&quot; {% if site.style == 'dark' %}style=&quot;background-color: #2f363d !important&quot;{% endif %}&gt;
        &lt;div class=&quot;mx-auto&quot; style=&quot;max-width: 900px;&quot;&gt;
          {% unless content == &quot;&quot;  %}
            &lt;div class=&quot;f4 {% if site.style == 'dark' %}text-white{% endif %} mb-6&quot;&gt;
              {{ content }}
            &lt;/div&gt;
          {% endunless %}
  
          {% if site.topics %}
            {% include interests.html %}
          {% endif %}
  
          {% unless posts_total == 0 %}
            {% include thoughts.html %}
          {% endunless %}
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  {% endif %}
  
  {% include footer.html %}
  </code></pre>
  <p>Thanks if you can help. I really don't know why this is happening.</p>