Liquid - Amay22/Siteleaf_Nadaleen GitHub Wiki
If you don’t know what it is then it is just like ruby or jsp in a webpage. Wherever the script-let is found that is the programming module of the code i.e. the part of the file which is replaced by the value generated by the program. Here is the basic construct of it Liquid.
There are two types of markup in Liquid: Output and Tag.
- Output markup (which may resolve to text) is surrounded by {{ matched pairs of curly brackets (ie, braces) }}
These type of tags are used for mostly metadata and variables so that we can upload one theme and have a uniform layout all throughout the script.
e.g.
{{ body }}
In this tag the value for the body which is the post is replaced here. The Body value is the data we put in on the development website.

- Tag markup (which cannot resolve to text) is surrounded by {% matched pairs of curly brackets and percent signs %}
e.g. as this doesn’t resolve to text we use it mostly for replacements.
{% include 'includes/footer' %}
This code will replace the code with footer.html file in the _includes folder. Here is basic example of how the default.html file looks.
{% include 'includes/header' %}
<div id="content" class="clearfix">
<aside>
<h2 class="hero">{{meta['aside']}}</h2>
</aside>
<main>
{{ body }}
</main> </div>
{% include 'includes/footer' %}
The default.html is the basic layout for all the webpages and is the single most important file that needs to be present in the local directory to be present.
<html>
<head>
<title>{{site.title}} | {{title}}</title>
</head>
<body>
<h1>{{title}}</h1>
<article>{{body}}</article>
{% if parent %}
<p><a href="{{parent.url}}">← Go back</a></p>
{% endif %}
</body>
</html>
site contains global variables available to all pages.
Variable Description site.title The title of your website. site.domain Your website’s domain name site.permalink Your website’s full address site.pages A nested array of pages. site.posts Array of all posts in all pages. site.feed_url URL to your website’s RSS feed
{{title}} is the title of the page.
And there are a lot of them. To get the full list view: http://www.siteleaf.com/help/themes/variables/
To get the size or number items in a variables like pages or assets or etc. the following code is used:
{{assets | size}}
{{pages | size}}