Combine GroupByDate and range first statement

support
1

Hi,

New to Hugo (and coding in general).

How do I combine a GroupByDate and range first statement?

I’ve managed to get everything to work, except the range first statement does not work; it does not limit the number of posts being shown. Also the <p>Read More</p> tag does not appear.

<div class="content-wrapper">
  <div class="content">
    <h1 class="content-head is-center">Recent posts</h1>
    {{ range .Data.Pages.GroupByDate "2 Jan 2006" }}
      <h2 class="content-subhead">{{ .Key }}</h2>
      {{ range first 10 .Pages }}
        {{ .Render "summary"}}
      {{ end }}
    </div>
    {{ end }}
    
    <p>Read More</p>
</div>

Greatly appreciate any help on this issue. Thanks!

2

Try it with the following snippet:

{{ range first 10 (.Data.Pages.GroupByDate "2 Jan 2006") }}
   // Insert your code
{{ end }}
3

This will not work and isn’t what the topic-starter wants.

I’m a little bit puzzled by the fact that the original construct doesn’t work.

4

I’ve tried the same construct in another Hugo project, but no luck; the range first 10 statement does not work. Any suggestions or other constructs I can try to achieve the same result?

5

With GroupByDate, you’re going to get all posts grouped by their day of publication, and then the range first 10 will show the first 10 pages for each date. I suspect that you mean to be using range .Data.Pages.ByDate instead of GroupByDate.

6

Hi, sorry for the late reply. Thanks for helping. I tried your suggestion but it doesn’t work.

My code:

<div class="content-wrapper">
  <div class="content">
    <h1 class="content-head is-center">Recent posts</h1>
    {{ range .Data.Pages.ByDate "2 Jan 2006" }}
      <h2 class="content-subhead">{{ .Key }}</h2>
      {{ range first 10 .Pages }}
        {{ .Render "summary"}}
      {{ end }}
    </div>
    {{ end }}
    
    <p>Read More</p>
</div>

I get the following error message:

ERROR: 2015/08/08 Error while rendering homepage: template: index.html:20:18: executing "index.html" at <.Data.Pages.ByDate>: wrong number of args for ByDate: want 0 got 1

If I remove the arg ("2 Jan 2006"), I get the following error message:

ERROR: 2015/08/08 Error while rendering homepage: template: index.html:21:36: executing "index.html" at <.Key>: Key is not a field of struct type *hugolib.Page

All I’m trying to do is get the first 10 posts and group them by date. Example:

**5 Aug 2015**
Post 1
Post 2
Post 3

**2 Aug 2015**
Post 4

**1 Aug 2015**
Post 5
...

Essentially, I’m trying to create an archive page with the date, post title and post summary. Does that make sense?

8

I meant for you to try something like this:

{{ range first 10 (.Data.Pages.ByDate) }}

But I can see now from your example that you do, in fact, want them grouped by date. To accomplish what you want, I’m assuming you’ll need to manually track how many posts you display. So going back to your original code, create a counter variable outside of the GroupByDate range statement and increment the counter after each Render. Throw in a couple if statements to check the counter, and you should end up with what you’re wanting.

9 
{{ range first 10 (.Data.Pages.ByDate) }}
    {{ $dat := .Date }}
    {{ if ne $dat ($.Scratch.Get "odat")}}
        {{ $.Scratch.Set "odat" $dat }}
        <h2>{{ $dat }}</h2>
    {{ end }}
    {{ .Render "summary"}}
{{ end }}

putting date header when the date change. Like this?

1 Like
10

What you can do with the latest Hugo 0.15-DEV is to use the built in paginator with pagegroups, both on archive and index page.

{{ range (.Paginate (.Data.Pages.GroupByDate "2006")).PageGroups  }}

This will give you 10 pages (by default) and a paginator to go back and forward.

1 Like
11

That works great! Thanks!

My question to you now is using your code, how do I format the date so it reads “2 Jan 2006” and reverse the order so the newest post comes first? Thanks a bunch.

12

Totally untested, but should work:

{{ range (.Paginate ( (.Data.Pages.GroupByDate "2 Jan 2006").Reverse  )).PageGroups  }}
``
13

If you took my route, the following should work, if you follow @bep’s route in the latest 0.15-DEV version, his version should be better.

you can use .Reverse and dateFormat

{{ range first 10 (.Data.Pages.ByDate.Reverse) }}
    {{ $dat := .Date }}
    {{ if ne $dat ($.Scratch.Get "odat")}}
        {{ $.Scratch.Set "odat" $dat }}
        <h2>{{ dateFormat "2 Jan 2006" $dat }}</h2>
    {{ end }}
    {{ .Render "summary"}}
{{ end }}

haven’t test above code yet, but I hope it will run. But really, you should consider this PageGroup instead.

2 Likes
14

Thanks! Your code works.

I’ll definitely have a look at @bep’s suggestion. I just need something to work now and then I can work on improving it in the background. Thanks a bunch to everyone for helping out.

As a side note, Hugo is awesome and quite manageable even for a non techie like myself, This is the first problem I’ve encountered… No need for wordpress when you can build something yourself!

1 Like