Skip to content

Amazon Referrerlinks per CSS kennzeichnen

Eine sehr elegante Lösung für Partnerlinks zu Amazon habe ich bei Felix Schwenzel gefunden. Er verweist auf ein paar Zeilen CSS die hinter jeden Partnerlink zu Amazon ein kleines Amazon-Logo setzt um ihn kenntlich zu machen. Wirklich simpel:

a[href*=“stdlw-21”]:after { content: url(“data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAABKUlEQVQ4jaXTvyuGURQH8A9KEVEMBpkok/wYlBiMLAws/gFlMJgNyiQGgxSzzSoDpRQ26V3YyCA/FskkvAzv1fs4PW8Gp07Pved8v9/nnHvu5Z9WVSHejnF0oIhr7OPpL8FGbOEDX8HfsILaSuQWFALpM3k2doz6vFaOAnEeDajDbBDaiQJT4S8XaMMulhLmMmCGoDolZ4JgL/ZwjsMUew2YmaxAX0ieYjCtJ9P3K2D6swJNIXmi1PO08uhuAqY5K/AYkmNJdCARO3MquM9uNpUPZzWRXvGQid+mitbTfpHyTexROvlqPGNO6TKNpPxlamU4ibSiC3fZKtb8HlMBG6m6s5BbkGM12A7A6EUs55GzNqE8hR/iOw4wGsGVXiOlt9GdhK7wkgf6BoarY5Bw4HxiAAAAAElFTkSuQmCC”); margin: 0 0 0 3px; opacity:0.6; }

Partnerlinks zu Amazon sind also ab sofort hier entsprechend gekennzeichnet. Und irgendwie hab ich das Gefühl, dass man damit auch noch andere lustige Dinge machen kann, mal draufrumdenken smile

Trackbacks

Keine Trackbacks

Kommentare

Ansicht der Kommentare: Linear | Verschachtelt

hwiedermann am :

Auf Twitter lesen: H_Wiedermann
hwiedermann

Vielen Dank für den Code – hat super geklappt.

Allerdings habe ich nun die Frage:
Was ist wenn ich ein Bild verlinke? Gibt ne Möglichkeit das auszugrenzen, wenn der Link auf einem Bild platziert ist?

rowi am :

Auf Twitter lesen: rowi
rowi

Das ist vermutlich schwer, man müsste ein CSS formulieren das sagt “alle a href, aber nicht wenn darin ein img Tag folgt”.
Spätestens wenn ein Link sowohl Text als auch Bild beinhaltet wird das schwer. Jede Kombination die mir gerade einfällt wäre nicht allgemeingültig.
Im Rahmen eines CMS wie Serendipity oder Wordpress sollte es aber gehen innerhalb des div das die Bilder einschliesst das a wieder neutral zu definieren. Müsste ich hier auch mal machen wink

rowi schrieb auch: gelesen: The Martian

Kommentar schreiben

Textile-Formatierung erlaubt
Standard-Text Smilies wie :-) und ;-) werden zu Bildern konvertiert.
Umschließende Sterne heben ein Wort hervor (*wort*), per _wort_ kann ein Wort unterstrichen werden.
Die angegebene E-Mail-Adresse wird nicht dargestellt, sondern nur für eventuelle Benachrichtigungen verwendet.
Twitter, Identica, Pavatar, Gravatar, Wavatars, Monster ID Autoren-Bilder werden unterstützt.
Wenn Du Deinen Twitter Namen eingibst wird Deine Timeline in Deinem Kommentar verlinkt.
Bewirb einen Deiner letzten Artikel
Dieses Blog erlaubt Dir mit Deinem Kommentar einen Deiner letzten Artikel zu bewerben. Bitte gib Deine Blog URL als Homepage ein, dann wird eine Auswahl erscheinen, in der Du einen Artikel auswählen kannst. (Javascript erforderlich)
Formular-Optionen