FastTradein
Menü
FastTradein

API und Webhooks des Trade-in-Widgets

Widget einbetten, Status mit HMAC-SHA256-Webhooks synchronisieren und den Katalog bei FastTradein belassen.

Schnellstart

Binden Sie das Widget mit zwei HTML-Zeilen ein und nehmen Sie anschließend die Shop-Domain in die Freigabeliste auf. Das Skript kommuniziert nur mit FastTradein, nicht mit Ihrem CMS.

Diesen Block in das HTML der Trade-in-Seite einfügen. Den Schlüssel durch den öffentlichen Widget-Schlüssel aus dem Workspace ersetzen.

<!-- FastTradein Widget -->
<script src="https://fasttradein.app/widget/fasttradein.js" async data-no-optimize="1" data-no-defer="1"></script>
<fasttradein-widget key="IHR_OEFFENTLICHER_SCHLUESSEL" api="https://fasttradein.app" lang="de"></fasttradein-widget>

Das Snippet setzt api auf diesen FastTradein-Host. Ohne das Attribut nutzt das Widget die Adresse, von der das Skript fasttradein.js geladen wurde.

Snippet-Parameter

key Pflicht: Ja Öffentlicher Shop-Schlüssel aus den Shop-Einstellungen oder von der Seite „Widget-Einbettung“. Er kann den Katalog lesen, eine Bewertung anfragen und eine Trade-in-Anfrage senden. Preise ändern und fremde Shops öffnen kann er nicht.
data-key Pflicht: Nein Derselbe öffentliche Schlüssel wie key. React und Vue reservieren key für sich und geben es nicht an das Element weiter, verwenden Sie dort data-key. Das Widget liest zuerst key, dann data-key und startet neu, wenn sich einer davon ändert.
lang Pflicht: Nein Startsprache der Oberfläche, bis der Kunde wechselt: en, de, es, pl, ru, uk.
api Pflicht: Nein FastTradein-Origin, zum Beispiel https://fasttradein.app. Lassen Sie das Attribut im Snippet.
currency Pflicht: Nein Kein HTML-Attribut. Die Anzeigewährung (EUR, PLN, UAH, USD und weitere aus dem Workspace) kommt aus den Shop-Einstellungen. Der Katalog bleibt in Euro und wird zum Plattformkurs umgerechnet.

Ereignisse für das Conversion-Tracking

Das Element löst fasttradein:quote aus, wenn der Kunde eine Bewertung erhält, und fasttradein:order, wenn eine Anfrage gesendet wurde. Beide Ereignisse steigen im DOM auf (bubbles) und verlassen das Shadow DOM (composed), Sie können also am Element oder an document einen Listener registrieren. event.detail enthält device und blocked (Bewertung) bzw. device und payout_method (Anfrage), nie Kundendaten.

CMS-Snippets

Anleitungen für 111 Plattformen. Vor dem Go-live den Shop-Host in die Widget-Freigabeliste eintragen.

Plattformen angezeigt: 111 von 111

WooCommerce Weltweit

Seiten → Trade-in-Seite → Block „Individuelles HTML“: Code im Tab HTML einfügen und die Seite speichern. Für viele Seiten die Zeile <script> im Theme-Footer laden (Design → Editor → Vorlagen → Footer) oder per Plugin WPCode; auf den Seiten bleibt nur das Widget-Tag.

Schritt-für-Schritt-Anleitung für WooCommerce →

OpenCart Weltweit

Design → Layouts → dem Layout der Trade-in-Seite ein HTML-Content-Modul mit dem Snippet hinzufügen. Wenn Sie die <script>-Zeile stattdessen im Footer-Template laden (catalog/view/theme/<theme>/template/common/footer.twig in OpenCart 3, catalog/view/template/common/footer.twig in OpenCart 4), lassen Sie im Modul nur das Tag <fasttradein-widget …></fasttradein-widget>, denn der Footer erscheint auf jeder Seite.

Schritt-für-Schritt-Anleitung für OpenCart →

Shopify Weltweit

Onlineshop → Theme bearbeiten: eine Seitenvorlage anlegen (Seiten → Vorlage erstellen), darin einen Abschnitt Custom Liquid mit dem Code hinzufügen und speichern. Dann unter Onlineshop → Seiten diese Vorlage für die Trade-in-Seite wählen. Hat das Theme keinen Abschnitt Custom Liquid, den Code im Code-Editor des Themes in die Seitenvorlage einfügen.

