Need a better way to have 300+ images on a page

Hello there forum,

I am building a page for an "Alumni" group that has over 300 photos on it. The gallery options didn't display the images how I wanted, so I built sections with about 30 images in them. Each section can be reached with an anchor link from the top of the page. (My site isn't published yet so I can't share the link, but I'm attaching a screenshot that shows the top of the page and the first section).

I realized that a page with 300 images is slow and takes a long time to load. I thought of creating a separate hidden page for each section, but don't want visitors to leave the main page to see each group. Looking for ideas to make this function better. Thank you!

On 10/14/2023 at 4:55 PM, gettinjenny said:

I am building a page for an "Alumni" group that has over 300 photos on it. I realized that a page with 300 images is slow and takes a long time to load. Looking for ideas to make this function better.

A workaround is to add them to a collection page instead of a standard "layout" page. It will take a little longer to input the details, but having added them, you'll have more control over loading and filtering the content.

If you're on Squarespace 7.1 (the latest version) then you'll probably want to create a hidden blog page and add each individual to the blog as a new post, adding their photo as the thumbnail. 

With some custom code (there's some pre-built here in a paid plugin called Lazy Summaries) and a Summary Block (in Grid mode) you can make it better by pulling the contents of the blog (the thumbnails and titles) onto a visible page and then lazy load it a few rows at a time (with a button or automatically). If you tag/categorise each post then you can also filter the results (using the built in method (with a link like /pageslug?category=categoryname) or with an advanced plugin like Universal Filter.

Did this help? Please give feedback by clicking an icon below  ⬇️