I would like to hide dates of an events using CSS.

I want to know how to hide an event date (because I don't know exact day yet) or perhaps replace it with only a month - for example change from 1st of September to only September?

Here is a link to a website I'm building https://heron-gar-tw2b.squarespace.com/new-events

Cheers

I already managed to hide date and time from the event page using below code in page header code injection

Unfortunately it is still showing in summary block on my homepage. Anybody know how can I hide it from there as well?

@alexpanek Have you resolved yet? I don't see event date

hi @tuanphan, I have managed to hide it in the event page but it is still showing in the summary block on my homepage https://heron-gar-tw2b.squarespace.com/config/pagesWould you be able to help and hide it from there as well?

Cheers

@alexpanek where homepage? The link you sent can't access.

@tuanphan try this one https://www.imalondon.com/index?noredirect

Thanks

@alexpanek Add to Home > Design > Custom CSS

.summary-thumbnail-event-date {
   display: none !important;
}

Thanks amazing! Thank you very much @ tuanphanCould you also write a code if I wanted to display only month without specific date? (My client will probably ask me for this option too)

@alexpanek

/* Hide all */
.summary-thumbnail-event-date {
   display: none !important;
}
/* Hide MONTH */
span.summary-thumbnail-event-date-month {
   display: none !important;
}
/* Hide DATE */
span.summary-thumbnail-event-date-day {
   display: none !important;
}

If you want to hide date for specific event, it will difficult to you. Because you need to check the ID of that Event. If you don't know HTML / CSS, it's difficult to check that.

Thank you for your help @tuanphan

I will speak to my client and ask what else she needs but for now it's all good.

Hi @tuanphan, sorry to bother you again :)Would you be able to help me with one more thing regarding hiding the dates?I attached a screenshot explaining what dates I want to hide as well.

Thank you

@alexpanek screenshot too small. Not really understand what you mean.

@tuanphan Sorry for that, what I mean is when I click on the event on the homepage (summary block) new window with that particular event opens. On the bottom are shown earlier event (on the left) and later event (on the right) which you can click to check earlier/later events. The dates are shown and I would like to hide them.

https://heron-gar-tw2b.squarespace.com/config/pages

This screenshot should be better

@alexpanek Use this code

.collection-type-events .eventitem-pager-date {
   display: none;
}

Text "Later/Earlier" & Date in a HTML tag, so the CSS will hide both. If you don't want to hide Later/Earlier, please let me know, i will send other CSS.

Hi @tuanphan. Thank you for this, yes I would prefer to hide only the dates and leave later/earlier. Could you please send the code for this?Thank you very much for your help, you are the best!

@alexpanek

Remove above code, and use this

/* Hide all */
.collection-type-events .eventitem-pager-date {
   visibility: hidden;
}
/* Add text Earlier Event */
.eventitem-pager-older .eventitem-pager-date:before {
   visibility: visible;
   content: "Earlier Event:";
}
/* Add text Newer Event */
.eventitem-pager-newer .eventitem-pager-date:after {
   visibility: visible;
   content: "Newer Event:";
}

Good evening @tuanphan, hope you are well?Thank you so much for all your help so far. I'm afraid I've got one more favour to ask - I would like to make the newsletter form as white outline instead of solid background colour. Is there a code for that?I would be very grateful for your help again.

https://heron-gar-tw2b.squarespace.com/index/#/new-page-2

@alexpanek

.newsletter-form-wrapper {
   background: transparent !important;
   border: 5px solid #fff;
}

Amazing @tuanphan And now I just need to make the heading white and that will be absolutely perfect Could you do this last one for me please?

@silvabokis h2.newsletter-form-header-title { color: #fff !important; }

Thank you so much. The website is perfect now

Hi @tuanphan. Thank you once again, I think im good for know. My client will now review the website and we will go live. I will see how everything will run and if I need any more help I will definitely use your paid service. For now I will send you a donation for your help if that's ok?This was my first time I've built website and used squarespace forum so I'm only just learning how things works.

Have a great day Regards Alex

Hi @tuanphan. Hope you are well? Sorry for delay but I have sent you a small donation for your help. Best regards. Take care. Alex

hi there @tuanphan this is all very helpful! thank you! i was wondering if i can keep the event date icon but make this so you cant click on it. at the moment  i have a block next to my event that says the event dates, and this is automatically a link. and it links it to basically another page identical to the event so its pointless i was wondering if there was anyway round this? i would be happy to make it a link to a separate page i.e a page with the calendar on or disable it entirely as a clickable link would also work

thank you

14 hours ago, RunatitSHOUTING said:

hi there @tuanphan this is all very helpful! thank you! i was wondering if i can keep the event date icon but make this so you cant click on it. at the moment  i have a block next to my event that says the event dates, and this is automatically a link. and it links it to basically another page identical to the event so its pointless i was wondering if there was anyway round this? i would be happy to make it a link to a separate page i.e a page with the calendar on or disable it entirely as a clickable link would also work

 

thank you

Can you share link to event page on your site?