Schritt-für-Schritt-Anleitung für Shopify →

PrestaShop Weltweit

Installieren Sie das kostenlose FastTradein-Modul: Module → Modul-Verwaltung → Modul hochladen, dann Einstellungen, und fügen Sie den Code oder den Schlüssel ein. Schreiben Sie [fasttradein] in eine eigene Zeile im Inhalt einer Seite unter Design → Seiten. PrestaShop speichert kein <script> im Seiteninhalt und entfernt das Widget-Tag, deshalb setzt das Modul das Widget beim Anzeigen der Seite ein.

Schritt-für-Schritt-Anleitung für PrestaShop →

Magento / Adobe Commerce Weltweit

Content → Elements → Blocks → Statischen HTML-Block anlegen und über Content → Pages ausgeben.

Wix Weltweit

Elemente hinzufügen → Code einbetten → Benutzerdefiniertes Element (Custom Element). Quelle: Server URL = https://fasttradein.app/widget/fasttradein.js, Tag Name = fasttradein-widget. Attribute: data-key = IHR_OEFFENTLICHER_SCHLUESSEL, api = https://fasttradein.app, lang = de. Dafür brauchen Sie einen Premium-Tarif mit verbundener Domain. Nicht „HTML einbetten“ (Embed HTML) verwenden: Dieser Code läuft in einem iframe auf einer anderen Domain, und das Widget lehnt ihn ab.

BigCommerce Weltweit

Storefront → Script Manager für das Skript nutzen und das Tag <fasttradein-widget> über den Page Builder (HTML-Widget) platzieren.

Squarespace Weltweit

Trade-in-Seite bearbeiten → Codeblock hinzufügen und das Snippet einfügen. Codeblöcke führen JavaScript nur in den Tarifen Core, Plus, Advanced oder Commerce aus, und das Widget erscheint nur auf der veröffentlichten Website.

Shopware 6 Europa

Shopware ab 6.5 entfernt unbekannte Tags und <script> aus Editor-Inhalten. Die <script>-Zeile in footer.html.twig Ihres Themes laden. Dann das Tag fasttradein-widget in den Einstellungen von shopware.html_sanitizer erlauben (zum Beispiel in config/packages/z-shopware.yaml), Inhalte → Erlebniswelten öffnen, dem Layout der Trade-in-Seite ein Text-Element hinzufügen, dessen Editor auf die HTML-Code-Ansicht umschalten und nur das Tag <fasttradein-widget …></fasttradein-widget> einfügen.

Ecwid by Lightspeed Weltweit

Instant Site: auf der Trade-in-Seite einen Abschnitt „Custom code“ hinzufügen und das Snippet einfügen (Tarif Venture, Business oder Unlimited). Auf Ihrer eigenen Website das Snippet auf der Trade-in-Seite neben dem Ecwid-Code einfügen.

Webflow Weltweit

Add Elements → Components → Embed (HTML Embed Code) auf der Trade-in-Seite einfügen und die Site veröffentlichen (kostenpflichtiger Site- oder Workspace-Tarif).

Drupal Commerce Weltweit

Structure → Block layout → Custom Block mit Format Full HTML in die gewünschte Region oder den Layout Builder setzen.

Framer Weltweit

Embed-Komponente auf die Fläche setzen, Typ auf HTML stellen und Skript plus Tag <fasttradein-widget> einfügen.

nopCommerce Weltweit

Administration → Content Management → Topics (Pages) → Trade-in-Seite öffnen und das Snippet im Modus Source code einfügen.

Salesforce Commerce Cloud Weltweit

Merchant Tools → Content → Content Assets → HTML-Asset anlegen und im Page Designer platzieren.

HubSpot CMS Weltweit

Content → Design Manager → ein eigenes Modul mit dem Snippet anlegen und auf der Trade-in-Seite einfügen, oder das Snippet in der Quellcode-Ansicht eines Rich-Text-Moduls einfügen.

Ghost Weltweit

