Paste the calendar into the product template
In your product template, add this where the calendar should appear:
<booking-calendar data-proxy="/apps/booking" data-product-id="gid://shopify/Product/{{ product.id }}"></booking-calendar>
<script src="/apps/booking/embed.js" defer></script>Add the embed script to theme.liquid
Add the same script tag to theme.liquid so the cart guard runs on the cart as well as the product page:
<script src="/apps/booking/embed.js" defer></script>Appearance is set in the app
The snippet only places the calendar. Colours, the book button, corner radius and other styling are configured centrally in the app under Appearance, not on the snippet.
Good to know
When should I use the snippet instead of the app block?
Use the snippet on vintage or Online Store 1.0 themes that do not support app blocks, or when you want to place the calendar by hand on any theme.
Do I need the embed script in two places?
Yes. Put it on the product template so the calendar loads, and in theme.liquid so the cart guard runs on the cart.