EVENTS PAGE --- NEED to remove "times" from multi-day events

Site URL: https://www.genesisart.org/our-events

Client has "gallery" events which last several WEEKS. So "time" (unless it can be customized for every day) really doesn't work — and is confusing to viewers.

We're using the BRINE template (I think it's 7.1?) — and I DO already have a working code for "no hyphens." Just need to ADD CODE that removes the TIME from multi-day events...... HELP?? 🙂 

Also SqSp "Live Chat" seems to have gone away...... YIKES.  

Here's the code I've used (below).
And a screen shot (with times STILL showing). 

p, h1, h2, h3 {
  -webkit-hyphens: manual !important;
  -moz-hyphens: manual !important;
  -ms-hyphens: manual !important;
  hyphens: manual !important;
}h1 a, h2 a, h3 a, p a{border-bottom-style: none !important;}
h1 a, h2 a, h3 a{color: #d15e31}
.eventitem--multiday .eventitem-meta-time, .eventitem--multiday .eventitem-meta-date .event-date:after {
  display: none;
}

16 hours ago, bonjouryall said:

Client has "gallery" events which last several WEEKS. So "time" really doesn't work. We're using the BRINE template (I think it's 7.1?) — Just need to ADD CODE that removes the TIME from multi-day events

You're using a Brine-family template, on Squarespace 7.0.

To hide the times, you'll need to hide the time as well as the comma that appears between the date and time. Here's some CSS that you can add to Design > Custom CSS to hide both. The first section removes the comma; the second removes the time on multi-day events.

.event-list-time .eventlist-event--multiday .eventlist-meta-date .event-date:after {
    content: "";
}
.event-list-time .eventlist-event--multiday .eventlist-meta-time {
    display: none;
}

After adding the CSS:

We like to know if our posts help. Please consider clicking a 'Like' or 'Thanks' icon below  ⬇️

Hello, I have a site with multiple multi-day event pages. I want to hide the time on one of these pages only. The above code works great for me site wide but how do I successfully hide event times for one page only? I have tried inserting the code to page header code injection for that particular page to no avail. Please help and thank you.

2 minutes ago, earthwindflowermoon said:

I want to hide the time on one of these pages only.

Please post the URL for a page on your site where we can see your issue.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site. Please read the documentation at the link provided to understand how it works.

Please read the documentation at the link provided on how to share a link to your site to understand how it works. A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

We can then take a look at your issue.

Here is the site... https://tmtogether.squarespace.com/advanced-techniques

I would like times hidden here as well as when you click on the events listed on this page. Thanks!

To restrict the effect to an event page add #collection-630ab6721cc4e22a6b4ac6fe before lines beginning with .event-list-time. Like #630ab6721cc4e22a6b4ac6fe.event-list-time.

Let us know how it goes.

Thanks Creedon. I added this to custom CSS...

#collection-630ab6721cc4e22a6b4ac6fe
.event-list-time .eventlist-event--multiday .eventlist-meta-date .event-date:after {
    content: "";
}
#collection-630ab6721cc4e22a6b4ac6fe
.event-list-time .eventlist-event--multiday .eventlist-meta-time {
    display: none;
}

It made no change.

11 minutes ago, earthwindflowermoon said:

It made no change.

I revised my post. No space between the id and the first class name.

Perfect! Thank you so so much!!

It hid the times in the event listing on that page but now how to hide on the actual event itself?

2 hours ago, earthwindflowermoon said:

but now how to hide on the actual event itself?

Add the following to your current CSS wherever it may be.

.collection-630ab6721cc4e22a6b4ac6fe .eventitem--multiday .eventitem-meta-date .event-date::after {

  content : '';
  
  }

.collection-630ab6721cc4e22a6b4ac6fe .eventitem--multiday .eventitem-meta-time {

  display : none;
  
  }

This is for v7.1 and specific to the posters need.

Let us know how it goes.

Can this be adapted to just list a start time and not an end time? We'd like to use this for concert series, where the start time is the same for a weekend, and also has multiple locations.

https://www.salastina.org/concerts

41 minutes ago, MSalas said:

just list a start time and not an end time?

Add the following to Events Settings > Advanced > Page Header Code Injection for the events page. Please see per-page code injection.

<style>

  .eventlist-event .event-datetime-divider,
  .eventlist-event .event-time-12hr-end,
  .eventlist-event .event-time-24hr-end,
  .eventitem .event-datetime-divider,
  .eventitem .event-time-12hr-end,
  .eventitem .event-time-24hr-end
  
    {
    
      display : none;
      
      }
      
  </style>

This is for v7.0 using the Five template.

Let us know how it goes.

The 7.1 code worked for me. Thanks so much again 🙂

On 8/30/2022 at 11:47 AM, creedon said:

Add the following to Events Settings > Advanced > Page Header Code Injection for the events page. Please see per-page code injection.

<style>

  .eventlist-event .event-datetime-divider,
  .eventlist-event .event-time-12hr-end,
  .eventlist-event .event-time-24hr-end,
  .eventitem .event-datetime-divider,
  .eventitem .event-time-12hr-end,
  .eventitem .event-time-24hr-end
  
    {
    
      display : none;
      
      }
      
  </style>

This is for v7.0 using the Five template.

Let us know how it goes.

Thank you, that worked great!

Just now, MSalas said:

Thank you, that worked great!

Does anyone know if it's possible to have two locations listed for an event? In this case, Friday night is in West LA and Saturday night is Pasadena. Both have the same start time: https://www.salastina.org/concerts/2022/10/14/shostakovich-cycle

The workaround for now was to list the map in the body of the event.

1 hour ago, MSalas said:

The workaround for now was to list the map in the body of the event.

How about duplicating the event, change the date and location.

We were trying to keep it all within one event page since it looks cleaner than having duplicates. Thanks though!

On 2/5/2022 at 5:46 AM, paul2009 said:

You're using a Brine-family template, on Squarespace 7.0.

To hide the times, you'll need to hide the time as well as the comma that appears between the date and time. Here's some CSS that you can add to Design > Custom CSS to hide both. The first section removes the comma; the second removes the time on multi-day events.

.event-list-time .eventlist-event--multiday .eventlist-meta-date .event-date:after {
    content: "";
}
.event-list-time .eventlist-event--multiday .eventlist-meta-time {
    display: none;
}

After adding the CSS:

 

We like to know if our posts help. Please consider clicking a 'Like' or 'Thanks' icon below  ⬇️

Hello @paul2009. I'm trying to hide the time from events on a 7.1 site. I used this code to hide the time, but it leaves the commas behind:

.event-time-localized {
  display: none !important;
}

So I found your post and tried that code, but it didn't work. Is there different code for 7.1?

Also, is there a way to apply this to specific events. My client has single-day events with specific times but the multiday events don't. Thank you!

7 minutes ago, jackweinstein said:

I'm trying to hide the time from events on a 7.1 site.

What is the URL of the page?

https://shallot-octagon-t35z.squarespace.com/events/winter-wonderland

pw: GreaterFall

Thank you!

Hey all,

Following up on this. I too have a 7.1 site, and I was able to hide the times and commas for multi-day events on the event detail page but not on the event list page. Can someone help with that CSS?

Page is https://www.heroeslinked.org/events-1, third event down.

Thanks in advance!

On 2/15/2024 at 12:27 PM, jackweinstein said:

https://shallot-octagon-t35z.squarespace.com/events/winter-wonderland

pw: GreaterFall

Thank you!

Hey, @paul2009 Just wanted to follow up. Still trying to figure out how to hide the commas. Thanks!

3 hours ago, watts-creative said:

I was able to hide the times and commas for multi-day events on the event detail page but not on the event list page.

Please see the following.

Let us know how it goes.

@creedon Thanks for your reply. I read through the whole thread you posted, and while the following code got rid of the time for the Event list page, it left the commas. See screenshot.

span.eventlist-meta-time {
    display: none !important;
}

Someone actually followed up with this same issue about the commas on that thread, but then the conversation got derailed by a different request. I read through the whole thing twice and couldn't find the solution for removing the commas. Again, this is just for my multi-day events on the Events listing page...I've got it working on the Event detail page.

Thanks for your help!