Add ordering to SvelteKit

Last updated 2026-07-14

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

In SvelteKit, render the container div in your page markup and load the script from svelte:head:

src/routes/order/+page.svelte

<svelte:head>
  <script src="https://order.delitero.com/embed.js" defer></script>
</svelte:head>

<div data-delitero-restaurant="your-restaurant" style="height: 640px; max-width: 480px"></div>

On client-side navigation the script is already loaded, so a container that appears later needs a manual mount. Mounting is idempotent, so calling it defensively is fine:

Same page, script block

import { onMount } from 'svelte'

onMount(() => {
  const el = document.querySelector('[data-delitero-restaurant]')
  if (el) window.Delitero?.mount(el)
})

Works everywhere, or the link does

Whatever your website can or cannot embed, the hosted ordering page always works as a plain link. Sizing, isolation guarantees, and single-page-app notes are on the Add ordering to your site overview.