Im Editor der Trade-in-Seite eine HTML-Karte mit dem Snippet hinzufügen. Alternativ nur die <script>-Zeile unter Settings → Code injection → Site Footer einfügen und das Tag <fasttradein-widget …></fasttradein-widget> in der HTML-Karte lassen.

Weebly Weltweit

Element Embed Code (HTML) auf die Trade-in-Seite ziehen und Edit Custom HTML wählen.

SAP Commerce Cloud Weltweit

SmartEdit → CMS-Komponente (Paragraph oder Custom HTML) auf der Trade-in-Seite im WCMS anlegen.

Oracle Commerce Weltweit

Design Studio → Benutzerdefiniertes Widget mit HTML-Snippet anlegen und im Seitenlayout platzieren.

Square Online Weltweit

Site-Editor → Abschnitt hinzufügen → Einbettungscode → Snippet einfügen und veröffentlichen (Square Online Plus oder Premium).

Volusion Weltweit

Design → Site Designer → Custom-HTML-Block mit dem Snippet auf der Trade-in-Seite einfügen. In footer_custom.html gehört höchstens die <script>-Zeile; das Tag <fasttradein-widget …></fasttradein-widget> bleibt im Block auf der Trade-in-Seite.

Shift4Shop Weltweit

Content → Site Pages → Seite bearbeiten → Editor auf HTML Source umschalten und Snippet einfügen.

NetSuite SuiteCommerce Weltweit

SuiteCommerce Advanced → Einen Custom-Content-CMS-Block hinzufügen oder das Snippet im Layout-Template des Themes platzieren.

Zoho Commerce Weltweit

Einstellungen → Visual Builder → Embed-Element auf der Trade-in-Seite einfügen und speichern.

VTEX Weltweit

VTEX IO → Custom Block / App erstellen oder Webkomponente in das Layout von Store Framework einbinden.

Carrd Weltweit

+ anklicken → Embed → Type auf Code und Style auf Inline stellen, das Snippet einfügen und veröffentlichen. Embeds erfordern Carrd Pro Standard oder höher.

Hostinger Weltweit

Website Builder → Embed-Code-Element hinzufügen und das Snippet einfügen.

MODX Weltweit

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

GoDaddy Weltweit

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Miva Weltweit

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Nuvemshop / Tiendanube Weltweit

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Cafe24 Weltweit

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

SHOPLINE Weltweit

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

thebase Weltweit

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Salla Weltweit

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Tray Commerce Weltweit

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Shoper Europa

Ustawienia → Zaawansowane → Bezpieczeństwo (Einstellungen → Erweitert → Sicherheit): „Wyłącz czyszczenie kodu HTML“ (HTML-Bereinigung abschalten) aktivieren. Dann Wygląd i treści → Wygląd sklepu → Obecny szablon graficzny → Moduły → Moduł własny im HTML-Modus: das Snippet einfügen und das Modul auf der Trade-in-Seite platzieren.

IdoSell Europa

Sklep → Dodatki HTML/JS (HTML/JS-Add-ons): ein Add-on anlegen, bei „Wyświetlaj na podstronach“ (auf Unterseiten anzeigen) die Option „Wybranych“ (ausgewählte) wählen und die Adresse der Trade-in-Seite angeben, dann das Snippet in das HTML-Codefeld einfügen.

JTL-Shop Europa

JTL-Shop 5 hat kein eingebautes Codefeld: Die <script>-Zeile über Ihr Child-Template (layout/footer.tpl, Block layout-footer-js) oder ein Plugin für Header- und Footer-Code aus dem JTL-Store laden und das Tag <fasttradein-widget …></fasttradein-widget> auf der Trade-in-Seite im HTML-Quelltextmodus einfügen.

Gambio Europa

Inhalte → Content Manager → die Trade-in-Seite anlegen, den Editor auf HTML-Quelltext umstellen und das Snippet einfügen.

Sylius Europa

templates/bundles/SyliusShopBundle/layout.html.twig überschreiben (das Template @SyliusShop/layout.html.twig), dort die <script>-Zeile laden und das Tag <fasttradein-widget …></fasttradein-widget> in das Template der Trade-in-Seite setzen.

Lightspeed eCom Europa

Settings → Web Extras → Custom JavaScript / HTML oder den Code ins Theme-Template einfügen.

Spryker Europa

