A small integration.
A world of possibility.

Right at home in your store.

Add browser tools to your existing theme. The download includes a manual theme installation and a theme app extension for your own Shopify app project.

1. Create a partner account, attach your customer-facing storefront domain, and verify its DNS record.
2. Download the theme package. In a duplicate theme, upload mitte.js and mitte-shopify.js from the assets directory to your theme’s Assets.
3. Create snippets/mitte-partners.liquid using the supplied snippet. Replace YOUR_SITE_ID with your site ID.
4. Add the line below before the closing body tag in layout/theme.liquid. Preview the theme and test product search.
5. Enable cart assistance or checkout handoff in the portal when ready, then reload your storefront.

{% render 'mitte-partners' %}

Already have a Shopify app? Copy the supplied theme extension into that project and deploy it through your normal Shopify workflow. This download is a direct installation; it is not a Shopify App Store listing.

To populate your custom Mitte app, import your catalog or use the server SDK. Never put a server API key in a theme. Root discovery files require additional merchant routing.

A familiar way to connect.

Install the plugin, paste your site ID, and connect your native WooCommerce products, basket and checkout.

1. Use WordPress with WooCommerce, PHP 8 or newer, and pretty permalinks enabled. Start on a staging copy of your store.
2. Download the ZIP. Open Plugins → Add New → Upload Plugin, select it, and activate.
3. Go to Settings → Mitte Partners. Enter your site ID and the portal origin.
4. Verify your domain in the portal and choose your permissions. Native search is now available through the browser integration.
5. To fill your custom app’s catalog, verify your account email, create a server API key, save it in the plugin settings, and choose “Sync published products”.

The plugin keeps the server key private, uses the customer’s native cart session, and requests confirmation before cart changes. Catalog sync replaces up to 1,000 products; prices in the custom app reflect the last sync.

A component. A connection.

Download the SDK package, install it locally, and render the client wrapper once in your merchant layout.

npm install ./mitte-partners-sdk-0.1.0.tgz

'use client';
import { MittePartner } from '@mitte/partners/next';

export default function PartnerTools() {
  return (
    <MittePartner
      siteId="YOUR_SITE_ID"
      portalOrigin="https://partners.mitte.si"
      onError={(error) => console.error(error)}
    />
  );
}

The wrapper connects catalog search and cleans up when it unmounts. Supply stable, memoized merchant handlers for cart and checkout. The package README includes real App Router routes for AWP and W2A discovery. The package is downloadable here; it has not been published to npm.

Works with the website you have.

Paste this before your closing body tag, replacing the site ID. The default search uses the catalog you import into Mitte.

<script src="https://partners.mitte.si/sdk/mitte.js"></script>
<script>
  MittePartners.connect({
    siteId: 'YOUR_SITE_ID',
    portalOrigin: 'https://partners.mitte.si'
  }).catch(console.error);
</script>

To use your own live catalog and cart, pass handlers that reuse your existing store logic. Your server still validates the customer’s session, product price and stock. Keep all secret API keys on the server.

const client = await MittePartners.connect({
  siteId: 'YOUR_SITE_ID',
  portalOrigin: 'https://partners.mitte.si',
  handlers: {
    search: async ({ query }, { signal }) => {
      const response = await fetch(
        '/api/products?q=' + encodeURIComponent(query),
        { signal }
      );
      if (!response.ok) throw new Error('Search unavailable');
      return response.json();
    }
  }
});

const results = await client.search('linen');
// Call client.disconnect() when this view is removed.

WebMCP tools register when supported by the browser. Regular SDK methods also work without WebMCP. Cart and checkout need explicit handlers, permission and customer confirmation.

Your stack. The same ecosystem.

Use a site-scoped catalog key from a trusted server. Catalog replacement is atomic and supports up to 1,000 products. Prices use integer minor units: 2400 means €24.00.

import { createPartnerClient } from '@mitte/partners/server';

const partner = createPartnerClient({
  siteId: process.env.MITTE_SITE_ID,
  portalOrigin: process.env.MITTE_PORTAL_ORIGIN,
  apiKey: process.env.MITTE_CATALOG_KEY
});

await partner.replaceCatalog([{
  id: 'mug-01',
  title: 'Everyday mug',
  description: 'Made for slow mornings.',
  price: 2400, currency: 'EUR', available: true,
  url: 'https://your-store.com/products/mug'
}]);

Use the same contract with any HTTP client:

PUT /api/partners/sites/YOUR_SITE_ID/products
Authorization: Bearer YOUR_SERVER_KEY
Content-Type: application/json

{ "products": [ /* your mapped products */ ] }

Product links must belong to the attached HTTPS origin. API keys can read and replace that site’s catalog and record attributed commerce events. They cannot read private reports, change permissions, manage your account or charge a customer. Rotate or revoke keys in your workspace.

Connect your commerce insights

Record intent signals and confirmed order events from your merchant server to populate revenue, demand and customer-cohort reports. Preserve event IDs across retries and use your own verified order records to establish Mitte attribution.

await partner.recordEvents([{
  id: 'order-event-123',
  kind: 'order.completed',
  occurredAt: new Date().toISOString(),
  attribution: 'mitte',
  orderId: 'your-order-123',
  sessionId: 'verified-mitte-referral',
  customerId: 'opaque-customer-id',
  intent: 'gifting',
  amountMinor: 4800,
  currency: 'EUR'
}]);

Browser observers can describe intent, cart changes and checkout starts. Completed orders, refunds and fulfilment must come from your trusted server. Read the analytics guide.