I have the code:
{% for comment in site.data.comments | where: "slug", page.slug %}
<div class="comment">
<div class="meta">
<p class="name">
{% if comment.email %}
<img src="https://www.gravatar.com/avatar/{{ comment.email }}?d=mm&s=60" alt="{{ comment.name| escape }}">
{% else %}
<img src="/blog/lib/img/avatar.jpg" alt="{{ comment.name | escape }}">
{% endif %} Od: {{ comment.name | strip_html }} * {{ comment.date | date: "%b %-d, %Y, %H:%M" }}</p>
</div>
<p class="message">{{ comment.message | strip_html | markdownify | smartify }}</p>
</div>
{% endfor %}
Which should replace the comment placed in data/comments/postid/commentid.yml with a comment in html but the result looks like this:
<div class="comment">
<div class="meta">
<p class="name">
<img src="/blog/lib/img/avatar.jpg" alt="">
From: * </p>
</div>
<p class="message"></p>
</div>
I just know there's something wrong with the values for comment but I don't know how to fix it.
And here is a sample comment in the file .yml
_id: a39a2830-4ab0-11ea-a10f-77385622cc26
name: Igor Kowalczyk
email: 28a451314d9295e9bcce66c293bd20ed
message: Testowy Komentarz
date: '2020-02-08T20:21:51.037Z'
Not exactly understanding how you get all datas, but one thing is sure is that you need to assign and then loop :
{% assign comments = site.data.comments | where: "slug", page.slug %}
{% for comment in comments %}
...
Edit:
Watching your comments and associated code, it seems that you need to configure staticman to create comments in a specific folder for each post.
In staticman.yml, add
path : "_data/comments/{options.slug}"
Then, you can select post related comments with {% assign comments = site.data.comments[page.slug] %}.
Code from Minimal Mistakes can be inspiring.
Related
In the following code, I have a category by the name "ml" defined in my yml file frontmatter. For some reason, the {% unless cat == "ml" %} is not working properly. See this html, and the output image below. Clearly, the category is ml (I have tried to remove any whitespace with the strip filter, which did not work), but it is not working (the unless statement, that is).
Please help!
<div class="posts">
<h1>Recent Posts: </h1>
{% for post in paginator.posts %}
{% assign cat = post.categories %}
{% unless cat == "ml" %}
<div class="post">
<h1 class="post-title">
<a href="{{ post.url }}">
{{ post.title }}: {{ cat }}
</a>
{% if post.image %}
<img src={{post.image}}>
{% endif %}
</h1>
<span class="post-date">{{ post.date | date_to_string }}</span>
</div>
{% endunless %}
{% endfor %}
</div>
I still am not completely sure on the why here, but I found that using contains rather than == solved my issue.
My code is:
<div class="recent-posts">
{% for post in site.posts | limit:3 %}
<div class="recent-posts-inline">
{% if post.featured-image %}{% include post-featured-image.html image=post.featured-image alt=page.featured-image-alt %}{% endif %}
<h4>
{{ post.title }}
</h4>
<p>{{ post.excerpt | strip_html | strip_newlines | truncate: 156 }}</p>
<p>Read More...</p>
</div>
{% endfor %}
</div>
I have tried using where_exp filter but to no avail. That's why I have to ask this question again.
Use the page variable in an if-check. Only do something if the post is not the same title as the current page. If you want a different comparison, you can check the .url, .id, or .name.
<div class="recent-posts">
{% for post in site.posts | limit:3 %}
{% if post.title != page.title %}
<div class="recent-posts-inline">
...
{% endif %}
{% endfor %}
</div>
I am creating a Jekyll theme where all user pages that implement the 'indexable' attribute in the front matter are rendered in the main landing page. So I have the 'frontpage layout:
---
layout: root
---
{% assign custom_pages = site.pages | where: 'indexable', true | sort: 'priority' | reverse %}
{% include header.html %}
{% for c_page in custom_pages %}
<div class="container {{ c_page.class | default: '' }}" >
{{ c_page.content }}
</div>
{% endfor %}
{% include footer.html %}
{% include javascripts.html %}
A sample page that will be processed:
---
layout: page
title: Us
permalink: /us/
indexable: true
priority: 10
class: us-page
---
<div class="row">
{% for member in site.data.members %}
<div class="col-sm-6">
<div class="card card-block">
<img src="{{ member.gravatar }}?s=256" alt="Avatar">
<h4 class="card-title text-xs-center">{{ member.name }}</h4>
<p class="card-text">{{ member.description | markdownify }}</p>
<p class="card-text">
{% for tag in member.expertise_areas %}
<span>{{ tag }}</span>
{% endfor %}
</p>
<a href="{{ member.blog }}" class="btn btn-primary" role="button" >Mi blog</a>
</div>
</div>
{% endfor %}
</div>
However the liquid tags are appearing unprocessed, like the same output {% raw %} would produce. Is there a way through I could do {{ c_page.content | magic_here }} in order to manually get rendered those tags?
EDIT. Screenshot:
EDIT2
Theme repository
Web implementation
Well, despite I still don't know whether the issue is in my code, I am posting how I managed to solve it. Basically I created a filter tag called liquefy which has been put in a .gem and whose main task is taking a text with markdown or/and liquid syntax as an argument which will be parsed and rendered.
Repo: https://github.com/sonirico/liquefy
Gem: https://rubygems.org/gems/liquefy
I am trying to grasp how blog works in Shopify.
First of all I could not find a solution for having categories or sub categories for blog posts.
All I can do is create multiple blogs and consider them as categories. If I go with this option I have trouble displaying blog titles on home page along with each post so visitors can understand what kind of post it is. I have tried this with tag but in that case I have to sacrifice real usage of tags because a post used to have more than one tag in it. My code looks like:
<section class="trend-sec">
<div class="container">
<h2 class="sec-title">Trending</h2>
<div class="row">
{% for article in blogs.trending.articles limit:4 %}
<div class="col-md-3 col-sm-6">
<div class="img-wraper">
<a href="{{ article.url }}">
<div class="img-cap-lab">
<h4>{{ article.tags }}</h4>
</div>
{% if article.image %}
{% assign image_alt = article.title | escape %}
{{ article | img_url: 'medium' | img_tag: image_alt, 'article__image' | link_to: article.url }}
{% else %}
</div>
{% endif %}
<div class="img-desc">
<h3>{{ article.title }}</h3>
<h5>by {{ article.author }}, {{ article.published_at | date: "%b %d %Y" }}</h5>
</div>
</a>
</div>
</div>
{% endfor %}
</div>
</div>
</section>
Following the Jekyll Docs, I have developed a people.yml file:
johnsmith:
name: John Smith
title: Director
image: img/johnsmith.jpg
janedoe:
name: Jane Doe
title: Coordinator
image: img/janedoe.jpg
If I loop through people...
{% for person in site.data.people %}
<p>{{ person }}</p>
{% endfor %}
... I get these outputs:
johnsmith{"name"=>"John Smith", "title"=>"Director", "image"=>"img/johnsmith.jpg"}
janedoe{"name"=>"Jane Doe", "title"=>"Coordinator", "image"=>"img/janedoe.jpg"}
However, when I try to access just one member from the yaml file...
{% assign person = site.data.people['janedoe'] %}
... I get a slightly different version of the data:
{"name"=>"Jane Doe", "title"=>"Coordinator", "image"=>"img/janedoe.jpg"}
I took this information, and I set out to make a person-card.html include:
<div>
<img src="{{ person[1].image }}" alt="{{ person[1].name }}">
</div>
<div>
<p>{{ person[1].name }}</p>
<p>{{ person[1].title }}</p>
</div>
On a page with a loop that accesses the data file, it works. On the contrary, if I use it with a person passed in from front matter, it does not work because the indexes have to be removed. Changing it to this works:
---
layout: default
person: janedoe
---
{% assign person = site.data.people[page.person] %}
<div>
<img src="{{ person.image }}" alt="{{ person.name }}">
</div>
<div>
<p>{{ person.name }}</p>
<p>{{ person.title }}</p>
</div>
My question - given the people.yml file above, how can I make a reusable include that works in either a for loop or with a single record from people.yml passed in through front matter as in the examples above?
The loop :
{% for people in site.data.people %}
{% assign person = people[1] %}
{% include person-card.html %}
{% endfor %}
Note we just assign the useful part (people[1]) to person.
The _includes/person-card.html include :
<div>
<img src="{{ person.image }}" alt="{{ person.name }}">
</div>
<div>
<p>{{ person.name }}</p>
<p>{{ person.title }}</p>
</div>
Jane's page :
---
layout: person
person: janedoe
---
The _layouts/person.html layout :
---
layout: default
---
{% assign person = site.data.people[page.person] %}
{% include person-card.html %}