Jump to content

alicroft

Circle Member
  • Posts

    62
  • Joined

  • Last visited

  • Days Won

    1

Reputation Activity

  1. Like
    alicroft got a reaction from Beyondspace in Code to display date/time a page within an Index was last modified?   
    @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!
  2. Like
    alicroft reacted to jenniferboddam in Gallery - can't rearrange images or add descriptions   
    Its literally faster for me to delete all my images and re upload them in the exact order I want, it just wont let me rearrange at all i move one and the rest get shuffled. It's driving me crazy. I'm going to put a ticket it to let them know but it probably wont be fixed any time soon.
    7.1 has grown on me but so many things make the work flow sooo unbelievably slow its frustrating.
  3. Like
    alicroft reacted to paul2009 in Automatically display text when summary block is empty   
    To be clear, the code won't work in the page header injection of either of these if you have Ajax enabled.
    (Note that Ajax is never enabled when you are logged on to a site! This makes it appear to work whilst logged on, but as soon as you hand over a site and the client tries it, they'll find it doesn't work 😫) 
    If further checks are added to the code to identify the collection or URL it can then be inserted in the Footer Injection and it will play nice with Ajax 🙂.
  4. Like
    alicroft reacted to paul2009 in Automatically display text when summary block is empty   
    I wrote a guide that may help you to understand how Ajax affects JavaScript on Squarespace:
    https://sf.digital/squarespace-solutions/why-doesnt-my-code-work-until-i-refresh-the-page
  5. Like
    alicroft got a reaction from paul2009 in Automatically display text when summary block is empty   
    Understood, thank you for clarifying! 
  6. Like
    alicroft reacted to paul2009 in Automatically display text when summary block is empty   
    Hi @alicroft
    The solution that I provided in March 2018 is now out of date. A newer version is as follows:
    Add a Code Block just above or just below the Summary Block. Add the following to the Code Block. The first line will create an empty div element with a class of ‘no-events’. When the Summary Block contains events, this div will not be seen because it will be empty.
    <div id="no-events"></div> <script> window.addEventListener('DOMContentLoaded', (event) => { var summaryExists = document.getElementsByClassName("summary-title")[0]; if (summaryExists == null) {  document.getElementById('no-events').innerHTML = "There are no upcoming events at this location."; } });  </script> The remaining lines contain JavaScript that checks if Summary Block content exists on the page. If there is no content (because the events are in the past), some text is added within the empty div so that users see a message. You can edit the message to suit your needs.
    Note: This is designed for use on pages where there is only one Summary Block. It will not work on pages containing more than one Summary Block.
    Did this help? Please give feedback by clicking an icon below  ⬇️
  7. Like
    alicroft got a reaction from brandon in Code to display date/time a page within an Index was last modified?   
    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!
  8. Like
    alicroft reacted to brandon in 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.
  9. Like
    alicroft got a reaction from brandon in Code to display date/time a page within an Index was last modified?   
    I have a sticky "Last Updated on /Date/ at /Time/" div that I've custom-coded to appear on particular pages of a client's website. Currently, the client needs to go in to the custom code and manually enter the Date and Time whenever they update the page's content.
    Is it possible to code this so the date and time automatically update whenever the client makes an edit to the page? There are multiple Indexes that will each need their own unique "updated at" box. It's important for the box to be sticky, visible no matter where you are on the page, because the content that gets updated is long; we want to ensure the user doesn't miss the "updated at" date and time.
     
    Page example w/ current sticky block:
    https://veil-test-1.squarespace.com/rva-sa pass: test2019
    The code is currently located in the PAGE HEADER CODE INJECTION of the Index Settings, and styled with custom css. I'm open to changing the whole set up if I can make it so the client doesn't have to get into the code at all!

    Thanks in advance for any and all ideas!

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.