mportch Posted April 1, 2023 Share Posted April 1, 2023 (edited) 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, 2023 by mportch Link to comment
Solution tuanphan Posted April 5, 2023 Solution Share Posted April 5, 2023 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> ghimpster and mportch 2 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
mportch Posted April 5, 2023 Author Share Posted April 5, 2023 Fantastic - that seems to work - thank you! Link to comment
mportch Posted May 23, 2023 Author Share Posted May 23, 2023 (edited) 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, 2023 by mportch Link to comment
tuanphan Posted May 25, 2023 Share Posted May 25, 2023 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> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
ghimpster Posted March 3 Share Posted March 3 On 4/5/2023 at 3:44 AM, tuanphan said: 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> Thank you very much. This worked like a charm! tuanphan 1 Link to comment
ByRaph Posted April 1 Share Posted April 1 On 4/5/2023 at 3:44 AM, tuanphan said: 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> This works thank you so much! Would you know of a way to just randomise it once? Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment