Add “Add to Calendar” for Event Calendar and Per-Event Embeddable Widget/Link

Description

We have an educational website that offers online Zoom modules as WooCommerce products. We want to enable users to:

  1. Globally: On the Events Calendar page (All modules listed), each individual event should include a visible Add to Calendar button (Google, Apple, Outlook, ICS).

  2. Per Event Embed: Ability to embed (or generate) only the “Add to Calendar” element for a single module/event, on any product or landing page (e.g., WooCommerce product for a module), without displaying the full calendar.

This feature will let users easily save event dates (even before purchase), and allow us to embed the “Add to Calendar” widget exactly where needed.

User Stories

  • As a visitor, I can add any upcoming module/workshop to my personal calendar directly from the global calendar view (so that I can plan my time and remember the event date when deciding whether to enroll)

  • As a visitor, I can add a specific module/workshop to my calendar from its product page via an embeddable widget.

  • As an editor, I can embed a per-event “Add to Calendar” component using a shortcode or JS snippet without developer help.

Acceptance Criteria

Global Calendar

  • Each event includes an Add to Calendar button/dropdown (Google, Apple, Outlook, ICS download).

  • Calendar event data must include: title, start/end (with timezone), Zoom link URL, short description, product page URL.

  • Works for both free and paid events.

  • No login or purchase required.

1 Like

Great to see you on our Community, @Ured_Konstelacije :waving_hand:

A huge thank you for such a detailed comment!

The thing is that the Add to Calendar button is already available in the widget, but can be displayed in the event popup only:


You can check it if you switch the action on click to View Event Details in Popup:

Do I get it right that you need to show the Add to Calendar button right in the event cards with an option to show/hide this button for each event?