How can i set continue load product on collection page without go to next page

Store Design

Topic summary

Goal: show more products on a Shopify collection page via a “Load more” button without navigating to the next page (AJAX/infinite pagination).

Debut theme approach:

  • Add hidden inputs (next URL, total pages, current page) and a button in collection-template.liquid; add jQuery in theme.js to fetch paginate.next.url and append items to .grid–view-items.
  • Fixes: replace missing icon with text loader; center the button via .load-more_wrap { text-align: center; }.
  • Bugs addressed: repeated first page (increment currentPage before building next URL), button persists at end (disable/hide when currentPage >= totalPages). An alternative JS updates the next link using the collection URL and shows “Products Finished” when done.

Dawn theme approach:

  • Use a custom web component (LoadMore) with fetch; append new items to the product grid container ID (must match your theme). Implementation requires adding markup in theme.liquid, JS in assets (e.g., loadmore.js), and hooking after pagination in sections/main-collection-product-grid.liquid. Ensure dataset attributes and container selectors are correct.

Common issues:

  • “$ is not defined” indicates jQuery isn’t loaded; use the fetch-based solution or include jQuery.
  • Multiple sections loading simultaneously or duplicating non-target collections are theme-specific selector/pagination conflicts; custom code review needed.

Status: Debut solution confirmed working by OP; Dawn solution shared with implementation steps. Discussion remains open; code snippets and selectors are central.

Summarized with AI on January 2. AI used: gpt-5.
29

@Chicafull Thanks! I figured this out, but now I am having a similar issue as to what you previously posted where the load more button doesn’t go away once you get to the bottom of the page. In my case, it is also repeating the first page over and over and doesn’t display any products that were previously on page 2. https://antheianyc.com/collections/plants

Were you able to get your Load More button to go away?