Webkomponente in das Twig-Template der Yves-Storefront einbinden oder Skript im Basis-Layout platzieren.

Plentymarkets Europa

CMS → Container → Widget-HTML-Code in Ceres-Template oder benutzerdefinierten Content-Block einfügen.

OXID eShop Europa

Kundeninformationen → CMS-Seiten: die Trade-in-Seite anlegen und das Snippet im HTML-Quelltextmodus einfügen. Entfernt der Editor das Skript, die <script>-Zeile im Basis-Layout Ihres Themes laden (OXID 6: Application/views/<theme>/tpl/layout/base.tpl; OXID 7: das entsprechende Twig-Template) und auf der Seite nur das Tag <fasttradein-widget …></fasttradein-widget> lassen.

Shoptet Europa

Erscheinungsbild → HTML-Codes oder einen HTML-Block auf der Trade-in-Seite hinzufügen.

Webnode Europa

Trade-in-Seite öffnen und ein HTML-Element mit dem Snippet hinzufügen.

Sky-Shop Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

RedCart Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

AtomStore Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Comarch e-Sklep Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Sote Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Selly Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Unas Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

ShopRenter Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

CloudCart Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

MerchantPro Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Gomag Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

CCV Shop Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Mijnwebwinkel Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

MyOnlineStore Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

modified eCommerce Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

xt:Commerce Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Intershop Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

TYPO3 Europa

HTML-Inhaltselement auf der Trade-in-Seite anlegen oder das Snippet in die Website-Vorlage aufnehmen.

Jimdo Europa

HTML-Element auf der Trade-in-Seite hinzufügen und das Snippet einfügen.

ePages Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Vilkas Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

MyCashflow Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

DanDomain Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

SmartWeb Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Abicart Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Starweb Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Jetshop Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Mystore Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

VirtueMart Europa

Den Joomla-Beitrag der Trade-in-Seite im Quelltextmodus öffnen und das Snippet einfügen. Wenn der Editor das Skript entfernt, Skript im Template laden und das Widget-Tag im Beitrag lassen.

Odoo Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

JouwWeb Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Webador Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Upgates Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

EKM Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Visualsoft Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

IONOS Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Strato Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Mozello Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Litium Europa

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Medusa.js Headless

Widget-Skript im Layout der Next.js- oder Remix-Storefront laden und die Webkomponente <fasttradein-widget> auf der Trade-in-Seite einfügen. In React und Vue den Schlüssel als data-key angeben: Beide reservieren key für sich und geben es nicht an das Element weiter.

Saleor Headless

Widget-Skript in der Storefront (React / Next.js) laden und die Webkomponente <fasttradein-widget> in JSX nutzen. In React und Vue den Schlüssel als data-key angeben: Beide reservieren key für sich und geben es nicht an das Element weiter.

Vendure Headless

Widget-Skript im Layout der Storefront (Client) laden und das Tag <fasttradein-widget> auf der Trade-in-Seite einfügen. In React und Vue den Schlüssel als data-key angeben: Beide reservieren key für sich und geben es nicht an das Element weiter.

commercetools Headless

Widget-Skript in Ihre React-, Vue- oder Next.js-Storefront einbinden und das Tag <fasttradein-widget> verwenden. In React und Vue den Schlüssel als data-key angeben: Beide reservieren key für sich und geben es nicht an das Element weiter.

Swell Headless

Widget-Skript ins Swell-Storefront-Layout einbinden und das Tag auf der Trade-in-Seite platzieren. In React und Vue den Schlüssel als data-key angeben: Beide reservieren key für sich und geben es nicht an das Element weiter.

Strapi Headless

Webkomponente im Frontend (Next.js, Nuxt, Remix) einbinden, das Daten über Strapi bezieht. In React und Vue den Schlüssel als data-key angeben: Beide reservieren key für sich und geben es nicht an das Element weiter.

Contentful Headless

Widget-Komponente im Frontend (Next.js, Astro, Gatsby) einbinden, das Daten von Contentful abruft. In React und Vue den Schlüssel als data-key angeben: Beide reservieren key für sich und geben es nicht an das Element weiter.

Sanity Headless

Webkomponente direkt ins Next.js- oder Remix-Layout oder in benutzerdefinierte Content-Blöcke integrieren. In React und Vue den Schlüssel als data-key angeben: Beide reservieren key für sich und geben es nicht an das Element weiter.

Next.js Storefront Headless

Skript mit <Script src="https://fasttradein.app/widget/fasttradein.js" strategy="afterInteractive" /> aus next/script in app/layout laden. Auf der Trade-in-Seite <fasttradein-widget data-key="IHR_OEFFENTLICHER_SCHLUESSEL" api="https://fasttradein.app" lang="de"></fasttradein-widget> ausgeben. React reserviert key für sich und gibt es nicht an das Element weiter, daher data-key verwenden. In TypeScript fasttradein-widget in JSX.IntrinsicElements deklarieren.

Nuxt.js Storefront Headless

Skript mit useHead({ script: [{ src: "https://fasttradein.app/widget/fasttradein.js", defer: true }] }) laden und das Tag in nuxt.config als Custom Element markieren: vue.compilerOptions.isCustomElement = (tag) => tag === "fasttradein-widget". Auf der Trade-in-Seite <fasttradein-widget data-key="IHR_OEFFENTLICHER_SCHLUESSEL" api="https://fasttradein.app" lang="de"></fasttradein-widget> einfügen. Vue reserviert key für sich und gibt es nicht an das Element weiter, daher data-key verwenden.

Vue Storefront Headless

Widget-Skript im Storefront-Layout laden und das Tag <fasttradein-widget> auf der Trade-in-Seite platzieren. In React und Vue den Schlüssel als data-key angeben: Beide reservieren key für sich und geben es nicht an das Element weiter.

Commerce Layer Headless

Widget-Skript im Storefront-Layout laden und das Tag <fasttradein-widget> auf der Trade-in-Seite platzieren. In React und Vue den Schlüssel als data-key angeben: Beide reservieren key für sich und geben es nicht an das Element weiter.

Django Framework

Skript im Basis-Template laden und das Tag <fasttradein-widget> auf der Trade-in-Seite platzieren.

Laravel Framework

Skript im Blade-Layout laden und das Tag <fasttradein-widget> in der Trade-in-View platzieren.

Ruby on Rails Framework

Skript im Application-Layout laden und das Tag <fasttradein-widget> in der Trade-in-View platzieren.

Symfony Framework

Skript im Twig-Basis-Layout laden und das Tag <fasttradein-widget> im Trade-in-Template platzieren.

Horoshop Ukraine

Settings → General settings → Scripts: die <script>-Zeile in das Feld „before the </body> tag“ einfügen und speichern. Dann die Trade-in-Seite öffnen, den Editor der Beschreibung auf HTML-Code umschalten und das Tag <fasttradein-widget …></fasttradein-widget> einfügen.

Cartum Ukraine

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

OkayCMS Ukraine

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

SoloMono Ukraine

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

ImageCMS Ukraine

Snippet auf der Trade-in-Seite im HTML- oder Quelltextmodus einfügen. Wenn der Editor das Skript entfernt, Skript in Header oder Footer der Website setzen und das Widget-Tag auf der Seite lassen.

Prom.ua Ukraine

Prom.ua erlaubt keine eigenen Skripte auf der Firmenseite, daher läuft das Widget dort nicht. Binden Sie das Widget auf Ihrer eigenen Website oder Landingpage ein und verlinken Sie diese Seite aus Ihrem Prom-Shop.

Shop-Express Ukraine

Control Panel → Einstellungen → Benutzerdefinierte Skripte / HTML → Code auf der Trade-in-Seite einfügen.

Weblium Ukraine

Einen Embed-Code-Block mit dem Snippet direkt auf der Trade-in-Seite einfügen. Alternativ die <script>-Zeile unter Website-Einstellungen → Eigener Code (Head/Body) laden und im Embed-Block nur das Tag lassen. Eigener Code erfordert den Weblium-Tarif Pro.

Sicherheit und Domain-Freigabeliste

Die Widget-API ist absichtlich öffentlich und trotzdem an Ihren Shop gebunden. Sie gewährt keinen Zugang zum Workspace, zur Preisbearbeitung oder zu Daten anderer Mandanten.

Domain-Freigabeliste (CORS / Origin)

