Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add frontmatter option to reverse pagination collection #194

Closed
zachleat opened this issue Aug 15, 2018 · 9 comments
Closed

Add frontmatter option to reverse pagination collection #194

zachleat opened this issue Aug 15, 2018 · 9 comments
Assignees
Milestone

Comments

@zachleat
Copy link
Member

zachleat commented Aug 15, 2018

Just spitballing here.

---
pagination:
  reverse: true
---

Raised in #192

@zachleat zachleat added enhancement needs-votes A feature request on the backlog that needs upvotes or downvotes. Remove this label when resolved. labels Aug 15, 2018
@zachleat
Copy link
Member Author

zachleat commented Aug 15, 2018

This repository is now using lodash style issue management for enhancements. This means enhancement issues will now be closed instead of leaving them open.

The enhancement backlog can be found here: https://github.com/11ty/eleventy/issues?utf8=%E2%9C%93&q=label%3Aneeds-votes+sort%3Areactions-%2B1-desc+

Don’t forget to upvote the top comment with 👍!

@johanbrook
Copy link

johanbrook commented Aug 17, 2018

👍 for something like this.

I've followed the guide on posts pagination (a vanilla blog post setup), and simply can't get it to reverse the complete posts collection before paginating it.

Example:

---
title: Writings
layout: layouts/main
pagination:
  data: collections.post
  size: 10
---

{%- for post in posts -%}
  <!-- Will sort all posts in ascending order, then paginate on 10 per page -->
{%- endfor -%}

{%- for post in posts | reverse -%}
  <!-- Will paginate on 10 per page, then sort in descending order -->
{%- endfor -%}

Feels like a pretty prio use case 💞

@paulrobertlloyd
Copy link
Contributor

paulrobertlloyd commented Nov 23, 2018

(Comment largely copied from #147, as requested by @zachleat. It would seem this issue has been reported a few times now!)

Currently, I have the following collection defined in my config:

eleventy.addCollection('note', collection => {
  return collection.getFilteredByGlob('**/notes/**/*.md').reverse();
});

which I paginate like so:

---
title: Notes
pagination:
  data: collections.note
  size: 5
---
{% for item in pagination.items %}
  {{ item }}
{% endfor %}

This results in the following – and correct – pagination (10 being the most recent item, 1 the oldest):

--- Page 1 ---
10
9
8
7
6
--- Page 2 ---
5
4
3
2
1

Now, I’d been hoping that I could do away with defining so many collections in my config, and instead use tags. However, as there’s no means of declaratively reversing a collection before it gets paginated, items are now paginated like so:

--- Page 1 ---
1
2
3
4
5
--- Page 2 ---
6
7
8
9
10

Using Liquid’s reversed filter on the forloop doesn’t help here, as that results in the following:

--- Page 1 ---
5
4
3
2
1
--- Page 2 ---
10
9
8
7
6

Basically, there needs to be a means of reversing the order of items in a collection and/or the order of paginated pages. Maybe something like:

---
pagination:
  data: collections.note
  size: 5
  reversed: true
---

or perhaps:

---
pagination:
  data: collections.note.reversed
  size: 5
---

@paulrobertlloyd
Copy link
Contributor

paulrobertlloyd commented Nov 26, 2018

@zachleat Had a thought regarding this. Perhaps rather than (or in addition to) reversing a collection’s order at the pagination level, perhaps there should be an option to set a default order at the global (or folder) config level? As my site displays content from newest to oldest, pretty much every collection I’m using requires reversal before it can being used because 11ty sorts collections from oldest to newest by default. Essentially, 11ty could provide a means of using .reverse() for use within data files.

@edwardhorsford
Copy link
Contributor

edwardhorsford commented Nov 26, 2018

@zachleat Had a thought regarding this. Perhaps rather than (or in addition to) reversing a collection’s order at the pagination level, perhaps there should be an option to set a default order at the global (or folder) config level?

I'm reversing the order of pretty much everything for the same reason.

@zachleat zachleat added this to the 0.7.0 milestone Jan 8, 2019
zachleat added a commit to 11ty/11ty-website that referenced this issue Jan 9, 2019
zachleat added a commit that referenced this issue Jan 9, 2019
@zachleat
Copy link
Member Author

zachleat commented Jan 9, 2019

reverse: true will be included in 0.7.0 but the global preference idea surfaced by @paulrobertlloyd is a separate enhancement issue that needs upvotes: #367. Thanks y’all!

@zachleat zachleat removed the needs-votes A feature request on the backlog that needs upvotes or downvotes. Remove this label when resolved. label Jan 9, 2019
@zachleat
Copy link
Member Author

zachleat commented Jan 9, 2019

@zachleat zachleat self-assigned this Jan 9, 2019
@paulrobertlloyd
Copy link
Contributor

paulrobertlloyd commented Jan 9, 2019

Thanks @zachleat! As to document the impact of this change, I’ve now been able to remove 33 lines from my config where I was globbing files to create collections and then reversing them.

I’d be able to simplify my setup further by setting the default globally – indeed, still having to hack around this limitation in places, but progress all the same. Thanks again for all you hard work on this project!

@zachleat
Copy link
Member Author

zachleat commented Jan 9, 2019

Awesome @paulrobertlloyd! That’s a good win.

ahmedsaoudi added a commit to ahmedsaoudi/11ty-website that referenced this issue Mar 28, 2021
Using the `reverse` filter with Liquid to reverse a collections order as shown here results in a compile error. 
According to this [thread](11ty/eleventy#194), the correct filter should `reversed`. 
Using this filter, reverses the collection as intended.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants