Remove time from Events?

How can I remove the time from individual events, such as with all-day events? I don't want all events to have times listed, but some should.

Nothing in the Event module settings, nothing in the event item or options, can't delete the times manually. Nothing via Answers or Google search.

Hi Steve, I emailed support about the same issue, and the short answer is that it's not possible. I'll include the pertinent text below, in chronological order:

Me: Hi,

I'm working on xyz.com. I am listing theater productions, and multiple performances (at different times) need to go in the same event. Since there isn't a way to enter multiple times, is there a way for it not to show the times? (Or better yet, not even the dates)? I can't find a way to unselect the times.

Thanks for any help you can provide!

SS:Hi there,

Happy to help here! There is currently no default feature available to do this in the Squarespace 6 platform, however I will submit a feature request for you to our developers so we can explore possible solutions for this. I apologize for any inconveniences here.

In the meantime, you are able to select what information is visible within your events page here in your Style Editor:

http://screencast.com/t/isVRab33FkG

We have a great guide for making Style changes here:

http://help.squarespace.com/customer/portal/articles/438114

Does this help? Please let us know if you have any more questions. We are always happy to help!

ME:

Thanks for submitting to the developers. I know how to show certain aspects of the event in style editor, but if you look you'll see that doesn't address the question I asked.

SS: Hey,

I apologize if there was any confusion.

As Justin stated, we aren't really able to offer this as a feature right now. Another option you have is to use something like Google Calendar within your site. You can embed the code for this within a Code Block and it may help you achieve your goal depending on their features. You can take a look at their site here:

https://support.google.com/calendar/answer/41207?hl=en

We also have a guide for using our Code Block here:

http://help.squarespace.com/customer/portal/articles/437955

Let us know if you have any other questions -- thanks!

ME:Thanks for this google option! To clarify, I understood Justin's reply--that's why I thanked him for passing it along to the developers. :) I was just confused as to why he then offered the info below, when it was already apparent that what I needed wasn't an option.

Thanks again!

Thanks for that info! I'll take a look at the linked info; maybe something in the template styles can be tweaked a bit to achieve what I'm looking for, or maybe removing the time entirely and just adding it to relevant posts.

Any update on this feature request? The ability to toggle an all day event would handle this as well. Not sure if there's a way to hide it using custom CSS.

Mixtus,That worked perfectly. Thank you!

EDIT: This is a method to remove a single time from an events list without removing all times from the list. This is not how you would hide the time from all events.

I believe I have this solved (somewhat), however, it requires jQuery. It works by using a "unique" time to target and then add a custom class to it. Then, we hide that class and thus, hide the time. The custom time I've used is 1:23am -- so any event you want to hide the time on, you set the start time to that value. Unfortunately, if you have an event that starts at that exact time, this won't work.

This is for the FIVE template, I'm not positive if it works for other templates.

To install jQuery to your site, go to 'Manage Site' (gear icon) > 'Settings' > 'Code Injection' and paste this into the 'Header'

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

Next, go to your Events page, and go to 'Events Settings' > 'Advanced' and paste this into the 'Page Header Code Injection'

<script>
$( document ).ready(function() {
 $('.eventlist-meta-time:contains("1:23am")').addClass('hideTime');
});
</script>

Lastly, go to your Custom CSS section, and paste this:

.hideTime { display: none !important; }

Now, as I mentioned above, in order for this to work, the event start time must match the value in the 'contains(" ") -- this can be changed to whatever time you want, but make sure you set the times of the events to match.

Another thing to consider is that the time might show up in other places -- I have turned off the 'Event Date Label Time' in the 'Style Editor' (under 'Event Styles').

Another place where the time will show up is in the 'Calendar block' -- I decided to hide this for all events (aesthetically, I prefer them hidden) -- to do this, you would add this to your custom CSS:

.sqs-block.calendar-block .yui3-calendar-day .event-menu .event-time-group .event-time { display: none; }

This isn't a perfect solution, obviously, and I hope SQSP adds a 'hide time' and 'all day' event options -- as well as 'repeating events'.

Not sure why I was down voted -- perhaps because I didn't specify that this was to remove a single time from the events lists without removing all times.

What I did on mine was removed all the time using CSS, then manually added time to the ones I wanted.

<style>
.event-time-12hr {display: none !important}
</style>

Then, for the ones that you want time to be shown, put it in the title. Here’s an example:

Title Goes Here <br> 10:10AM

The HTML tag <br> is a break which puts the time on a line underneath the Title.

I am trying to get this to work in my calendar view, but can't for the life of me get it to work. Any thoughts on what I am doing wrong: https://stpeter--stjohn.squarespace.com/calendar/?view=calendar&month=July-2014

Thank you! This worked, then I added a bit to get the date to not appear in the description too:

<style>
.eventlist-meta-time,
.eventlist-meta-date { display: none !important }
</style>

To remove the time and date from one event item you can use this code in teh custom CSS editor:

.eventitem-meta-time,
.eventitem-meta-date { display: none !important; }

This was incredibly helpful! Thank you!!!

This is all so helpful. Anyone know how to change the styling for event-location?

This works great, but the time still appears in a summary display I have elsewhere on the site. I used your 1:23AM option, so it looks odd in this summary view that some events appear to begin at 1:23. Any way of making certain times invisible in the summary module?

This is too sophisticated for me. I don't know what Custom CSS code means, or what the Five template is, or how to get to the place to do this. More details please?

@Mixtus thank you. That removed the time from the event list but it still shows in the detail page when you click on the photo. Any suggestions to fix that?

Are there any updates for this?
I have multiple events that are spanning multiple days and I just want to remove the time from all event posts. Right now I have sticky CSS applied to the sidebar section (shown below) and I am wondering if that is interfering with the code I am trying to apply. I'd also like to remove the "Back to All Events" link on all event pages. If none of this is possible can I change the layout of the event page instead? I'd rather it display as a grid than a list. Or maybe there is some kind of plugin. ANY HELP IS APPRECIATED. @tuanphan ?

CODE FOR STICKY SIDEBAR EVENT INFO: 

/*sticky sidebar event info*/
.eventitem-title {position:sticky!important; top: 20vh!important}

.eventitem-meta{position:sticky!important; top: 30vh!important}

.event-meta-addtocalendar-container.eventitem-meta{position: sticky!important; top: 38vh!important}

/*event calendar buttons*/
/*this code removes the divider line*/
.eventlist-meta-export-divider, .eventitem-meta-export-divider, 
 [data-content-field="categories"]{
 display:none
}
/*this code adds some space to the top*/ 
.eventlist-meta-export {margin-top:2rem!important}

/*this code is for the Google link*/
.eventlist-meta-export-google, .eventitem-meta-export-google{
 background:#D7D8DA; 
 padding: .35rem; 
 border-radius:.25rem 
} 
 .eventlist-meta-export-google:hover, 
.eventitem-meta-export-google:hover{ 
 background:#efefef; 
}
/*this code is for the iCal link*/
.eventlist-meta-export-ical, .eventitem-meta-export-ical{
 background:#D7D8DA; 
 padding: .35rem; 
 border-radius:.25rem; 
} 
 .eventlist-meta-export-ical:hover, 
.eventitem-meta-export-ical:hover{
 background:#efefef; 
}

THIS IS THE CODE I'VE USED TO REMOVE THE TIME DETAILS (not working): 

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

Please see the following.

Let us know how it goes.