Werbelinks auch in Blogs sollen gekennzeichnet werden. Aber wie?
Werbelinks im Blog müssen gekennzeichnet sein. Dazu gehören auch die sogenannten Affiliate Links, die viele Blogger verwenden, um damit bei einem Kauf über den Link eine kleine Provision zu verdienen. Ich tue das auch, ausschließlich mit Amazon-Links, wie zum Beispiel hier: Panasonic Lumx G81. Aber wer solche Links nicht kennzeichnet, der verstößt damit zum einen gegen die Amazon-Richtlinien. Und solche Links sollen außerdem einen Verstoß gegen das Gesetz gegen unlauteren Wettbewerb darstellen.
Kennzeichnung oder nicht ist also keine Frage. Bleibt nur noch offen, wie man vorgeht. Schließlich sollen auch ältere Links einer Website erfasst werden. Und die *Sternchen-Lösung halte ich für wenig praktikabel. Dazu soll man händisch einen Stern hinter jeden Affiliate-Link setzen und das Sternchen – wie in Print-Produkten – am Fuß der Seite oder des Beitrags erklären. Aber da ich auf diversen Websites schon öfters nach diverse Sternchen-Erläuterungen gesucht habe (nicht immer erfolgreich) bin ich kein Fan dieser Lösung.
Werbelinks – eindeutig
Auf der Suche nach einem vernünftigen Plugin bin ich leider gescheitert. Ich hatte eine Zeit lang das Plugin Link Indication im Einsatz. Aber das kennzeichnet nur externe Links als solche. Damit ist noch nicht die Werbe- oder Affiliate-Funktion erklärt.
Auf der Suche nach einer CSS-Lösung, die auch alle alten Links meiner Blogs erfasst, bin ich auf diesen Artikel gestoßen: Affiliate Links im Inhalt mit CSS markieren.
Dort wird empfohlen, einen einfachen CSS-Selektor zu schreiben, der an jeden Link einen Text anhängt. Enthält der Link zum Beispiel „recommends“ würde die Anweisung lauten:
a[href*="/recommends/"]:after {
content: " (Werbelink)";
}
Das funktioniert schon recht gut. In den Kommentaren wird als Ergänzung noch eine farbliche Hervorhebung und Hochstellung angefügt, so dass für mich für die Amazon-Kurzlinks also folgendes herauskam.
a[href*="/amzn.to/"]:after {
content: " (Werbelink)";
color: #de2723;
vertical-align: super;
}
Und weil es früher auch mal die langen Links gab mit www.amazon.de habe ich noch folgendes hinzugefügt:
a[href*="/www.amazon.de/"]:after {
content: " (Werbelink)";
color: #de2723;
vertical-align: super;
}
Nachtrag: Nach dem Kommentar von Bernhard habe ich das nach seinem Muster geändert. Der Code sieht dann so aus:
a[href*="/amzn.to/"]:after,
a[href*="/www.amazon.de/"]:after {
content: " (Werbelink)";
color: #de2723;
vertical-align: super;
text-decoration: none;
display: inline-block;
padding-left: 3px;
font-size: smaller;
}
Danke für die Ergänzung!
Wohin damit?
Wer ein Standardtheme wie twentyseventeen benutzt, der kann das im CSS-Stylesheet an den Schluss setzen. Die Datei style.css findet sich hier: ../wp-content/themes/twentyseventeen/style.css. Wer ein Kauf-Theme nutzt oder ein Baukasten-System, der sollte nach einer Möglichkeit suchen, im Administrationsbereich „Custom CSS“ einzufügen. Und wer (noch) kein Child-Theme nutzt, der muss das nach jedem WordPress-Update wieder neu einfügen.
Diese Lösung bekommt sicher keinen Schönheitspreis. Aber ich finde sie so offensichtlich und so ehrlich, dass ich mir keine Sorgen zu machen brauche, es könnte jemand etwas falsch verstehen.
