Affiliate-Boxen auf statischen Seiten einbetten: ohne WordPress, ohne Plugin

Affiliate-Boxen auf statischen Seiten einbetten: Script-Tag, data-affilinode-Platzhalter, Domains und Schlüssel erklärt, ganz ohne WordPress und Plugin.

affilinode · · 4 Min. Lesezeit

Affiliate-Boxen auf einer statischen Seite einzubetten funktioniert ohne WordPress und ohne Plugin. Wenn deine Seite nur aus HTML-Dateien besteht, reichen zwei Dinge: ein Script-Tag, das einmal geladen wird, und ein kleiner Platzhalter an der Stelle, an der die Produktbox erscheinen soll. Das Script ersetzt den Platzhalter beim Laden durch die Box mit deinen Affiliate-Links. Dieser Beitrag zeigt dir, wie du den Schlüssel anlegst, den Code erzeugst und die Box in deine Seite einfügst, und worauf du bei Domains und Klicks achten solltest.

Was du für eine statische Seite brauchst

Für die Einbettung brauchst du kein Content-Management-System. Es genügt eine HTML-Seite, in die du Code einfügen kannst, und ein Konto bei affilinode. Die Affiliate-Links in den Boxen tragen die Tracking-IDs der Website, zu der der Schlüssel gehört. Deshalb legst du zuerst die Website im Dashboard an und tust das nicht für jede Seite einzeln.

So richtest du die Einbettung ein

  1. Öffne unter „Websites“ deine Website oder lege sie an. Trage bei „Domains“ die Domains ein, auf denen die Boxen erscheinen sollen. Du kannst sie mit Zeilenumbruch oder mit Komma trennen.
  2. Wähle den Bereich „Einbettung“ und klicke auf „Schlüssel anlegen“. Den Bereich sehen nur Owner und Admins.
  3. Öffne unter „Code erstellen“ die gewünschte Darstellung, suche das Produkt oder wähle eine Liste und passe das Aussehen an. Die Live-Vorschau zeigt die Box mit echten Daten.
  4. Klicke auf „Code kopieren“ und füge den Code in deine Seite ein.

Das Script-Tag braucht jede Seite nur einmal. Die Platzhalter darunter bestimmen, welche Box wo erscheint. Ein typischer Code sieht so aus, wobei pk_live_… für deinen eigenen Schlüssel steht und die Produkt-IDs Platzhalter sind:

<script src="…/embed.js" data-key="pk_live_…" data-theme="auto" async></script>
<div data-affilinode="product" data-id="asin:B0XXXXXXXX"></div>
<div data-affilinode="compare" data-ids="asin:B0XXXXXXXX,asin:B0YYYYYYYY"></div>

Die Produktbox steht an der Stelle, an der der erste div im HTML steht. Der Vergleich darunter erscheint an seiner eigenen Stelle.

Welche Platzhalter gibt es?

Alle Box-Arten stehen für statische Seiten zur Verfügung. Mit data-id sind das:

  • product für die Produktbox,
  • compact für eine kompakte Zeile,
  • offers für den Preisvergleich,
  • button für den Kaufen-Knopf,
  • card für die Produktkarte,
  • price-history für den Preisverlauf, zusammen mit data-days,
  • spare-parts für Ersatzteile.

Mit data-ids gibt es grid für Karten nebeneinander und compare für eine Vergleichstabelle mit bis zu 6 Produkten. Mit data-list="<Listen-ID>" oder data-view="<Sicht>" zeigst du eine Bestenliste, picker lässt Leser selbst vergleichen, und deals zeigt Produkte mit gesunkenem Bestpreis. Weitere Angaben sind data-title für eine eigene Überschrift, data-title-style="short" oder "detailed" und data-limit.

Am Script-Tag stellst du außerdem data-locale, data-country, data-theme und data-accent ein. Hat die Seite ein <html lang>-Attribut, übernimmt das Script die Sprache auch ohne data-locale.

Domains, Schlüssel und abgewiesene Domains

Die Domains beim Schlüssel entscheiden, wo die Boxen erscheinen. beispiel.de gilt mit und ohne www, *.beispiel.de gilt für alle Subdomains. Ohne eingetragene Domain funktioniert der Schlüssel nirgends.

Ruft eine nicht freigegebene Domain die Boxen ab, bleiben sie dort leer. Solche Domains listet das Dashboard unter „Abgewiesene Domains (30 Tage)“ beim Schlüssel und zusätzlich als Aufgabe. Gehört die Domain dir, klickst du auf „Freigeben“. Gehört sie nicht dir, wurde dein Code kopiert. Dann widerrufe den Schlüssel und lege einen neuen an.

Der Schlüssel steht im Quelltext der Seite, kann aber nur lesen und wirkt nur auf den freigegebenen Domains. Trotzdem solltest du ihn nicht in fremde Seiten kopieren.

Klicks, Statistik und Kontingent

Klicks in eingebetteten Boxen werden gezählt und im Dashboard ausgewertet. Unter „Klicks je Darstellung (30 Tage)“ siehst du, wie oft welche Darstellung sichtbar war und geklickt wurde. Mit data-analytics schickst du Klicks auf Shop-Links zusätzlich an Google Analytics 4, den Google Tag Manager, Umami oder Matomo. Das benannte Ereignis legst du mit data-analytics-event fest, Standard ist affiliate_click.

Abrufe zählen zum API-Kontingent deines Tarifs; dieser Wert ist ein Richtwert und kein hartes Limit. Die Live-Vorschau im Dashboard zählt dagegen nicht.

Amazon-Angebote auf der statischen Seite

Bei Amazon gelten strengere Regeln. Preise dürfen höchstens 24 Stunden alt sein, und das Script blendet ältere Preise aus. Stattdessen erscheint der Button „Aktuellen Preis ansehen“. Den Zeitraum legst du mit data-max-age fest, der Standard sind 24 Stunden. Bei Amazon gilt aber nie mehr als 24 Stunden. Mit data-price-age zeigst du, wann der Preis aktualisiert wurde.

Für Amazon-Angebote gibt es außerdem keinen Preisverlauf und keinen Preisalarm. Klicks auf Amazon-Links gehen direkt zu Amazon. Amazon-Links gehören zudem nicht in gedrucktes Material.

Häufige Fragen

Muss ich für jede Seite einen neuen Schlüssel anlegen? Nein. Ein Schlüssel gehört zu einer Website und kann mehrere Domains abdecken. Wichtig ist nur, dass die Domain der Seite freigegeben ist.

Warum bleibt meine Box leer? Meist ist die Domain nicht freigegeben. Prüfe den Schlüssel unter „Abgewiesene Domains“. Ist die Domain deine eigene, gibst du sie dort frei.

Kann ich Boxen nachträglich laden, etwa in einer Single-Page-App? Ja. Für Seiten, die Inhalte nachladen, gibt es die JavaScript-API affilinode.scan(). Damit verarbeitet das Script neu eingefügte Platzhalter.

Brauche ich eine Installation auf dem Server? Nein. Die Einbettung ist ein Script im Browser des Besuchers. Du fügst nur Code in deine HTML-Seite ein.

Eine Anleitung mit allen Attributen findest du unter Produktboxen ohne WordPress einbetten.

14 Tage kostenlos testen

Probier die Einbettung auf einer Testseite aus, bevor du sie auf deiner Website einsetzt. Du kannst 14 Tage kostenlos testen. Alle Tarife und ihre Leistungen findest du unter /preise.