Get front matter data of specific pages into table in Jekyll - html

I want to get some information from the front matter ({{ page.title }} and {{ page.status }}) for some of my site pages into a table on my index page.
How should I do this?
<table>
<tr>
<td>Page title</td> <td>Page status</td>
</tr>
<tr>
<td>{{ page-name-1.title }}</td><td>{{ page-status-1.status }}</td>
</tr>
<tr>
<td>{{ page-name-2.title }}</td><td>{{ page-status-2.status }}</td>
</tr>
</table>

You can get a specific page from the site.pages collection with the Liquid filter where of Jekyll.
Given I have a page foo.md with this front matter:
---
title: foo
status: bar
---
Then this:
<table>
<tr>
<td>Page title</td>
<td>Page status</td>
</tr>
{% assign page_info = site.pages | where: 'name', 'foo.md' %}
<tr>
<td>{{ page_info[0].title }}</td>
<td>{{ page_info[0].status }}</td>
</tr>
</table>
Will render as
<table>
<tr>
<td>Page title</td>
<td>Page status</td>
</tr>
<tr>
<td>foo</td>
<td>bar</td>
</tr>
</table>
Just repeat it for any page that have an interest for you:
{% assign pages_info = 'foo.md,index.md' | split: ',' %}
<table>
<tr>
<td>Page title</td>
<td>Page status</td>
</tr>
{% for page_name in pages_info %}
{% assign page_info = site.pages | where: 'name', page_name %}
<tr>
<td>{{ page_info[0].title }}</td>
<td>{{ page_info[0].status }}</td>
</tr>
{% endfor %}
</table>

Related

Why I cannot see data in hierarchy table?

I'm trying to create a hierarchical table in Vue.js, this should be such a base therefore. However, I don't want to show the table with the data. The error would be here:
<tr v-if="item.childrenVisible" v-for="child in item.children" :key="child.id">
If I remove this whole section, I can see the table
HTML:
<table>
<thead>
<tr>
<th>Name</th>
<th>Parent</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr v-for="item in items" :key="item.id">
<td>{{ item.name }}</td>
<td>{{ item.parent }}</td>
<td>
<button #click="toggleChildren(item)">Toggle Children</button>
</td>
<tr v-if="item.childrenVisible" v-for="child in item.children" :key="child.id">
<td>{{ child.name }}</td>
<td>{{ child.parent }}</td>
<td>
<button #click="toggleChildren(child)">Toggle Children</button>
</td>
</tr>
</tr>
</tbody>
</table>
</div>
Vue.js script and my whole mini-project:
https://jsfiddle.net/barabas/jrcufeah/
The problem was you cannot use v-if and v-for on the same node like I did so this is how I fix it
<template v-if="item.childrenVisible">
<tr v-for="child in item.children" :key="child.id">
<td>{{ child.name }}</td>
<td>{{ child.parent }}</td>
<td>
<button #click="toggleChildren(child)">Toggle Children</button>
</td>
</tr>
</template>
I split up the v-for and v-if to two different node template and tr

How to create a table with multiple columns with data from the same dictionary?

I am trying to create a table with HTML tags but I am stuck with it.
I've tried to play with {% for i in list %}, but I couldn't find a solution.
list = {'ticker': tickers, 'price': prices}
<tbody>
<tr>
{% for i in price %}
<td>{{ i }}</td>
{% endfor %}
{% for i in ticker %}
<td>{{ i }}</td>
{% endfor %}
</tr>
<tr>
</tr>
</tbody>
I would see two columns one close to another, but I don't see any columns now.
try this
<tbody>
{% for i in list %}
<tr>
<td>{{ i.ticker }}</td>
<td>{{ i.price }}</td>
</tr>
{% endfor %}
</tbody>
for more details refer this
hope it helps

Display a table using for twig

