Add ordering to your site

Last updated 2026-07-14

Delitero is launching soon. Join the waitlist and we will email you when it opens.

Paste this snippet into your website where the menu should appear, replace your-restaurant with your ordering page address, and the full ordering flow renders there: menu, cart, checkout, and confirmation, inside your own page on your own domain.

<div data-delitero-restaurant="your-restaurant" style="height: 640px; max-width: 480px"></div>
<script src="https://order.delitero.com/embed.js" defer></script>

The exact snippet for your restaurant, address already filled in, is in your admin Settings under "Add ordering to your website". It works on any site that accepts custom HTML with scripts.

Guides per platform

If your platform is not listed, the plain HTML guide applies almost everywhere: find where your builder lets you paste custom HTML and put the snippet there. And the hosted ordering page at order.delitero.com/your-restaurant always works as a plain link, whatever your website can or cannot embed.

Sizing the widget

The widget fills its container and scrolls internally, so the container's height and max-width are yours to choose. 640 by 480 pixels is a good default; a taller container shows more of the menu at once. Multiple widgets on one page work, and each container mounts once.

It will not fight your site

  • Your styles cannot break it, and it cannot leak into your page. The widget renders in an isolated shadow root: your CSS never reaches widget internals, and widget CSS never touches your site.
  • It stays light. The widget is pinned to a light appearance so a dark site theme or OS dark mode cannot make the menu unreadable.
  • Payments are Stripe's. The checkout inside the widget is the Stripe Payment Element running against your own Stripe account. Card details go to Stripe, never to your website or to Delitero.

Single-page apps and late-inserted containers

The script mounts every data-delitero-restaurant container it finds at load. If your site inserts the container after load (a single-page app, a page builder preview), mount it yourself:

JavaScript
window.Delitero.mount(document.querySelector('#my-container'))

Redirect-based payment methods

Cards confirm inside the widget without leaving your page. Payment methods that redirect return the customer to your page with delitero_order and delitero_slug added to the URL; the widget reads them on load and resumes at the confirmation step. Nothing to configure, but do not strip query parameters from the page the widget lives on.