Das sind die Websites, auf denen Ihr Widget laufen darf. Browser senden Origin oder Referer. FastTradein lässt nur die Hostnamen zu, die in den Shop-Einstellungen gespeichert sind (Feld „Website“ und „Websites, auf denen das Widget läuft“), plus diesen FastTradein-Host. Ein Request von einer fremden Site endet mit 403 Forbidden.

Öffentlicher Widget-Schlüssel

widgetKey in der URL ist eine öffentliche Kennung. Damit lässt sich der Shop-Katalog lesen und eine Trade-in-Anfrage senden. Preise ändern, Kundendaten anderer Shops exportieren oder den Workspace öffnen lässt sich damit nicht.

Rate Limiting

Widget-Routen erlauben 120 Requests pro Minute je IP und Shop. Für die Suche gilt ein niedrigeres Limit (20/min). Für neue Trade-in-Anfragen gilt: 10 pro Minute und 10 pro Tag je IP und Shop sowie 8 pro Stunde je Kunden-E-Mail. Über dem Limit antwortet die API mit 429.

Bot-Schutz

Der Aufruf zum Anlegen einer Anfrage enthält ein verstecktes Honeypot-Feld. Automatisierter Spam, der dieses Feld ausfüllt, wird verworfen, ohne dass eine Anfrage entsteht. Senden Sie aus einem eigenen Client keine unbekannten Extrafelder.

Storefront-REST-API

Basispfad: /api/widget/{widgetKey}. Das ist dieselbe öffentliche Widget-Schnittstelle, die auch das Storefront-Skript nutzt. Workspace- und Plattform-Admin-Routen gehören nicht zum Umfang dieser API.

Sprache von Katalog, Widget-Texten und Anzeigebeträgen setzen Sie per Query-Parameter ?locale=de. formatted_amount und max_buyback_formatted sind fertige Texte für Ihre Kundschaft: der Betrag auf ganze Einheiten gerundet, mit Währungssymbol und Tausendertrennzeichen, zum Beispiel „1 235 €“. Wie sie aussehen, hängt von Sprache und Währung ab. Rechnen Sie mit den Zahlen in der kleinsten Währungseinheit, beim Euro also in Cent: max_buyback und quoted_amount_cents. Zum Beispiel bedeutet quoted_amount_cents = 123456 einen Betrag von 1234,56 Euro.

GET /api/widget/{widgetKey}

Shop-Konfiguration

Liefert Shop-Namen, Farben, Währung, Locale, aktivierte Kategorien, Auszahlungsarten und Widget-Texte.

cURL-Beispiel

curl -sS "https://fasttradein.app/api/widget/IHR_OEFFENTLICHER_SCHLUESSEL?locale=de" \
  -H "Origin: https://shop.example" \
  -H "Accept: application/json"

Beispielantwort 200 OK

{
    "tenant": {
        "name": "Your Store",
        "currency": "EUR",
        "locale": "de",
        "primary_color": "#1f3a8a",
        "logo_url": null
    },
    "locale": "de",
    "accepting_orders": true,
    "payout_methods": [
        {
            "value": "bank_transfer",
            "label": "Banküberweisung"
        },
        {
            "value": "store_credit",
            "label": "Guthaben für einen Einkauf im Geschäft"
        }
    ],
    "categories": [
        {
            "id": 1,
            "slug": "smartphones",
            "name": "Smartphones"
        }
    ],
    "catalog_version": "3f9a1c0b7e"
}
GET /api/widget/{widgetKey}/search?q=iPhone+13

Modellsuche

Sucht Modelle nach Namen. Ist q kürzer als 2 Zeichen, liefert die Antwort bis zu 6 beliebte Modelle mit "popular": true. Ergebnisse enthalten den aktuellen maximalen Ankaufspreis dieses Shops. Höchstens 8 Treffer. Ausgeblendete Varianten fehlen.

cURL-Beispiel

curl -sS "https://fasttradein.app/api/widget/IHR_OEFFENTLICHER_SCHLUESSEL/search?q=iPhone+13" \
  -H "Origin: https://shop.example" \
  -H "Accept: application/json"

Beispielantwort 200 OK

{
    "results": [
        {
            "model_id": 42,
            "name": "iPhone 13",
            "brand": "Apple",
            "max_buyback": 42000,
            "max_buyback_formatted": "420 €"
        }
    ]
}
POST /api/widget/{widgetKey}/orders

