Every AI banner, live on one page

The AI banners, running on this page right now

Nothing here is a screenshot. Every banner below is the live sommelier.bot widget reading this page and this visitor, with the exact line of code that produced it printed underneath.

Start your free month Try the live demo shop

One line of code · any CMS · no developer · the demo catalogue is our own

Live: this banner is reading the page you are on

How to read this page

A working demo, not a gallery

Three things worth knowing before you scroll.

Everything is live

Each banner below is rendered by the real widget against our demo catalogue. Refresh the page and the copy changes, because it is generated for the page and the visitor, not stored.

They all read this same page

The widget sends the URL, the title, the meta description, the H1 and H2 headings and the structured data. Every banner on a page therefore shares one context, and none of them needs per-page configuration.

The code is the whole integration

The snippet under each banner is complete. Change sommelierbot to your own merchant key and it runs on your site, on any CMS, with no plugin and no developer.

The context the banners are reading

The bottle this page is demonstrating: Chablis Premier Cru Montée de Tonnerre 2021

Some banners work at the level of a page, and some work at the level of a bottle. So that both kinds have something real to chew on, this page carries one reference wine in its structured data.

Bottle of Chablis Premier Cru Montée de Tonnerre by Samuel Billaud — Pictured: Samuel Billaud, Chablis Premier Cru Montée de Tonnerre

The reference bottle

Chablis Premier Cru Montée de Tonnerre 2021

Dry mineral Chardonnay from northern Burgundy. High acidity, oyster shell and flint, lemon and white flowers. The classic oyster wine, and a useful test case because its structure is precise enough that a wrong recommendation is obvious.

ChardonnayChablis 1er CruDryHigh acidityFrance

And the rest of the page

Wine, spirits and support in the same thread

Wine is not the only thing the agent handles. Ask it for a peated single malt, ask it what to pour with the oysters, or ask it a support question about delivery. It answers all three in the same thread, because the conversation is never scoped to the banner you happened to open it from.

Single maltFood pairingDeliveryCustomer support

The flagship surface

The grid banner

Reads the page, then opens with six visual routes instead of an empty input box, which is why it gets tapped where a chat bubble gets ignored.

What it needs Page context only. It works on a brand new anonymous visitor, first impression.

banner-layout="grid" gives the wide six-tile format. Drop the attribute for the single-line version below. banner-id selects which of your configured banners to serve, so the same snippet can open with a different angle on a category page and on an article.

Show the code

<script src="https://cdn.sommelier.bot/widget.js"
  merchant="sommelierbot"
  mode="banner"
  banner-id="5"
  banner-layout="grid"></script>

The quiet version

The text banner

The same contextual opening written as a single editorial line, for places in an article where a six-tile grid would be too loud.

What it needs Page context only.

Identical engine, identical conversation. Only the rendering changes, so you can run the grid above the fold and the text version mid-article without splitting the visitor into two sessions.

Show the code

<script src="https://cdn.sommelier.bot/widget.js"
  merchant="sommelierbot"
  mode="banner"
  banner-id="5"></script>

Ranked for this visitor

Personalised top picks

Takes what the page is about, ranks the catalogue against this visitor's taste profile, and shows the bottles that actually match rather than the bestsellers.

What it needs Page context, plus the visitor profile once it exists.

On your first visit these are ranked from the page alone. Tap two or three things anywhere on this page, reload, and the selection moves: the taste profile is written from the first tap, with no account and no login.

Show the code

<script src="https://cdn.sommelier.bot/widget.js"
  merchant="sommelierbot"
  mode="picks"></script>

Cross-sell that is not keyword matching

Similar products

Finds genuine equivalents to the bottle on the page, matched on appellation, grape and structure rather than on words in the product title.

What it needs A bottle in the page context. On a product page that is automatic.

This is the one that exposes whether a recommendation engine understands wine. A keyword system answers a Chablis with another wine that has "Chablis" in the name. Attribute matching answers it with a different appellation that drinks the same way.

Show the code

<script src="https://cdn.sommelier.bot/widget.js"
  merchant="sommelierbot"
  mode="similar"></script>

The visitor against the bottle

Taste match score

Scores the bottle on the page against this visitor's own palate and explains the score in one sentence, so the number is never a black box.

What it needs A bottle in the page context, and a visitor profile for the score itself.

Before a visitor has interacted with anything there is no palate to score against, so the banner shows the wine description and waits. After three to five taps it has a profile and starts scoring. That is the honest behaviour: it does not invent a match percentage for someone it has never met.

