How do I add a ResoFlow widget to a Shopify site?

Copy the snippet from Settings → Website widgets, then paste it into your Shopify theme's theme.liquid for a site-wide floating button, or a Custom Liquid block for an in-page widget.

A ResoFlow widget is a single line of code, so adding one to Shopify is a copy-and-paste job. There is no ResoFlow app to install.

Only Owners and Admins can copy the snippet.

1. Get your snippet from ResoFlow

• Go to Settings → Website widgets.
• Pick the widget you want — Bookings, Gift cards, What's on, Menu, Loyalty join, Waitlist or the Everything widget.
• Choose a Display mode: Floating button, Full-page takeover, In your page, or Your own button to reuse a button your theme already has.
• In the Embed snippet card, click Copy.

The snippet looks like this:

<script src="https://resoflow.co.uk/widget.js" data-restaurant="your-restaurant-id" data-widget="book" data-mode="button" async defer></script>

2. Paste it into Shopify

• Every page (best for Floating button or Full-page takeover): edit your theme's code, open theme.liquid, and paste the snippet just before the closing </body> tag.
• One spot on one page (best for In your page): in the theme editor, add a Custom Liquid block to the page where you want the widget and paste the snippet into it.

Duplicate your theme before editing its code, so you can roll back instantly if anything looks wrong.

Shopify's admin wording shifts between themes and versions. The two concepts above — theme.liquid before </body>, and a Custom Liquid block — are the stable parts. If you can't find them, search Shopify's own help for "edit theme code" or "Custom Liquid".

Things worth knowing

• Shopify gift cards and ResoFlow gift cards are separate things. A ResoFlow gift card is spent at your venue and lives in ResoFlow; it is not a Shopify store credit and won't appear in Shopify's own gift-card list. If you sell both, make it obvious on your page which one a customer is buying.
• Checkout is ResoFlow's, not Shopify's. The widget takes payment through your own connected Stripe account, so these purchases never enter your Shopify cart, orders or reports.
• You never need to re-paste. Change text, colour, position or the display mode in ResoFlow and your site picks it up within a minute.
• Turn everything off in one place. The Show widgets on your website switch removes every ResoFlow widget from your site within a minute.
• Test it properly. The widget opens your real pages, so a test booking or purchase is a real one — cancel it afterwards if you make one.

Related: How do I add booking, gift card and other widgets to my own website? · How do I add a ResoFlow widget to a Squarespace site? · How do I add a ResoFlow widget to a Wix site? · How do I add a ResoFlow widget to a WordPress site?