Trade-in-Anfrage anlegen

Sendet eine Ankaufsanfrage aus dem Widget oder Ihrem eigenen Client. Ein POST ohne Origin- oder Referer-Header wird mit 403 abgelehnt, daher muss ein Server oder eine App Origin: https://<eine Domain von Ihrer Freigabeliste> senden. Zuerst variant_id und answer_ids sammeln. Bei Erfolg antwortet die API mit HTTP 201 und order_number.

JSON-Body

variant_id Pflicht: Ja Aktive Katalogvariante.
answer_ids Pflicht: Ja Antwort-IDs aus dem Kategorie-Fragebogen. Eine Antwort pro Frage; eine Frage mit multiple: true erlaubt mehrere Antworten, eine Antwort mit exclusive: true schließt alle anderen aus.
customer_name Pflicht: Ja Kundenname.
customer_email Pflicht: Ja Kunden-E-Mail.
customer_phone Pflicht: Nein Telefon, optional.
payout_method Pflicht: Nein bank_transfer oder store_credit; store_voucher, wenn der Shop Shop-Gutscheine aktiviert hat. Ohne dieses Feld erhält die Anfrage bank_transfer.

cURL-Beispiel

curl -sS -X POST "https://fasttradein.app/api/widget/IHR_OEFFENTLICHER_SCHLUESSEL/orders" \
  -H "Origin: https://shop.example" \
  -H "Accept: application/json" \
  -H "Content-Type: application/json" \
  -d '{"variant_id":101,"answer_ids":[11,24],"customer_name":"Ada Lovelace","customer_email":"ada@example.com","customer_phone":"+49 170 000000","payout_method":"bank_transfer"}'

Ersetzen Sie https://shop.example durch eine Domain von Ihrer Widget-Freigabeliste.

Beispielantwort 201 Created

{
    "order_number": "TF-8PGPFFNLM6",
    "quoted_amount_cents": 38000,
    "formatted_amount": "380 €",
    "currency": "EUR",
    "status": "submitted"
}

Weitere öffentliche Widget-Routen

Nötig, um variant_id und answer_ids vor POST /orders zu holen. Gleicher Schlüssel, gleiche CORS-Regeln.

  • GET /api/widget/{widgetKey}/catalog/{category} Marken, Modelle und Speicher einer Kategorie (id oder slug).
  • GET /api/widget/{widgetKey}/questionnaire/{category} Checklisten-Gruppen, Fragen und Antwort-IDs dieser Kategorie. multiple kennzeichnet eine Frage, die mehrere Antworten erlaubt, exclusive eine Antwort, die alle anderen ausschließt.
  • POST /api/widget/{widgetKey}/quotes Preis der Variante mit den gewählten Antworten, bevor die Anfrage angelegt wird. JSON: variant_id, answer_ids.

Webhooks

Webhooks gibt es in den Tarifen Business und Pro. Öffnen Sie im Workspace „Einstellungen“ → „Anfragen ins CRM“, tragen Sie Ihre HTTPS-URL ein und erzeugen Sie den geheimen Schlüssel. Danach sendet FastTradein für die unten genannten Ereignisse JSON per POST dorthin, sodass Sie jedes CRM oder ERP synchronisieren können.

Ereignisse

  • order.created Der Kunde hat über das Widget eine Anfrage abgeschickt.
  • order.received Der Shop hat das Gerät als im Lager angekommen markiert.
  • order.counter_offered Die Lagerprüfung hat die Auszahlung geändert. Der Kunde erhielt einen geschützten Angebotslink.
  • order.paid Der Shop hat die Anfrage als ausgezahlt markiert.
  • order.accepted Der Kunde hat den neuen Preis nach der Prüfung angenommen.
  • order.declined Die Anfrage endete ohne Abschluss: Der Kunde hat den neuen Preis abgelehnt, das Gerät war bei der Prüfung gesperrt oder der Shop hat die Annahme abgelehnt. data.status ist declined oder cancelled.

JSON-Payload

Der Body ist kompaktes JSON ohne Slash- und Unicode-Escapes. HMAC-SHA256 über genau diese Bytes rechnen. order_number ist ein String wie TF-8PGPFFNLM6, event_id besteht aus evt_ und einer UUID. Die Felder voucher_* sind bei Anfragen mit Shop-Gutschein gefüllt, sobald der Gutschein ausgegeben ist, sonst null.

