Customization of Event Calendar button

Thanks Max for the response! Okay sorry to be a challenge on this one but that makes the grid rows to match the size of the largest text-based item. Is there a way of making it consistent like 150px in height? I tried that but then some of them get cut off.

2 Likes

In this case, only the part of the long descriptions will be displayed. Do you want to show ellipses after the last word displayed?

1 Like

That would be totally fine!

2 Likes

Okay!

I’ve shared your request with the dev team. I’ll report back as soon as the code is ready :slightly_smiling_face:

1 Like

Hi @toby_mathew :wave:

Thank you for waiting!

To implement this idea, the descriptions of all events should have the same format. Here is an example of the format you can use:

<p>
  description goes here
</p>
<!-- The button needs to be in a separate container from the description -->
<a href="https://ctphilanthropy.site-ym.com/events/eventdetails.aspx?id=1918130">Register</a>`

The format should be adjusted in the Code Editor mode of the Description:

Once it’s done, please ad this code to the Custom CSS field:

.eapp-events-calendar-list-item-description > div > p {
  max-height: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box !important;
  -webkit-line-clamp: 8;
  -webkit-box-orient: vertical;
}

Check it out and let me know if it helped :slightly_smiling_face:

1 Like

Hey @Max,

This is super odd, but it seems like all of a sudden, my button feature disappeared: https://ctphilanthropy.org/page/calendar Take a look at the register text on this: I didn’t change anything on the css code so not sure what happened.

1 Like

Hi there, @toby_mathew :waving_hand:

Please let me look into this with the devs. I’ll get back to you once I have their response :slightly_smiling_face:

1 Like

Thank you for waiting!

The issue has been addressed. Please check it out and let me know if the button looks fine now :slightly_smiling_face:

Sorry for the late response Max but wanted to update you that it does look great again - thank you!!

1 Like

Perfect, thanks for letting me know!

If anything else comes up, we’re always here to help :wink: