Bild-Widget-Code für Onlineshops: Entwürfe und Bildideen für Kunden

Kunden fällt es oft schwer, sich das Ergebnis vorzustellen: einen individuellen Druck, eine Wandfarbe, eine Geschenkidee. Mit einem KI-Bild-Widget beschreiben sie es und sehen in Sekunden ein generiertes Bild, ohne Ihren Shop zu verlassen. Da das Widget White Label ist, wirkt es wie ein Teil Ihres Shops und nicht wie ein Tool eines Drittanbieters.

Ideen, die im Shop funktionieren

• Individuelle Drucke und Merchandise: „eine minimalistische Berg-Strichzeichnung für eine Tasse“ gibt dem Kunden einen Ausgangspunkt für das Gespräch mit Ihnen.
• Einrichtung und Deko: Besucher skizzieren eine Stimmung („ein ruhiges skandinavisches Schlafzimmer in Salbeigrün“), bevor sie passende Produkte durchstöbern.
• Geschenkinspiration: Ein schnelles Bild hilft bei der Entscheidung, was bestellt werden soll.

Machen Sie auf der Seite klar, dass die Bilder KI-generierte Entwürfe sind und keine Fotos eines Produkts, das Sie versenden. So bleiben die Erwartungen realistisch und Retouren werden vermieden.

Auf einer Produkt- oder Landingpage einbinden

Erstellen Sie ein Widget vom Typ Bild unter Widgets, speichern Sie es und kopieren Sie den Code:

<script src="https://api14.com/widget.js" data-widget="YOUR_WIDGET_ID" async></script>

Die meisten Shopsysteme erlauben einen eigenen HTML-Block. Fügen Sie das Tag dort ein oder rendern Sie das Widget mit data-target in ein bestimmtes Element. Das Widget läuft in einem eigenen Shadow DOM, sodass sich das CSS Ihres Themes und das Widget nie gegenseitig stören.

So sieht es aus wie Ihr Shop

Das Bild-Widget trägt kein Logo und keine „Powered by“-Zeile. Formulieren Sie Titel und Schaltfläche im Ton Ihres Shops, wählen Sie die Akzentfarbe Ihrer Marke und ein Design, das zu Ihren Seiten passt. Zeigen Sie im Platzhalter einen guten Beispiel-Prompt: Kunden übernehmen, was sie sehen.

Ausgaben planbar halten

Ein Shop kann Tage mit viel Andrang haben, legen Sie daher vor einer Kampagne Limits fest:

• Betreiben Sie das Widget unter einem eigenen API-Schlüssel. Im Editor ist die letzte Option der Schlüsselliste Neuen API-Schlüssel erstellen. Geben Sie diesem Schlüssel ein tägliches Ausgabenlimit und beschränken Sie ihn auf das gewählte Bildmodell.
• Legen Sie zusätzlich ein tägliches Ausgabenlimit für das Widget selbst fest.
• Legen Sie unter Einstellungen, Widget-Steuerung fest, wie viele Anfragen ein Besucher pro Tag senden darf.

Nutzung zeigt die Anfragen des Widgets nach Website und nach Widget, sodass Sie sehen, ob sich das Tool rechnet.

Nur die Domain Ihres Shops zulassen

Tragen Sie die Domain Ihres Shops unter Einstellungen, Widget-Websites ein. Eine Domain umfasst auch ihre Subdomains, example.com schließt also www.example.com ein.

Probieren Sie den Builder auf der Widgets-Seite aus, um zu sehen, wie ein Bild-Widget in Ihrem Shop aussehen würde.