{
  "event": "order.created",
  "event_id": "evt_c800a9c7-b11c-4b75-810e-e667544d825d",
  "timestamp": 1788550000,
  "tenant_id": 12,
  "data": {
    "order_number": "TF-8PGPFFNLM6",
    "status": "submitted",
    "currency": "EUR",
    "quoted_amount_cents": 38000,
    "inspected_amount_cents": null,
    "final_amount_cents": null,
    "device": "Apple iPhone 13 128GB",
    "customer": {
      "name": "Ada Lovelace",
      "email": "ada@example.com",
      "phone": "+49 170 000000"
    },
    "parcel_tracking_number": null,
    "payout_method": "bank_transfer",
    "voucher_code": null,
    "voucher_amount_cents": null,
    "voucher_url": null,
    "voucher_expires_at": null
  }
}

Header

  • X-FastTradein-Event: Ereignisname, gleich payload.event.
  • X-FastTradein-Signature: HMAC-SHA256, HMAC des rohen Bodys mit Präfix sha256=.
  • User-Agent: FastTradein-Webhook/1.0

Antworten Sie innerhalb von 10 Sekunden mit einem beliebigen 2xx-Status. Jeder andere Status, ein Timeout oder eine Weiterleitung gilt als Fehler; wir wiederholen dann zweimal, nach 10 und nach 60 Sekunden, mit derselben event_id und Signatur. Weiterleitungen folgen wir nicht, speichern Sie also die endgültige https-Adresse. Duplikate erkennen Sie an der event_id.

HMAC-SHA256 prüfen

HMAC-SHA256 über den rohen POST-Body mit dem geheimen Webhook-Schlüssel berechnen. Mit X-FastTradein-Signature zeitkonstant vergleichen. Der Header-Wert beginnt mit sha256=.

PHP

$signature = $_SERVER['HTTP_X_FASTTRADEIN_SIGNATURE'] ?? '';
$payload = file_get_contents('php://input');
$expected = 'sha256='.hash_hmac('sha256', $payload, $secret);
if (!hash_equals($expected, $signature)) {
    http_response_code(401);
    exit('Invalid signature');
}

Node.js

const crypto = require('crypto');
const express = require('express');
const app = express();

// express.raw keeps the exact POST bytes; JSON.stringify(req.body) would not match the signature.
app.post('/fasttradein-webhook', express.raw({ type: 'application/json' }), (req, res) => {
  const signature = String(req.get('X-FastTradein-Signature') || '');
  const expected = 'sha256=' + crypto
    .createHmac('sha256', process.env.FASTTRADEIN_WEBHOOK_SECRET)
    .update(req.body)
    .digest('hex');
  if (
    signature.length !== expected.length ||
    !crypto.timingSafeEqual(Buffer.from(expected), Buffer.from(signature))
  ) {
    return res.status(401).end('Invalid signature');
  }
  const event = JSON.parse(req.body.toString('utf8'));
  // Skip an event_id you have already processed: a retry sends the same one.
  res.status(200).end();
});

Statuscodes

200 OK. GET liefert Konfiguration, Suchergebnisse, Katalog und Fragebogen, POST /quotes liefert das Angebot.
201 Created. POST /orders erfolgreich; Anfragenummer im Feld order_number.
402 Der Shop nimmt gerade keine neuen Widget-Anfragen an: Die Testphase ist abgelaufen oder das Abo gekündigt (TENANT_BILLING_INACTIVE), oder das Monatslimit an Anfragen ist aufgebraucht (TENANT_LIMIT_EXCEEDED).
403 Domain nicht erlaubt: Origin / Referer steht nicht auf der Shop-Freigabeliste (Fehler WIDGET_DOMAIN_DENIED), oder ein POST enthielt weder Origin noch Referer.
404 Unbekannter Widget-Schlüssel (Fehler WIDGET_NOT_FOUND), unbekannte Kategorie oder Anfragenummer.
422 Validierungsfehler: fehlende Antworten, inaktive Variante oder deaktivierte Kategorie.
429 Rate-Limit überschritten. Requests drosseln und später erneut senden.