Jekyll / liquid for loop being mysterious - loops

I am trying to use the for loop in Jekyll to render sample data. I can reference the markdown objects or whatever they are called directly, but when I use a for loop it doesn’t work. Here’s an example of the problem I am having:
markdown file with data:
tests:
test1:
number: 1 .
test2:
number: 2 .
test3:
number: 3 .
sessions.html:
<p>{{ page.tests.test1.number }}</p>
<p>{{ page.tests.test2.number }}</p>
<p>{{ page.tests.test3.number }}</p>
This outputs to:
<p>1</p>
<p>2</p>
<p>3</p>
If I do this instead:
{% for test in page.tests %}
<p>{{ test.number }}</p>
{% endfor %}
I get:
<p></p>
<p></p>
<p></p>
I can even do this:
{% for test in page.tests %}
<p>{{ test }}</p>
{% endfor %}
And get:
<p>test1{"number"=>1}</p>
<p>test2{"number"=>2}</p>
<p>test3{"number"=>3}</p>
Any idea what I am doing wrong?

Take a look at this:
{% for test in page.tests %}
<p>{{ test.number }}</p>
{% endfor %}
You are iterating over page.tests. Since page.tests is a hash and not a list, you are iterating over the key-value pairs of that object. (See this topic).
The keys are test1, test2 and test3, you can access them with test[0].
But you need the value, in this case you can use test[1], and to get the number, you can call test[1].number:
{% for test in page.tests %}
<p>{{ test[1].number }}</p>
{% endfor %}
And you will get the same output as in your first example.
Or, instead of test1, test2 and test3, you may try to define a list:
tests:
- number: 1
- number: 2
- number: 3
This way, your code will work too:
{% for test in page.tests %}
<p>{{ test.number }}</p>
{% endfor %}

Related

syntax in wagtail HTML template file

In below HTML template of Wagtail,
<h1>{{ page.title }}</h1>
<div>{{ page.intro }}</div>
{% for post in page.get_children %}
<h2>{{ post.title }}</h2>
<p>{{ post.first_published_at }}</p>
<p>{{ post.owner }}</p>
{% if post.specific.rncategory.all.count %}
{% for ctgy in post.specific.rncategory.all %}
{{ctgy.category.name}}
{% endfor %}
{% endif %}
{% for tg in post.specific.rntags.all %}
<button type="button">{{tg.tag.name}}</button>
{% endfor %}
{% endfor %}
Q1: Why we use page.get_children & post.specific.rncategory.all.count instead of page.get_children() and post.specific.rncategory.all().count() which are expected to be corrected ?
And It is the other way around (page.get_children is invalid) in the PDB debug interaction session.
(Pdb++) obj.get_children()[0]
<Page: Detail>
(Pdb++) obj.get_children()[0].specific.rncategory.all.count
*** AttributeError: 'function' object has no attribute 'count'
(Pdb++) obj.get_children()[0].specific.rncategory.all
<bound method BaseManager.all of <modelcluster.fields.create_deferring_foreign_related_manager.<locals>.DeferringRelatedManager object at 0x7f7076003790>>
(Pdb++) obj.get_children()[0].specific.rncategory.all()
<QuerySet []>
(Pdb++) obj.get_children()[1].specific.rncategory.all()
<QuerySet [<Link_PostDetail_Category: Link_PostDetail_Category object (2)>]>
(Pdb++) obj.get_children()[1].specific.rncategory.all().count()
1
(Pdb++) obj.get_children()[0].specific.rncategory.all().count()
0
(Pdb++)
This is the normal behaviour of the Django template language - by design, Django template code is not equivalent to Python.
Django template syntax never uses () for function calls. Instead, whenever a variable lookup results in a callable, it will automatically be called with no arguments. See "Behind the scenes" under https://docs.djangoproject.com/en/stable/ref/templates/language/#variables.

Dynamically populate a forloop array in Shopify liquid framework