I'm using symfony and html2pdf bundle to generate a pdf file so here's the code that I used to display a table in the pdf file:
<table class="border" width="100%" align="center">
<thead>
<tr>
<th>Kilometrage</th>
<th>Liste des Interventions</th>
</tr>
</thead>
<tbody>
<tr>
{% if voitures.kilometrage-voitures.kilometragederniervidange<20000 and voitures.kilometrage-voitures.kilometragederniervidange>=10000%}
{% for intervention1 in interventions1 %}
<td>{{ voitures.kilometragederniervidange+10000 }}</td>
<td>***{{ intervention1.interventions }}</td>
{% endfor %}{% endif %}
</tr>
</tbody>
</table>
and here's what I get as a result:
and what I want to do is to show each line separately. What should I do exactly? ?
You have probably misplaced the for cycle, try this:
<table class="border" width="100%" align="center">
<thead>
<tr>
<th>Kilometrage</th>
<th>Liste des Interventions</th>
</tr>
</thead>
<tbody>
{% if voitures.kilometrage-voitures.kilometragederniervidange<20000 and voitures.kilometrage-voitures.kilometragederniervidange>=10000%}
{% for intervention1 in interventions1 %}
<tr>
<td>{{ voitures.kilometragederniervidange+10000 }}</td>
<td>***{{ intervention1.interventions }}</td>
</tr>
{% endfor %}
{% endif %}
</tbody>
</table>
This will insert new table row for every record / run of the for cycle.

Issue with html table in laravel 5

I have a table in a blade file.
<table style="width:80%" border="1">
<tr>
<th>Code</th>
<th>Type</th>
<th>Issue</th>
<th>Entry Type</th>
<th>Value</th>
</tr>
<tr>
#foreach($issues as $issue)
<td>{{ $issue->code }}</td>
<td>{{ $issue->type }}</td>
<td>{{ $issue->issue }}</td>
<td>{{ $issue->entry_type }}</td>
<td>{{ $issue->value }}</td>
#endforeach
</tr>
</table>
However, it dispays like this:
Code Type Issue Entry Type Value
ABC RMK UDID 67 list ABC-U67 ABC RMK UDID 43 list ABC-U43
<
It's not only displaying two record across one row but also displaying a left angle bracket which I can't find in the code. Any help would be appreciated. I am new at Laravel.
There is a problem with your html, not laravel.
The <tr> tag should be in the foreach.
Here:
#foreach($issues as $issue)
<tr>
<td>{{ $issue->code }}</td>
<td>{{ $issue->type }}</td>
<td>{{ $issue->issue }}</td>
<td>{{ $issue->entry_type }}</td>
<td>{{ $issue->value }}</td>
</tr>
#endforeach
It should be like
<table style="width:80%" border="1">
<tr>
<th>Code</th>
<th>Type</th>
<th>Issue</th>
<th>Entry Type</th>
<th>Value</th>
</tr>
#foreach($issues as $issue)
<tr>
<td>{{ $issue->code }}</td>
<td>{{ $issue->type }}</td>
<td>{{ $issue->issue }}</td>
<td>{{ $issue->entry_type }}</td>
<td>{{ $issue->value }}</td>
</tr>
#endforeach
</table>

How to print array with jekyll and liquid

I have a json document with some data
{"teams":[{"team":"Team A","evolution":[1,2]},{"team":"Team B","evolution":[3,4]}]}
I try to print it to my view with liquid
{% for team in teams %}
<tr>
<td>{{team.team}}</td>
<td>{{team.evolution}}</td>
</tr>
{% endfor%}
The html result is
<tr>
<td>Team A</td>
<td>12</td>
</tr>
<tr>
<td>Team B</td>
<td>34</td>
</tr>
But what I would like to print is the raw array for the second <td>
<tr>
<td>Team A</td>
<td>[1,2]</td>
</tr>
<tr>
<td>Team B</td>
<td>[3,4]</td>
</tr>
Presuming that you get your datas from a _data/teams.json file, this works :
{% assign teams = site.data.teams.teams %}
<table>
{% for team in teams %}
<tr>
<td>{{team.team}}</td>
<td>{{team.evolution | join: "," | prepend: "[" | append: "]"}}</td>
</tr>
{% endfor%}
</table>