Event Calendar: Multiple images and buttons per event + 1 more feature! 🚀

Changelog New Feature
1

Big news for Event Calendar fans! :tada:

We’ve rolled out a set of highly requested updates to make your event cards more visual, informative, and action-ready!


What’s inside the update?

Multiple images per event

Events can now include several photos, giving visitors a clearer feel for the place, atmosphere, or setup before they attend:

  • Additional images can be uploaded in the Images section.
  • Extra images appear in the event popup.
  • Clickable images open in a lightbox, letting visitors browse the full gallery.

image
image331×932 22.1 KB
image
image319×921 11 KB

image
image1555×928 238 KB

image
image1602×933 111 KB


Multiple Action buttons & Add to Calendar

It’s now possible to add several Action buttons to a single event, along with the Add to Calendar button. You’ll find these options in the Action settings of the Event Details section.

image
image326×928 23.1 KB
image
image304×177 2.48 KB


Each button can be set as:

  • Primary — filled button style (only 1 button can be primary)
  • Secondary — transparent button style.
  • Colors for Primary and Secondary buttons can be customized separately in the Event section on the Style tab.

image
image623×550 72.9 KB
image
image331×478 7.99 KB
image
image623×925 134 KB

These options make it easier for visitors to take action right from the event card — RSVP, book a spot, open a link, or save the event to their calendar.


Have you tried these new features yet? How are you planning to use them on your site? Share your thoughts in the comments — we’d love to hear your feedback! :wink:


Back to Changelog →

2

I sync my events via Google calendar with attached images.Today, without making any changes, after the new feature annoucement, images are now cut off in both the full calendar view and when viewing an event’s details (desktop only, mobile looks OK). This was not an issue on Monday prior to this rollout. Can you please investigate, thank you for your support!

4

Hi there, @user23117 :waving_hand:

I deeply apologize for the inconvenience!

Our devs are aware of the issue with the image cropping in the popup. They’re working on the global fix now and I’ll update you once it’s released.

In the meantime, we’ve applied a temporary fix using this code in the Custom CSS field on the Style tab of your widget’s settings:


@external {
  .eapp-events-calendar-popup-item-media {
    max-height: 100%;
  }
}

Regarding the event cards, we haven’t made any changes to them. However, we’ve applied this CSS code to fix the image cropping in the Grid layout:

.eapp-events-calendar-grid-item-imageContainer {
  padding: 0;
  overflow: unset;
  height: auto;
}

.eapp-events-calendar-grid-item-imageContainer img {
  position: relative;
  aspect-ratio: 4 / 5;
}

If you’d like to completely fix image cropping, just remove this line aspect-ratio: 4 / 5;. In this case, the images will have different height.

image
image1920×1082 510 KB


For the Slider layout, the only solution is to use this code in the Custom CSS field on the Style tab of your widget’s settings:

.eapp-events-calendar-slider-item-imageContainer {
  height: auto;
  position: relative;
  inset: 0
}

.eapp-events-calendar-slider-item-component {
  height: fit-content;
}
5

This makes sense, thank you for the custom CSS and the quick response!

6

Hi there, @user23117!

Our devs released a global fix for the issue with popup images :tada:

7

Hi, I haven’t tried the new features yet and though they sound interesting, all the images I’ve previously uploaded to my events are now missing from our calendar. Is there a way to get them back without having to re-upload them individually?

8

Sadly this update broke all of the links which were on our past events which did not have a button, but the title was clickable. We use the past events as an archive to customers of work that we did and there are numerous links that we would need to reconnect some how without the ticket button. Can you please instruct how we can fix this easily? In the future, it would be great if we could opt into new changes or given fair warning beforehand with documentation on how to migrate to the updated version without breaking anything on our site.

9

Hi there, @DAS_Beer_Garden :waving_hand:

Apologies for the inconvenience!

We’ve fixed the issue and the images have been restored. Please check it out and let me know if everything is fine now :slightly_smiling_face:

10

Hi there, @Divo_Digital_Team :waving_hand:

As far as I understand, you added buttons with URLs to your upcoming events. Once those events became past events, you disabled the button control, but clicking the event name still redirected users to the button URL.

This was a wrong behavior, and it has now been fixed. That’s why event names no longer redirect to those URLs when the button control is disabled.

If you’d like to show past events without visible buttons, but still make the event names redirect to the button URLs, please try the following:

  • Keep the button control enabled and add the needed URLs.

  • Hide the buttons for past events by adding this code to the Custom CSS field on the Style tab of your widget’s settings:

.eapp-events-calendar-layout-past-events .eapp-events-calendar-list-item-button {
  display: none;
}

I hope this clarifies things! Please let me know if it helped or if you have any questions :slightly_smiling_face:

11

Thank you for the quick help on this! All looks great and I’m looking forward to checking out some of the other new features.

12

Awesome, thanks a lot for the feedback :blush:

13

All of my photos and buttons are GONE. I see notes saying that the images were restored but mine are not restored. Can this be fixed? I’m receiving tons of emails that no one can purchase my events.

14

My photos and buttons are not restored!

15

Hi there, @Mojo_Glassworks :waving_hand:

I am so sorry about this inconvenience!

We’ve fixed the issue in your widget. Please check it out and let me know if everything is fine now :slightly_smiling_face: