Load more posts in the same page

🙋Get Help
1

Hi,

I have in my theme a ‘products archive’ page that show the first X products.

When you scroll down to the bottom, there is a ‘Load More’ button that should load the next X products to the same page.

How can I implement this logic ?

TNX :upside_down_face:

3

Hi @dor

What theme are you using? Assuming you’re using mars-theme you could modify list/list.js to render all the products in state.source.products.

So instead of doing

const data = state.source.get(state.router.link);

and

{data.items.map(({ type, id }) => {
    const item = state.source[type][id];
    // Render one Item component for each one.
    return <Item key={item.id} item={item} />;
 })}

you might instead do

{state.source.products.map((product) => {
     // Render one Item component for each one.
     return <Item key={product.id} item={product} />;
})}

Not having access to your repo or data source I haven’t tested the above, but something like it should do the trick.

Hope this helps. Let us know how you get on.