Skip to content
Grav 2.0 is officially stable. Read the announcement →

Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

Plugins

Add readingtime to each blog item in blog list

Solved by pamtbaau View solution

Started by Marco Cevoli 6 years ago · 6 replies · 804 views
6 years ago

Hi, I'd like to know how to add the correct reading time in a blog list page. If I use page.content.readingtime it calculates the reading time of the list page, not the time of the single blog post page. I don't know how to tell Grav to do that. Is that even possible?

Thanks in advance.

👍 1
last edited 08/10/20 by pamtbaau
6 years ago

@marcocevoli, Do you mean something like the following, where each blog item in the blog list shows its own reading time?

image|690x298

<pre>
<br/>
</pre>
If so, you should add the the code snippet {{ page.content|readingtime }} to the template that draws the list items. In Quark that would be '/partials/blog-list-item.html.twig'

👍 1
last edited 08/10/20 by pamtbaau
6 years ago

That's what I did. Actually, I have the list created inside a blog template, such as:

TWIG
  <section>
    <div class="container">
        <div class="row">
        {% for child in collection %}
            <!-- Single Blog Grid -->
            <div class="col-lg-6 col-md-6">
                <div class="blog-grid-wrap mb-4">
                    <div class="blog-grid-thumb">
                        <a href="{{ child.url }}">
                <img src="{{ child.media.images|first.cropZoom(1920,900).cache.url() }}" class="img-responsive" alt="" />
              </a>
                        <div class="bg-cat-info">
                            <h6>{% for cat in child.header.taxonomy.category %}{{ cat }}{% if not loop.last %},{% endif %} {% endfor %}</h6>
                            <span>{{ child.header.date|date('d') }} {{ 'GRAV.MONTHS_OF_THE_YEAR'|ta(child.header.date|date('n') - 1) }} {{ child.header.date|date('Y') }}</span>
                        </div>
                    </div>
                    <div class="blog-grid-content">
                        <h4 class="cnt-gb-title">
                <a href="{{ child.url }}">{{ child.title }}</a>
              </h4>
                        <p>{{ child.summary(110) }}</p>
                    </div>
                    <div class="blog-grid-meta">
                        <div class="gb-info-author">
                            <p><strong>{{ 'THEME_UNICO.SITE.BY'|t }} </strong>{{ child.header.author }}</p>
                        </div>
                    </div>
                </div>
            </div>
        {% endfor %}
        </div>

If I put that snippet, I get the same reading time for all pages... I don't know what I'm doing wrong...

6 years ago Solution

@marcocevoli And where is snippet {{ page.content|readingtime }} ?

If it is used in this template, it should probably be {{ child.content|readingtime }}

👍 1
6 years ago

That was the page before I put the snippet.

BTW, by trial and error, I've found out that the correct snippet indeed is:
{{ child.content|readingtime }}

This way it works.
Thanks,
Marco

6 years ago

@marcocevoli see my answer above...

Suggested topics

Topic Participants Replies Views Activity
Plugins · by Rene, 1 week ago
2 54 1 week ago
Plugins · by Xavier, 4 weeks ago
2 61 4 weeks ago
Plugins · by Luka Prinčič, 7 years ago
3 1188 1 month ago
Plugins · by Sebastian van de Meer, 1 month ago
1 54 1 month ago
Plugins · by PIERROT Alain, 2 months ago
3 79 2 months ago