Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

Pagination customer orders not working on account page

Pagination customer orders not working on account page

EddieBui
Shopify Partner
3 0 2

Pagination not working right:

{%- paginate customer.orders by 5 -%}
          <div class="account__block-list">            
                  .....
                {%- when 'orders' -%}
                  <div class="v-stack gap-5" {{ block.shopify_attributes }}>
                    <div class="order-grid-list">
                      {%- for order in customer.orders -%}
                        <div class="order-grid-item rounded-sm">
....
{{ paginate | default_pagination }}
                    {%- render 'pagination', paginate: paginate -%}
                  </div>
              {%- endcase -%}
            {%- endfor -%}
          </div>
        {%- endpaginate -%}
 
I'm trying to use default and a coding liquid pagination but still not working. I have check the
paginate.pages = 1 while I have more than 20 orders.
 
Replies 6 (6)

Liam
Community Manager
3108 344 910

Hi EddieBui,

 

 

What are you seeing when this code runs - are you seeing any pagination elements appearing at all, and are you still seeing the orders appear? According to our docs, the paginate tag does work with `customer.orders` so you should be able to get default pagination working with these orders. 

 

For an example of how pagination can be implemented on an account page, you can check out how it's working on Dawn here

 

Hope this helps!

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

EddieBui
Shopify Partner
3 0 2

Hi Liam,

there is no pagination elements appearing at all, I just can only see 5 orders per 7 in total. I have found that 'paginate customer.orders by 5' in this paginate object: paginate.pages = 1 although the customer.orders over than 5

Liam
Community Manager
3108 344 910

In Dawn there's extra pagination and page rules being set up that you can see here, can you follow that method to display next/ previous buttons?

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

rpbiwer
Shopify Partner
19 0 7

I'm having the same problem as EddieBui and modeled my code after the example from Dawn that you linked to. In my case, paginate.parts.size is 0. The default_pagination liquid tag also outputs nothing.

 

If I do {{ paginate | json }}, I get the following:

{"current_offset":0,"current_page":1,"items":0,"page_size":2,"parts":[],"pages":1}

 

Edit: also, in my case I'm paginating by 2 and have a total of 3 orders.

rpbiwer
Shopify Partner
19 0 7

I just found this GitHub issue: https://github.com/Shopify/dawn/issues/2230

Looks like it's related to test orders. I'm not sure how a theme developer is supposed to test pagination if test orders don't count.

EddieBui
Shopify Partner
3 0 2

Hi, I agree with this, maybe the paginate does not count the test orders or the test bogus/test card payment. I have the same question how can we test the pagination with orders before we push it to the current storefront