Images to appear in random order?

mportch · April 1

Hi,

Would there be any way to code this page so the images appeared in random order each time a person visited the site?

Thanks in advance.

https://smilodon-ocelot-my5f.squarespace.com

Edited April 1 by mportch

tuanphan · April 5

Try adding to Settings > Advanced > Code Injection > Footer

<script>
document.addEventListener('DOMContentLoaded', function() {
    const productGrid = document.querySelector('.gallery-masonry .gallery-masonry-wrapper');
    if (productGrid) {
        var productItems = productGrid.querySelectorAll('figure');
        for (var i = productItems.length; i >= 0; i--) {
            productGrid.appendChild(productItems[Math.random() * i | 0]);
        }
    }
});
</script>

mportch · April 5

Fantastic - that seems to work - thank you!

mportch · May 23

Hi,

The images on DESKTOP version still click to a new window. But they no longer click to a new window on MOBILE version. Do you know how to fix this?

https://smilodon-ocelot-my5f.squarespace.com/gallery

Edited May 23 by mportch

tuanphan · May 25

On 5/23/2023 at 5:16 PM, mportch said:

Hi,

The images on DESKTOP version still click to a new window. But they no longer click to a new window on MOBILE version. Do you know how to fix this?

https://smilodon-ocelot-my5f.squarespace.com/gallery

You have this code in Code Injection or Page Header, it disabled click event

 <style>
            @media screen and (max-width: 767px) {
                #page .gallery a {
                    pointer-events: none;
                }
            </style>

Images to appear in random order?

Recommended Posts

mportch

Link to comment

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Popular Posts

tuanphan

tuanphan

Link to comment

mportch

Link to comment

mportch

Link to comment

tuanphan

Link to comment

Create an account or sign in to comment

tuanphan

Resources

Squarespace Webinars

Hire a Designer

Support

Community

Developers

Resources