Display multiple dates for same event

Site URL: https://porcupine-bird-ax5f.squarespace.com

*site password is handtasteferments*

Hi, I am building a site for my client that will host a number of "pop-up" food events every month, some of which are on multiple days, i.e. Friday July 31st and Saturday August 1st. Always at the same time (i.e. 5-8pm) and with the exact same content (location, menu, sign up, etc). Right now I can only select a start date and an end date, but then the event looks like it goes from July 31 at 5pm to August 1 at 9pm. I display events on both the homepage as a summary block (with date and time as meta data below the content) and of course on the actual event listing and detail pages. I'm looking for a way to include both days so instead of July 31 - August 1 it says "July 31 & August 1". I've already used CSS to remove the little tag date that was showing up on the thumbnail so it's just the text itself. Thanks for any help!

Hi there

You can try this snippet, add it into Advanced-> Custom code injection

document.addEventListener("DOMContentLoaded", function(event) { 
  document.querySelectorAll(".summary-metadata-item.summary-metadata-item--date").forEach(function(el) {
        var modified = el.innerText.replace("–", "&");
        el.innerText = modified;
    });
});

Hi @bangank36, thanks so much for your reply. 

However, I've tried injecting that code into both the header and the footer blocks and it just...shows up as text either in the header or the footer - see attached. Could you please advise on next steps? Am I doing something wrong here? 

thanks again!

Wrap the snippet between the tags <script> </script>

Thanks, again. However, this only seems to update the summary block on the homepage - it doesn't do anything to the event listings page or the event details page. Is there something I can do to make this update "globally"? 

Hey @bangank36 I would really appreciate your input here, again. the code you provided is working on the homepage summary, but the event page and details pages still looks terrible and inaccurate. Thanks so much!

Hi, just following up here for anyone to assist. The code above works for the main summary page, but not the event detail pages. 

@tuanphanany advice on this?  I would love to do this on a food truck website I’m proposing next week.  Thanks!!  

I guess there's been no improvement from Squarespace on this?

We've been living with this problem for years. What we do is make sure that each of our event descriptions and excerpts leads with text giving the actual date and time, e.g., Saturday Oct 30 and Saturday Nov 6, 2021, 10 am to 4 pm.  I believe that over time we have actually trained our clientele to recognize and subliminally adjust for Squarespace event date anomalies. 😁

A worse problem, as I see it, is that a disjointed event date span, like the one above, makes a mess when displayed in the calendar format, because it shows the event on every single day in the intervening week. We finally just gave up trying to display a calendar of events on our Squarespace site.

Has anyone found a solution to this? generally the events have just a single day between them but as I am using a event calendar it doesn't make sense on the calendar! 

It would be nice to be able to display multiple dates with varying times for the same event. I am also running into the same issue with my multi-series workshop event.

@tuanphancan you please provide some guidance or advice?

Can you share your URL so I can take a look?