Infinite Scroll or Endless Scroll in Dawn 2.0 on Collection Pages

Is there an easy way to add infinite scroll in Dawn 2.0 to the collection pages without adding another app? I would like the user to be able to scroll through all of the products in a collection without needing to go to the next page.

Thanks!

Ricquel

@RicquelS

yes, please try this code

https://gist.github.com/davecap/1187078/ebae13b05f80fabfd03fffa54bf79c264230120f

Hi, where exactly should I copy this code? Are there any screenshots? I could not find them on github.

It would be nice if I could make this work.

Hi I just wrote a quick tutorial on how to add Infinite Scrolling to Dawn for collection pages:

You can read it here!

https://undefined.agency/#/blog/how-to-add-infinite-scrolling-to-dawn

Like this comment if it helped you!

Thx, but I made it work with an App.

Do you know how a strike through or at least grey out on Options of a product can be enabled?

There is nothing built in in Dawn, and no Apps for that.

Thank you so much, this worked perfectly for me.

Hi there, please could you let me know where I’m going wrong with my Scrollify:

The ā€œLoading moreā€ message shows even when there are no more products.

ā€œLoading moreā€ only disappears and highlights the last page number after you click on ā€œLoading moreā€.

As more pages are loaded, the numbers aren’t highlighted. Page 1 is permanently underlined until you click on the ā€œLoading moreā€ message on the last page.

You could check it out on my website at the following address:

https://juliemiller.art/collections/trevor-coleman

My Shopify store name is julie-miller-e-commerce.

@Art_JulieMiller

yes can you try

https://www.huratips.com/tech-tips/how-to-add-infinite-scroll-pagination-to-shopify-collection-pages.html

Thanks very much for your response Ketan. I’m new to Shopify and having trouble with the code. Could you give me guidance?
Here are screenshots of the main-collection-product-grid.liquid file

  1. prior to inserting the

    tags

  2. after inserting it where I thought it should go (but clearly I’m wrong)

  3. the result

PS: here is a preview link if it helps:
https://jmz5p2gx17pxl4wv-63896027390.shopifypreview.com

PPS: the password for the store is password

@Art_JulieMiller

oh sorry its not work

Hi there, the password for the store is password

Hi Undefinedagency

Does your guide have Snapback Cache that works for Safari and Chrome? I mean if a customer click on a product in the collection and then go back, will he/she come back to the same place at the collection. Or do they have to scroll down again to find the same product?

The script we are currently using has problems with the including the metafields filters when more pages are loaded. Is this also a problem with your script?

Thanks alot… :folded_hands:

Hi @undefinedagency

Thanks for the tutorial! I’m very happy to be using it.

I’m just wondering if there is a way to show that the end of the scroll has been reached? It still shows ā€˜loading’ at the end, with Page 1 underlined.

Thanks!