api14
API-Schlüssel holen

Wir verwenden Cookies. Cookies und Browserspeicher halten Sie angemeldet und merken sich Ihre Einstellungen. Mit Ihrer Zustimmung messen wir außerdem, wie die Website genutzt wird. Sie können jederzeit . Siehe unsere Cookie-Richtlinie.

Bild-Widget

Widget-Code für einen KI-Bildgenerator auf Ihrer Website

Besucher beschreiben ein Bild und sehen es direkt auf Ihrer Seite entstehen. Diese Anleitung erklärt den Code des Bild-Widgets, die Platzierung und die wichtigen Einstellungen.

Veröffentlicht:

Ein Bildgenerator-Widget verwandelt eine kurze Textbeschreibung direkt auf Ihrer Seite in ein Bild. Besucher tippen ein, was sie sehen möchten, das gewählte Modell erstellt es, und das Ergebnis erscheint mit einem Download-Link im Widget. Sie müssen weder ein Frontend bauen noch Dateien auf Ihrem Server verwalten.

So funktioniert das Bild-Widget

  1. Ein Besucher gibt eine Beschreibung ein, zum Beispiel „ein Leuchtturm in Aquarell bei Sonnenuntergang“.
  2. Das Widget sendet den Prompt über die ID Ihres Widgets an api14. Ihr API-Schlüssel und Ihre Einstellungen bleiben auf dem Server.
  3. Das Bildmodell erzeugt das Bild, und das Widget zeigt es mit einem Link Herunterladen an.

Jede Anfrage wird Ihrem USD-Guthaben zum normalen Preis des Modells belastet, und die Einstellungen, die Sie festlegen (siehe unten), bestimmen, wie viel das Widget ausgeben darf.

Der Widget-Code

Erstellen Sie das Widget unter Widgets, wählen Sie Bild als Typ und speichern Sie. Danach zeigt der Editor den Code:

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

Fügen Sie ihn dort ein, wo der Generator erscheinen soll. Mit data-target="#gallery" rendern Sie ihn in ein vorhandenes Element, mit data-height="520px" geben Sie dem Ergebnis mehr Platz (Bild-Widgets sind standardmäßig 420px hoch). Wählen Sie die Platzierung Schwebende Schaltfläche, wenn sich der Generator lieber über eine Schaltfläche in der Ecke öffnen soll.

Einstellungen, die eine Minute wert sind

  • Modell: Die Auswahl listet die Bildmodelle des Katalogs mit ihren Preisen. Modelle, die ein vorhandenes Bild nur bearbeiten oder hochskalieren, sind hier nicht sinnvoll, weil das Widget von einem Text-Prompt ausgeht.
  • API-Schlüssel: Wählen Sie den Schlüssel, unter dem das Widget läuft, oder am Ende der Liste Neuen API-Schlüssel erstellen. Tägliches Ausgabenlimit, Anfragerate und erlaubte Modelle dieses Schlüssels gelten für das Widget.
  • Texte: Legen Sie Titel, Platzhalter im Eingabefeld (ein guter Beispiel-Prompt erleichtert Besuchern den Einstieg) und Beschriftung der Schaltfläche fest.
  • Darstellung: Akzentfarbe, Design (automatisch, hell oder dunkel) und Eckenradius, damit das Widget zu Ihrem Design passt.

Wo ein Bild-Widget passt

  • Blogs und kreative Communitys: Besucher illustrieren ihre eigenen Ideen.
  • Agenturen und Studios: ein schnelles Konzept-Tool auf einer Landingpage.
  • Bildung: Lernende verwandeln eine Beschreibung in ein Bild, über das sie diskutieren können.

Vor der Veröffentlichung

Tragen Sie Ihre Domains unter Einstellungen, Widget-Websites ein; das Widget beantwortet nur Anfragen von diesen Websites. Legen Sie ein tägliches Ausgabenlimit fest, testen Sie einige Prompts in der Vorschau des Editors und prüfen Sie das Ergebnis auf dem Smartphone und am Desktop.

Sie können ein Bild-Widget ohne Konto auf der Widgets-Seite gestalten. Die Widget-Dokumentation beschreibt jede Option im Detail.

Verwandte Ratgeber