Solved

Can you remove the "Add to calendar" link from Events pages?

  • 14 October 2021
  • 7 replies
  • 92 views

Badge

Hey gang,

We’ve set up the Zoom integration for our Community, so some elements of the Events page have become redundant. In particular:

  • The “Add to calendar” CTA is redundant since the calendar entry that is created doesn’t include the Zoom link
  • The “Link” is sometimes redundant, since all the information we provide is either on the page or in the confirmation email we send

Is there any way to remove these elements?

icon

Best answer by DannyPancratz 14 October 2021, 19:55

View original

7 replies

Userlevel 5
Badge +4

Two solutions for this: 

  1. Use CSS to hide that component (what we use now)
  2. Just use the Phrases editor to edit that phrase down to a single space. It still exists and can be found if you hover over the exact right spot, but they can’t find it. (This is what I did at a previous community for similar reasons)
Badge

Thanks @DannyPancratz that’s good advice. I don’t suppose you have the CSS to hand?

Ultimately I’d like to be able to define whether these elements appear or not in the backend. For an online event where a Zoom integration is in place, it doesn’t make sense. But for an in-person event it might be more relevant.

Userlevel 5
Badge +4

@Onomatopoeia turns out I misspoke. We’re not hiding it now on my new community. It’s just not visible on past events and we didn’t have any upcoming events when I answered this. So I unfortunately don’t have the CSS. 

But what I did at a previous company was use the phrases solution to change it to a single space. 

@Onomatopoeia you can just add this code to your Custom CSS to hide it:

 

a.event-detail__google_calendar_link { display: none;
}

 

Badge

Thank you so much @Scott Baldwin!

FYI once making the phrase available with support if you try to edit the phrase in the control it doesn't accept space BUT if you edit the phrase from the front-end toggle it DOES. 

FYI, if you’re using the new events beta, neither the old CSS trick nor the phrases will work anymore. The following custom CSS will now hide the calendar links:
 

/* Hide Calendar Links */
div.event-details__header_label { display: none;
}

 

Reply