HelenCrozier

This might be simple but I'm having trouble finding the answer
Whenever I add an item to a portfolio it gets added as the last item in the portfolio. I'm an artist and I want my newest work to show above not below. I know I can drag the thumbnails to rearrange but my portfolios get rather large but it seems cumbersome (also I suffer from Multiple Sclerosis and my fine motor control with my hands are bad). I could live with them being on the bottom of the stack in its list if I was able for the page itself to show the newer ones first and use lazy loading so that he new ones are first in memory/loaded

This is something that bothers me as well.  I reached out to SS a couple of months ago, and they advised it's not a feature we can change (yet) unfortunately.  I couldn't agree more, seems only logical that the last item added be on the top of the pile, no?  

Add to Code Injection > Footer
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script> <script> jQuery(document).ready(function($){ var texts = document.getElementsByClassName('gallery-caption-content'); $('.gallery-lightbox-list .gallery-lightbox-item').each(function(idx, ele){ var text = texts[idx] var id = $(ele).attr('data-slide-url') if (text) { $(ele).append('<p id="' + id + '" class="light-caption sqsrte-small">' + text.innerHTML + '</p>'); if ($(ele).attr('data-active')) { $(`#${id}`).css('visibility', 'visible') } } }) $('.gallery-masonry-lightbox-link').click(function() { var id = $(this).attr('href').split('=')[1] $('.light-caption').css('visibility', 'hidden') $(`#${id}`).css('visibility', 'visible') }) $('.gallery-lightbox').click(function() { $('.light-caption').css('visibility', 'hidden') var id = location.search.split('=')[1] $(`#${id}`).css('visibility', 'visible') }) }) </script> <style> figcaption.gallery-caption.gallery-caption-grid-masonry { display: none; } .light-caption { visibility: hidden; position: fixed; font: p2; font-family: source code pro; color:grey; font-size: 14px; bottom: 20px; left: 50%; transform: translateX(-50%); margin: 0; } .gallery-lightbox-item[data-active='true'] .light-caption { visibility: visible; } .gallery-lightbox-controls { display: flex !important; } </style>  

Add to Settings > Advanced > Code Injection > Footer
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script> <script> $(document).ready(function(){ $(".eventitem-pager-date").html(function() { return $(this).html().replace("Earlier", "Previous"); }); $(".eventitem-pager-date").html(function() { return $(this).html().replace("Later", "Next"); }); }); </script> <style> .eventitem-pager { margin-top: 0px; } </style>

Thanks so much - that explains it all!
 

Hey @HelenCrozier it's default video block loading, You can't change it. Try to add site preloader if You don't want to see these spaces.

Contributors with "Site Owner", "Administrator" or "Store Manager" receive automated email notifications from Squarespace about Orders and Donations. If you've added someone with these permissions, you cannot control whether they receive these emails. However, they can choose to enable or disable them on a site-by-site basis from their account page.
To do this, they can visit their profile page and then click on Notifications. There are options for each site they contribute to. For more information, see Editing your contributor profile.
 
  If this helps you, please click "Like" below  ⬇️

Site URL: https://www.turtlepictures.com.au/films/art-films
Hi I'm fine tuning a portfolio/print site and trying to get rid of the flashing on this page. It has three video blocks and when the page loads the captions appear with white space and then the thumbnails load afterwards.
I have tried various bits of code to turn off animations etc but am not winning and the client wants to get rid of it before going public....

This is the code I've added but it doesn't appear to have changed anything.
 
[data-section-id="6190b06ab5d8d65b6b28f9ae"] * {     transform: unset !important;     opacity: 1 !important;     transition-delay: unset !important;     transition: unset !important; } Appreciate any help thanks so much.

For the record here is another plugin. "Pinch Zoomer jQuery Plugin"
Not sure on how to integrate with Squarespace but it seems like it gets at the issue.
https://codecanyon.net/item/pinch-zoomer-jquery-plugin/6623080

Add to Home > Settings > Advanced > Code Injection > Footer
<script> document.querySelector('.header-title-logo a').setAttribute('href', 'https://beaverhero.com'); </script> replace beaverhero with your shop page url