I'm trying to create my own array in Shopify so that I can easily populate a slick slider. I've tried creating a numeric array and then using that to call the variables, but it doesn't seem to be working. I just keep getting "unexpected character" etc.
{% assign number_group = "1, 2, 3, 4, 5" | split: ','%}
{%- assign block_1_link = "/collections/col-1" %}
{%- assign block_1_title = "Title 1" %}
{%- assign block_1_img = "imglink" %}
{%- assign block_2_link = "/collections/col-2" %}
{%- assign block_2_title = "Title 2" %}
{%- assign block_2_img = "imglink" %}
<div class="slick-slider-row">
<div class="wrapper">
<h2>MyCompants<h2>
{% for NUMBER in number_group %}
{%- assign this_link = "block_"{{NUMBER}}"_link" %}
{%- assign this_image = "block_"{{NUMBER}}"_img" %}
{%- assign this_title = "block_"{{NUMBER}}"_title" %}
<div class="responsive carousel slider-mobile-hide">
<div class="slick-slide">
<a href="{{this_link}}">
<img class="lazyload" alt="{{ this_title}}" src="{{
this_image}}">
</a>
<p><a class="slider-collection-name-link" href="
{{this_link}}">{{this_title}}</a></p>
</div>
{% endfor %}
I assume that you are new in the liquid language, so I will describe it as clearly as possible.
For loops
There are two types of FOR loops in liquid.
1) The standard one where you list all items of an array:
{% for product in collection.products %}
Where collection.products is an array of products.
2) The manual array which you are trying to build
{% for i in (1..5) %}
Where 1 is the starting index and 5 is the ending.
Liquid syntax
There are two types of liquid syntax.
{{ }}
and
{% %}
The {{ }} is used for output of content and {% %} is used for liquid logic (if/assign/capture/for etc...)
Mistakes in your code
{%- assign this_link = "block_"{{NUMBER}}"_link" %}
This is an invalid syntax. You can't have liquid inside of liquid. If you want to do it like that, the proper way will be:
{%- assign this_link = "block_" | append: NUMBER | append: "_link" %}
or
{% capture this_link %}block_{{NUMBER}}_link{% endcapture %}
In addition this {{this_link}} will output the string "block_1_link" and not the variable block_1_link.
In order to output the variable you will need to wrap it in square brackets like so {{[this_link]}} since you are assign a string to it.
I assume you are learning but this syntax will probably never come in a real project, because you shouldn't have static variables
How should your code look
{%- assign block_1_link = "/collections/col-1" %}
{%- assign block_1_title = "Title 1" %}
{%- assign block_1_img = "imglink" %}
{%- assign block_2_link = "/collections/col-2" %}
{%- assign block_2_title = "Title 2" %}
{%- assign block_2_img = "imglink" %}
<div class="slick-slider-row">
<div class="wrapper">
<h2>MyCompants<h2>
{% for NUMBER in (1..5) %}
{%- assign this_link = "block_" | append: NUMBER | append: "_link" %}
{%- assign this_image = "block_" | append: NUMBER | append: "_img" %}
{%- assign this_title = "block_" | append: NUMBER | append: "_title" %}
<div class="responsive carousel slider-mobile-hide">
<div class="slick-slide">
<a href="{{[this_link]}}">
<img class="lazyload" alt="{{ [this_title] }}" src="{{ [this_image] }}">
</a>
<p><a class="slider-collection-name-link" href="
{{[this_link]}}">{{[this_title]}}</a></p>
</div>
{% endfor %}

How do i array a collection in 3 cols in liquid by a status