Show the code

<script src="https://cdn.sommelier.bot/widget.js"
  merchant="sommelierbot"
  mode="match"></script>

Four scales, no jargon

Taste profile sliders

Puts the bottle's style, body, sweetness and acidity on four scales and lays the visitor's own palate over them.

What it needs A bottle in the page context.

This is the banner that teaches while it sells. A visitor who cannot name what they like can still see that they keep choosing high acidity, and every adjustment they make is written back to the profile.

Show the code

<script src="https://cdn.sommelier.bot/widget.js"
  merchant="sommelierbot"
  mode="taste"></script>

The hardest question a shop gets

Photo recognition

Drop in a photo of a label, a shelf or tonight's dinner and the agent answers from live inventory.

What it needs Nothing. It works on any page.

Accepts PNG, JPEG and WebP. Try a bottle you already own and ask for something similar you can actually buy, or photograph a plate and let it pair from what is in stock.

Show the code

<script src="https://cdn.sommelier.bot/widget.js"
  merchant="sommelierbot"
  mode="dropzone"></script>

Advice and first-line support

The full conversation, inline

Puts the entire sommelier conversation directly into the page, for a dedicated advice page, a help centre or a wine list.

What it needs Nothing. This is the default mode if you omit the mode attribute.

Every banner further up this page opens this same thread. Whatever you tapped above is already in it, and it will not ask you again. Ask it for a peated single malt, ask it what goes with the Chablis, or ask it a support question about delivery: it is the same agent.

Show the code

<script src="https://cdn.sommelier.bot/widget.js"
  merchant="sommelierbot"
  mode="embed"></script>

Site-wide furniture

The corner launcher

A floating launcher that opens the same conversation from every page of the site, for visitors who arrive without a banner in front of them.

Where to put it In the site footer or the theme template, once. Never twice on the same page.

This is the only surface on the page we have deliberately not switched on, because a launcher belongs to a whole site rather than to one page and two of them would fight for the same corner. popup-position takes left or right, and popup-x and popup-y move it away from the edge in pixels.

Show the code

<script src="https://cdn.sommelier.bot/widget.js"
  merchant="sommelierbot"
  mode="popup"
  popup-position="right"
  popup-x="20"
  popup-y="20"></script>

The whole API surface

Every attribute the snippet accepts

There is no configuration file and no dashboard step you have to complete before a banner renders. This table is the entire integration.

Attribute	Default	What it does
`merchant`	required	Your merchant key. `sommelierbot` is our public demo catalogue, which is what every snippet on this page uses.
`mode`	embed	Which surface to render: embed, banner, popup, similar, picks, match, taste or dropzone. Omit it and you get the inline conversation.
`banner-id`	your default	Which of your configured banners to serve. Only applies to `mode="banner"`.
`banner-layout`	text	grid for the six-tile format, text for the single line. Only applies to `mode="banner"`.
`theme`	your setting	dark or light. Defaults to the colour scheme set on your account.
`lang`	page language	en, de, fr, es, it, pt, nl, zh, ja, ru or hi. Read from your `<html lang>` attribute if you leave it out.
`popup-position`	right	left or right. Only applies to `mode="popup"`.
`popup-x / popup-y`	20	Distance from the edge in pixels. Only applies to `mode="popup"`.

Every attribute also works with a data- prefix, for CMS and page builders that strip unknown attributes from script tags: data-merchant, data-mode, data-banner-id and so on.

Where each one earns its place

Anywhere a visitor hesitates

Placements are unlimited on every paid plan. These are the ones that pay for themselves first.

Homepage

Grid banner above the fold. It is the only surface that opens a conversation before the visitor has chosen anything.

Category page

Top picks. The category is the context, and the ranking is the value.

Product page

Similar products, taste match and the taste sliders. All three read the bottle straight from your product markup.

Article or blog

Text banner mid-article, grid banner at the end. It reads the article itself, so evergreen posts need no maintenance.

Help or advice page

The inline conversation, for advice and first-line support in the same thread as everything else.

Newsletter or landing page

Grid banner. The same snippet, and the same conversation the reader had on your site.

Your catalogue, your banners

Put these on your own pages

Send us your shop link. The banners are live in a day, the first month is free, and you can cancel any month.

Start your free month Book a demo

Want custom AI agents for your business?

Want a personalized demo, a custom agent, or AI work that is not on this page? We have been building with machine learning and AI for the wine trade since 2019.

Talk to us