Jekyll: liquid tag inside javascript - Stack Overflow

admin管理员组

文章数量:1220791

Suppose I have two links: "all posts" and "personal." When the user clicks the "personal" link, he should only see the posts that have the category "personal." Right now, the liquid tag is {% for post in site.posts %}. I want to learn if there is a way to access the variable site.posts from javascript, so that I can listen to the click event and dynamically filter the post. If not, what should I do?

Suppose I have two links: "all posts" and "personal." When the user clicks the "personal" link, he should only see the posts that have the category "personal." Right now, the liquid tag is {% for post in site.posts %}. I want to learn if there is a way to access the variable site.posts from javascript, so that I can listen to the click event and dynamically filter the post. If not, what should I do?

• javascript
• jekyll
• liquid

Share Improve this question Follow asked Jan 25, 2015 at 22:49 Maximus SMaximus S 11.1k1919 gold badges8080 silver badges163163 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 21

You can make Jekyll parse any file by adding an empty front matter to it.

example: assets/js/script.js

Edit 16/07/28 : you can use jsonify filter for any hash or array

---
---
{{ site.posts | jsonify }}

Old answer

---
---
{% capture posts %}
[
{% for post in site.posts %}
{
"title"    : "{{ post.title }}",
"url"      : "{{ post.url }}",
"date"     : "{{ post.date | date: "%B %d, %Y" }}",
"content"  : "{{ post.content | escape }}"
} {% if forloop.last %}{% else %},{% endif %}
{% endfor %}
]
{% endcapture %}
var posts = {{posts | strip_newlines}}

This will put the site.posts objects collection in a json form and attribute them to you javascript posts var.

本文标签： Jekyll liquid tag inside javascriptStack Overflow