Menu

How do I embed a calendar widget in Shopify?

Last updated August 12, 2026

AddEvent's embeddable calendar widget works in Shopify - add it to any page using a Custom HTML block in the Shopify theme editor or a Liquid template section.

Method 1: Custom HTML block (simplest)

  1. In your AddEvent dashboard, go to your calendar's Sharing options and copy the Embeddable Calendar code snippet
  2. In Shopify admin, go to Online Store → Pages (or Themes → Customize for the homepage)
  3. Add a Custom HTML section or block to the page
  4. Paste the AddEvent embed code into the HTML block
  5. Save and preview

Method 2: Liquid template (for developers)

Add the AddEvent embed code directly into a .liquid template file in your Shopify theme: `liquid <div class="ae-emd-cal" data-calendar="{{ section.settings.calendar_id }}"></div> <script type="text/javascript"> (function(){var e=document.createElement("script");e.type="text/javascript"; e.async=true;e.src="https://www.addevent.com/js/cal.embed.t1.init.js"; e.className="ae-emd-script";document.getElementsByTagName("body")[0].appendChild(e);})(); </script> ` Make calendar_id a theme setting so it can be configured without touching code.

What the widget does on your Shopify store

The embedded calendar displays your upcoming events in month, week, or list view. Visitors can add individual events to Google Calendar, Apple Calendar, or Outlook with one click, and subscribe to your calendar so future events automatically appear in their personal calendar app.

Use cases for Shopify stores

  • Product launch events and drop dates for your customers to save
  • In-store events, pop-ups, and workshops
  • Live shopping sessions and webinars
  • Loyalty or VIP customer events

Shopify and Add to Calendar buttons

For individual product launch events or flash sales, AddEvent also generates a simple Add to Calendar button or link you can add to any product page, collection page, or email using a Custom HTML block or Liquid snippet.

← Back to Integrations & API