How do I add a ResoFlow widget to a WordPress site?
Copy the snippet from Settings → Website widgets, then paste it into a Custom HTML block for an in-page widget, or your theme's footer for a floating button on every page.
A ResoFlow widget is a single line of code, so adding one to WordPress is a copy-and-paste job. There is no ResoFlow plugin to install, and you don't need one.
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 if you already have a "Book a table" button you'd rather use.
- 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 WordPress
- One spot on one page or post (best for In your page): edit the page and add a Custom HTML block where the widget should appear, then paste the snippet in. Page builders have their own equivalent — Elementor's is an HTML widget — and any of them work, because all they do is output the code as-is.
- Every page (best for Floating button or Full-page takeover): paste the snippet into your theme's footer, just before the closing </body> tag. Most themes have a "footer code" or "scripts" box in their own settings; if yours doesn't, a small header-and-footer-scripts plugin does the same job safely.
Then view the live page while logged out or in a private window. Some caching and optimisation plugins serve a different version of the page to logged-in editors.
WordPress themes and page builders each name these boxes differently. The two concepts above — a Custom HTML block, and footer code before </body> — are the stable parts, and every theme supports them somehow.
Things worth knowing
- Use a Custom HTML block, not a paragraph. Pasting a script into ordinary text makes WordPress display the code as words instead of running it.
- Caching and "optimisation" plugins are the usual culprit. If the widget doesn't appear, clear your cache first. If a plugin defers or combines JavaScript, exclude widget.js from it.
- 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 Shopify site?