I wanna array my collection in 3 cols, for 3 different statuses. And if there isn't any gig/item with that status, it has to say ' No projects'
I have tried this:
<div class="col-sm">
<h2>Up next</h2>
{% assign next = site.gigs | gig.status == 'Next' | sort: gig.date %}
{% if next.gigs.size == 0 %}
No projects
{% else %}
{% for gig in next %}
{{ gig.title }}
{% endfor %}
{% endif %}
</div>
<div class="col-sm">
<h2>Working on</h2>
{% assign on = site.gigs | gig.status == 'On' | sort: gig.date %}
{% if on.gigs.size == 0 %}
No projects
{% else %}
{% for gig in on %}
{{ gig.title }}
{% endfor %}
{% endif %}
</div>
<div class="col-sm">
<h2>Done</h2>
{% assign done = site.gigs | gig.status == 'Done' | sort: gig.date %}
{% if done.gigs.size == 0 %}
No projects
{% else %}
{% for gig in done %}
{{ gig.title }}
{% endfor %}
{% endif %}
</div>
But it just arrays all of the gigs/items :(
Maybe it can be done in a way more simple way.
I don't know if you could make one compact liquid code and array 3 columns by counting the number of different statuses.
Help!
Ordering
Our statuses are "Next", "On" and "Done". They must be ordered in such order.
As this is not an alphabetical sort order, we need to define this order by ourself.
In _config.yml :
status-order:
-
name: "Next" ### status as it is set on gigs (!!! Case-Sensitive !!!)
display: "Up Next" ### status column header to display
-
name: "On"
display: "Working On"
-
name: "Done"
display: "Done"
We can now loop over site.status-order and get our gigs in desired status order.
{% for status in site.status-order %}
{{ status.name }} - {{ status.display }}
{% endfor %}
Presenting
As your current code is a little repetitive, we can factor it like this :
{% for status in site.status-order %}
{% assign items = site.gigs | where: 'status', status.name | sort: date %}
<div class="col-sm">
<h2>{{ status.display }} ({{ items.size }})</h2>
{% if items.size > 0 %}
<ul>
{% for item in items %}
<li>{{ item.title }}</li>
{% endfor %}
</ul>
{% else %}
No project
{% endif %}
</div>
{% endfor %}
Note
You must be sure to set status with the right case (eg : "Next" an not "next").
And the right type. If you set status: On it is understood as the true boolean value, not the string "on". In this case the correct status expression is status: "On". It must be quoted or double quoted to be understood as "On" string.
Any item with incorrectly cased or typed status expression will not appear in our listing.

How to specify multiple authors for a single post, then count the posts each author is related to?

What I'm trying to do:
I'm trying to create a list for the posts each author has written. This is a problem since each post should be able to specify multiple authors.
Let's say we have 3 posts in total and 3 authors in total.
Edit 1: as suggested in the answers this is best done by listing the authors in a front matter list instead of a CSV string. So,
Like this
Post:
---
title: post
authors:
- foo
- bar
---
instead of like this:
Post:
---
title: post
authors: [foo, bar]
---
Problem setup:
(edited, according to Edit 1)
Post 1:
---
title: post1
authors:
- foo
- bar
---
Post 2:
---
title: post2
authors:
- foo
- bar
---
Post 3:
---
title: post3
authors:
- john doe
- bar
---
Out:
bar (3)
john doe (1)
foo (2)
A click on the author should then result in all posts getting displayed.
Alternatively an array can be displayed like this, but it's not helping the case, just an equivalent style.
What I tried
I did the same with categories and tags and this algorithm worked like a charm. However, replacing site.categories with site.authors is somehow not supported.
returns:
Liquid Exception: 0 is not a symbol nor a string in authors.html
I suppose this is due to the nature of categories and tags being arrays by default.
I think it would help to be able to set the front matter tag authors as an array somehow. I suppose this is done in _config.yml, but I busted by head in with it.
As of now I got as far as coming up with a way to target individual authors in an array, but I'm far from being able to list them individually and counting them up. I suppose I'm limited due to the nature of authors not being an array by default, otherwise implementations like this one would work with custom front matter variables like authors, but they don't.
What I meant (when I said "As of now"):
{% for post in site.posts %}
<li>{{ post.authors }} ({{ post.authors[0] }})</li>
{% endfor %}
Out:
foobar (foo)
foobar (foo)
john doebar (john doe)
Afterall, I think I'm missing something here. I'm probably not the first one who tried this but the only documentation I found was from people who attempted what I'm trying but didn't really get there.
This user for example created a way to count users, but when used with site.authors
it returns the array size == 0-if clause:
No author
It seems like a simple thing, but for some reason isn't. At least for me.
Edit 2:
based on Kieths answer I came closer to getting there, but I have issues with creating an emphty array. According to this issue in Jekyll this seems to be a problem in general. However a workaround seems to be to assign a variable and split it with an emphty tag.
Currently I struggle with adding authors to the array so I can assess it's size.
{% assign authors = site.posts | map: 'authors' | uniq %}
{% assign authorCount = '' | split: '' %}
<div class="softwaretitle">
{% for author in authors %}
<a>{{ author }}</a>
{% for post in site.posts %}
{% for post_author in post.authors %}
{% if post_author == author %}
{% assign authorCount = authorCount | push author %}
<a>({{ page.authorCount | size }})</a>
{% endif %}
{% endfor %Edit 2:}
{% endfor %}
{% endfor %}
</div>
Out:
Error: Liquid error (.../_includes/authors.html line 14): wrong number of arguments (given 1, expected 2) included
Error: Run jekyll build --trace for more information.
Line 14:
{% assign authorCount = authorCount | push author %}
Edit 3:
At last, the final result (without link to the post list, but thats details)
<!-- Get a list of unique authors -->
{% assign authors = site.posts | map: 'authors' | uniq | sort%}
{% assign author_post_count = 0 %}
{% for author in authors %}
{% assign author_post_count = 0 %}
<div class="">
<li><a>{{ author }}
{% for post in site.posts %}
{% for post_author in post.authors %}
{% if post_author == author %}
{% assign author_post_count = author_post_count | | plus: 1 %}
{% endif %}
{% endfor %}
{% endfor %}
<span>&nbsp ({{ author_post_count }})</span></a></li>
</div>
{% endfor %}
Out:
bar (3)
john doe (1)
foo (2)
Updated answer:
To get a list of authors (without duplicates) and including the total number of posts the author has contributed to, together with a list of posts' titles and a link to the posts.
{% assign authors = site.posts | map: 'authors' | uniq %}
{% for author in authors %}
{% assign author_post_count = 0 %}
{% for post in site.posts %}
{% if post.authors %}
{% for post_author in post.authors %}
{% if post_author == author %}
{% assign author_post_count = author_post_count | plus: 1 %}
{% endif %}
{% endfor %}
{% endif %}
{% endfor %}
<h2>{{ author }} - {{ author_post_count }}</h2>
{% for post in site.posts %}
{% if post.authors %}
{% for post_author in post.authors %}
{% if post_author == author %}
{% assign author_url_query = author | replace: ' ', '-' %}
<a href="{{ post.url }}" title="A posts {{ author }}">
{{ post.title }}
</a>
{% endif %}
{% endfor %}
{% endif %}
{% endfor %}
{% endfor %}
If instead, you want to have a page per author that includes a list of posts written by them (automatically generated), you will need to extend Jekyll through a custom plugin. This is very possible if you have experience with the Ruby programming language. This is a very close example: https://github.com/avillafiorita/jekyll-datapage_gen and you can simply remove the _config data requirements and hardcode the directory names and permalinks :)
Problem :
on a post : print author(s) + number of posts written and link to the authors page
on an author's page : print author's datas + list written posts
Solution
We already have posts that are described like this :
---
title: post2
authors: [foo, bar]
# or with the alternate YAML array syntax
authors:
- foo
- bar
---
For authors, we can user a specific collection that will automatically generate author's page.
In _config.yml :
collections:
authors:
output: true
defaults:
- scope:
type: authors
values:
layout: authors
An author's page can be described like this :
_authors/foo.md
---
uid : foo
firstname: John
lastname: Foo
---
Some bio here ...
Posts List (index or any page):
{% assign posts = site.posts %}
{% comment %}
or {% assign posts = paginator.posts %} if you use pagination
{% endcomment %}
<ul>
{% for post in posts %}
<li>
{{ p.title }}
<br>{% include authors.html post=post %}
</li>
{% endfor %}
</ul>
We will also use our authors include in _layouts/post.html
...
<h1 class="post-title" itemprop="name headline">{{ page.title | escape }}</h1>
<p>{% include authors.html post=page %}</p>
...
Now the magic : _includes/authors.html
{% assign post = include.post %}
{% comment %}## if we have a least one author in post authors array {% endcomment %}
{% if post.authors and post.authors != empty %}
{% comment %} ## We will build a string for each author,
store it in authorsArray
then reassemble it at the end {% endcomment %}
{% assign authorsArray = "" | split: "" %}
{% for author in post.authors %}
{% comment %}## Count posts for current author {% endcomment %}
{% assign authorsPostsCount = site.posts | where_exp: "post", "post.authors contains author" | size %}
{% comment %}## Get authors data based on uid matching in the collection {% endcomment %}
{% assign authorsDatas = site.authors | where: "uid", author | first %}
{% if authorsDatas %}
{% capture authorString %}
{{ authorsDatas.firstname }} {{ authorsDatas.lastname }} ({{ authorsPostsCount }})
{% endcapture %}
{% else %}
{% comment %}## No entry for this author in the collection
## or author spelling is wrong {% endcomment %}
{% capture authorString %}
{{ author | capitalize }} ({{ authorsPostsCount }})
{% endcapture %}
{% endif %}
{% comment %}## Push result in authorsArray {% endcomment %}
{% assign authorsArray = authorsArray | push: authorString %}
{% endfor %}
{% comment %}## Create a sentence with array elements {% endcomment %}
by {{ authorsArray | array_to_sentence_string }}
{% endif %}
_layouts/author.html
---
layout: default
---
<h1>{{ page.firstname }} - {{ page. lastname }}</h1>
{% assign authorsPosts = site.posts | where_exp: "post", "post.authors contains page.uid" %}
<ul>
{% for p in authorsPosts %}
<li>{{ p.title }}</li>
{% endfor %}
</ul>

Twig loop index into array

I want to show my string value into my array 'nameComments' with key {{loop.index}} of my comments array, but {{ nameComments[{{ loop.index }}] }} show an error
{% for com in comments %}
<p>Comment {{ nameComments[{{ loop.index }}] }} : "{{ com['comment'] }}"</p>
{% endfor %}
If I try:
{% for com in comments %}
<p>Comment {{ nameComments[1] }} : "{{ com['comment'] }}"</p>
{% endfor %}
And the {{ loop.index }} show me value : 1
So how can I implement my loop index into my array?
{% for com in comments %}
<p>Comment {{ nameComments[ loop.index ] }} : "{{ com['comment'] }}"</p>
{% endfor %}
Just leave out the curly brackets. This should work fine.
By the way loop.index is 1 indexed. If you loop through an array which normally starts with index 0 you should consider using loop.index0
See the documentation
It is safer to iterate over the real value of the array index and not using loop.index and loop.index0 in case where array indexes do not start in 1 or 0 or do not follow a sequence, or they are not integers.
To do so, just try this:
{% for key,com in comments %}
<p>Comment {{ nameComments[key] }} : "{{ com['comment'] }}"</p>
{% endfor %}
See the documentation

Resources