Pagination for shop page and pages width


I suppose that by dynamic loading you mean a solution for pagination. It won't be anything nearly as simple as this CSS. smile

You can pay me with any methods here or I could send you a paypal invoice.


I paid.


Do I invite you as admin or create a user for you?


Awesome! sunglasses

Invite as admin, if you want me to implement it there. Regardless, I've already started working on the "dynamic pagination", better known as endless scrolling.

And with having the most used name I think I just found a great instance of what I would do, although I would improve it at least a bit more (like adding an option to load all at once). Please see what you think:


You are the expert, I just want my loading problem fixed so phone and tablet users can see the site : )

I have sent the invite. Thanks!


Okay, still not perfect, but see what you think so far:

Few things I'll implement soon (mostly as stated on the link):

  • a loading indicator on the bottom
  • something to show it reached an end
  • an actual ending limit
  • make it glue right for more than 2 columns (or limit layout to 2 columns)
  • (later) enable come back to the same page

What I won't be able to implement this time:

  • 2 columns arrangement like the current shop

Continue on this tomorrow. wink


I checked it out and have a few questions below in all caps.




  4. make it glue right for more than 2 columns (or limit layout to 2 columns) - I DON'T UNDERSTAND 'GLUE RIGHT', WHAT IS GLUING RIGHT? IN TERMS OF NUMBER OF COLUMNS, WE TEND TO LIKE THREE MORE THAN TWO.

  5. (later) enable come back to the same page - CAN YOU EXPLAIN THIS? DO YOU MEAN BACK TO THE TOP OF THE PAGE?

  6. 2 columns arrangement like the current shop - I DON'T UNDERSTAND THIS EITHER, PLEASE EXPLAIN?

I am also concerned that the custom tiled look of the shop has changed in the 'new shop'. We REALLY LIKE the look of our current shop. Can the look remain the same?



The loading time is super fast : )


For most of your questions, it'll be easier to just implement the points. Then you'll see.

I am using terms more familiar to myself indeed, and it can become quite complicated to explain them further. So I appreciate it if you can just leave them as my own self notes for now.

That being said, the "enabling to come back to the same page" I meant as if each auto loaded "page" was an actual page and then, if you click on an item, when you press back you can get back to that same "page" and see the item on the whole listing.

I figured an easier way to get a similar behaviour and we'll go with that, so I'm not going to implement it the way I had envisioned (which is like it's done on discourse) this time. It will simply open products in a new tab. smile

Now, there is 1 topic left that I'm glad you brought up. The layout.

I also like the way the current shop looks, but I can't just implement pagination on top of it at all. There are only 2 ways to do it. The one I did, with using script to load the json, and using a different template, the ideal of which is the "Developer Platform" (which should actually be called "template developing").

In either way, the more we develop, the more we will get. And, as I told you before, the U$321 price was to do the minimum, and that's what I'm doing.

Going with developer platform requires more effort, so I never cover it in this minimum price. While using scripts make it harder to tweak layouts. So I won't be able to get the layout exactly as it is done with shop.

I think the way it is now it's pretty close. And it does have this extra feature in which you can choose the width of each product thumbnail to allow for more than 2 columns.


Finished polishing it up. Other than the points I said I'd implement, I also made it look much more like the current shop, just to make sure we're on the same page of what I meant would be missing...

The expected missing part will be the arrangement. I have found a little hope to do it, which I'll try as a last shot tomorrow, but no promises.

There's also a minor bug when going back or reloading the page, which would be surprisingly quite hard to fix. I'll let that slide for now.

All in all, I hope this is it! Please see if you find any other problem.


I assumed that the layout of the shop, masonry style, would not be altered by your work on the loading problem. I never would have chosen to do it if I had known that the look of the Shop would change so much. I am very happy with the loading aspect of the work you have done, but disappointed with the look. Please stop your work, I need to find another solution that does not alter the look of the Shop. I do not like all of the large and uneven gaps between the images. I am not sure if you have finished trying to fix this, but the 'new-shop' I looked at tonight will not work.

I am still considering a switch to Galapagos and a fix. If you cannot fix the Shop in Supply, perhaps you can fix it in Galapagos?


Oh well, our mistake I suppose. I never asked how important that layout was to you, and you never told me. So I assumed that was not such a big deal.

At this point, it will probably be easier and better to just apply masonry. I can take this hit.

Also, the only way to make it work with the shop in any template is if it doesn't load all pages at once at first - so it would need to have pagination already. I'm not so sure galapagos have it.

Anyway, unless you really want to switch templates, let me see what I can do there today and we go from there.


I realize we had a miscommunication. I am new to this, as you have already figured out, so I thought all you would do was fix the loading problem. It would have been nice to know ahead of time that your work could effect the look. It did not cross my mind to ask, I figured you were the expert and would tell me if something might get changed.

I want to make sure I understand your comments above...

You are still going to try something that might fix the look...correct?

SS has told me that Galapagos does paginate and that it is the only template they have that paginates. I still like the look of Supply better, especially how the images can be different sizes. I would prefer not to switch templates, let me know when I should have another look at the 'new-shop'.


It's already working, but still need to resolve a few bugs.

The width isn't fully right, the loading icon also is a bit off and all the animation is making it get slower on mobile devices.

Do take a look, though. It will eventually be even better than the layout on the shop, as now you can choose the thumbnail size and increase number of rows. You can play with the summary there on the page. smile


yes the layout is looking much better. do you want additional comments or is it better if i wait until you are finished with adjustments?


Do bring comments. I'll try to work on them today and tomorrow, but I may only be able to finish 'em by next week as they already proved to be non trivial. I also think and hope those are the only 3 bugs left!


Here is a list of things I have noticed, mainly I would like the look to be as much like the existing shop as possible.

  1. The prices look big, not sure if that is just a style adjustment or if you need to fix that.
  2. I would prefer that the images don't swap places when the page is loading.
  3. I would like there to be three columns of product.
  4. On my phone, as I scroll down the page I can shift the page to the side a bit. It almost seems like I can move the page from left to right, not just up and down. If I get too far right the window is blank. I would prefer to just be able to scroll up and down in one column of products.

I forgot to look at it on my ipad, I will send additional comments if I have any. Thanks!


Yeah, prices is a simple style adjustment, right there on the Custom CSS. I'll add an option to make it visible on the editor.

Right now, there's no way for images to not swap places after loading. The only thing that makes it possible to adjust the layout in this masonry way is precisely swapping their places to adjust it. But I've just removed the animation which makes that effect basically go away.

3 columns of product will probably look too small on mobile, so you'll have to be more specific. Do you want to always have 3 columns?

Yeah, I've noticed the page shifting to the side. That's basically included in the "width bug" and I agree it's an annoyance. But little bugs like this could pass by without me noticing, do report them! wink


I really like the masonry look, if the swapping has to stay in order to have the masonry look that is okay.

We do not always have to have three columns, it's fine if it's just one column on your phone. I would like it to default to three columns for a tablet or computer. Will that work?

Hopefully you can fix the page shifting from side to side.

Is the loading code you are adding going to change the look of any of our other pages?


I'm only working in 2 places right now. On that new page and on Custom CSS. And the CSS I'm dealing with is tailored made to work only on this page. So, no. Nothing so far affects anything on the other pages. That is, until you want to. smile

And I'll restrict it to a maximum of 3 columns.