Code to display date/time a page within an Index was last modified?

Hey @alicroft.

This can be done. It requires a short bit of JavaScript to look for the "updated-at" div, query the page's JSON data, find the latest updated collection for the page (or series of pages in the index page), format the date to your liking, and then write the HTML to the "updated-at" div accordingly.

I'd guess it'd take a good dev. and hour or two to write and test an efficient and resilient script to do that (the first half hour to get the "gist" done, then maybe another hour to mess with time formatting, which takes a bit of time without using 3rd-party libs).

So yes, it's possible. Having taken a quick look, I think it could be done without you having to refactor your code at all. You could leave it as you have it on the pages you want it to appear, and the code could be set to run on those pages. If you want more info or help, say the word.

Thanks so much, @brandon! This is super helpful. I'm going to reach out to my more-experienced-than-me dev friend to see if he can assist in implementing, and if he can't, I'm going to hit you up!

@alicroft

I know I'm super late to the party on this post, but... did you figure this out? And if so, would you be able to share the coding?

I'm looking to do something very similar.

2 hours ago, Robilanyo said:

@alicroft

I know I'm super late to the party on this post, but... did you figure this out? And if so, would you be able to share the coding?

I'm looking to do something very similar.

add the json parameter to your url and read the json data as such

https://dawidbania.com/joanna-wojciech-weddingday?format=json-pretty

Official document

View JSON Data — Squarespace Developers

@Robilanyo Here's what my developer came up with, and it seems to be holding up. Note this was all done on 7.0. Live page with the below code: https://www.theveilbrewing.com/rva-sa

#1 "Enable Ajax Loading" must be turned off for this to work. Located in:

Design> Site Styles > Site: Loading

#2 Code to be inserted into the Page header, located in:

Page > Settings > Advanced > PAGE HEADER CODE INJECTION

<script defer>
window.Squarespace.onInitialize(Y, function(){
  function addZero(i) {
    i = i < 10 ? "0" + i : i;
    return i;
  }

  function calcUpdatedTime(customDate) {
    const date2 = new Date(customDate);
    const displayDate = (date2.getMonth() + 1) + '/' + date2.getDate() + '/' + date2.getFullYear();
    const displayPM = date2.getHours() > 11 ? 'PM' : 'AM';
    const displayMinutes = addZero(date2.getMinutes());
    let displayHours = date2.getHours() > 12 ? (date2.getHours() - 12) : date2.getHours();
    if(date2.getHours() == 0) displayHours = 12;
    const displayTime = displayHours + ':' + displayMinutes + displayPM;

    return "UPDATED:<br />" + displayDate + "<br />@ " + displayTime;
  }

  function createUpdateLinkDiv() {
    updatedDiv = document.createElement('div');
    updatedDiv.setAttribute("id", "updated-at");
    updatedLink = document.createElement('a');
    updatedLink.setAttribute("id", "updated-link");
    updatedLink.setAttribute("href", "#rva-sa-update-note");
    updatedDiv.append(updatedLink);
    document.body.appendChild(updatedDiv);
  }

  let myHeaders = new Headers();
  myHeaders.append('pragma', 'no-cache');
  myHeaders.append('cache-control', 'no-cache');

  const myInit = {
    method: 'GET',
    headers: myHeaders,
  };

  const url = window.location.href.replace(location.hash,"") + "/?format=json-pretty";
  fetch(url, myInit)
  .then((resp) => resp.json())
  .then(function(data) {
    let recentUpdate = 0;
    const collections = data.collection.collections;
    for ( var i = 0; i < collections.length; i++ ) {

      if(collections[i].urlId.indexOf('beer-list') > -1){
        recentUpdate = collections[i].updatedOn;
      }
    }
    createUpdateLinkDiv();
    document.getElementById("updated-link").innerHTML = calcUpdatedTime(recentUpdate);

  })
  .catch(function(error) {
    // If there is any error you will catch it here
  });
});
</script>

#3 You can style the box by targeting #updated-at in your css here:
Design > Custom CSS 

Let me know if you have any questions, I will try to help!