Custom template and ordering

I'm trying to let people reorder pages from the admin but can't seem to find how.

My pages look like this.

/products (page)
   /product1 (page)
   /product2 (page)

The header of "products" is:

title: 'Products'
content:
    items: '@self.children'

My template looks like this:

{% for page in page.collection() %} 
   {{ page.content }}
{% endfor %}

From what I gathered after looking a bit, we can't reorder if we put the items: part in the header.

Is there a way to allow users to reorder pages from the admin and still call the children of "Products" in my template?

Have look here:
https://learn.getgrav.org/admin-panel/page-advanced#ordering

Basically you go the the advanced tab of the page (products) there is 'ordering' on the right hand side. All pages in the menu are listed there. You just drag the current page (will have sort of a hamburger icon on it) to the position in the menu you'd like it to be.

Yes I know, but in the Advanced tab, above the ordering part, there is a "Parent setting order, ordering disabled" message.

If I remove the item: part in the header of my products page, the message disappears and the ordering works.

But if I remove the item part, my template doesn't know which pages it should display.

Sorry my fault. I just checked. You meant the actual sub pages. I have to admit, I'm surprised its not possible.

Mhm, you could probably integrate in your blueprint for the products page a listing field containing a page picker field. The listing fields are sortable. And then loop through those, but that seems quite complicated and not very intuitive for the user.

I wonder, if one need to use page collections (defined via the blueprint file) at all, to have a collection on a page... I did not try, yet.

Maybe this part of the docs has an answer?
https://learn.getgrav.org/content/collections#programmatic-collections

Well, that seems to work. Although, I have a page where I've defined a page collection via blueprint file and even after commenting out items:my subpages tell me sorting is deactivated (Maybe a browser cache problem?!)

But I created fresh subpages for another page and there it works. So for your case something like this:

{% set product_collection = page.evaluate([{'@page.children':'/products'}]) %}
{% for p in product_collection %}
   {{ dump(p.title) }}
{% endfor %}
-```
Oh and your sbupages have to be 'visible'.