DruckversionAdd-Buttons einbinden
Allgemeine Syntax
Möchten Sie einen Button zu Mister Wong hinzufügen, dann erstellen Sie einen Link, innerhalb dessen Sie den Button von Mister Wong als Bild einfügen:
<a href="http://www.mister-wong.de/add_url/?action=addurl&bm_url=http://www.example.com/&bm_description=Add_Buttons" title="Diese Seite zu Mister Wong hinzufügen"><img src="http://static.mister-wong.de/buttons/logo20.gif" alt="Diese Seite zu Mister Wong hinzufügen" style="border: none" /></a>
Im Beispiel wird der Button - das Bild von Mister Wong - direkt verlinkt. Es steht innerhalb eines a-Elements.
Buttons lokal abspeichern
Wenn Sie mehrere Buttons einbinden, sollten Sie die Buttons vorher lokal auf Ihrem Webspace abspeichern und beim src-Attribut des img-Elements dorthin verweisen.
Entscheidend ist die URL, die bei href angegeben ist.
http://www.mister-wong.de/add_url/?action=addurl&bm_url=http://www.example.com/&bm_description=Add_Buttons
Hinter der URL http://www.mister-wong.de/add-url/ werden nach einem Fragezeichen ? die notwendigen Parameter übergeben. Die einzelnen Parameter werden durch & aneinander gehängt.
action=addurl bedeutet, dass eine URL bei Mister Wong eingetragen wird.
Mit bm_url=http://www.example.com wird beispielsweise die URL http://www.example.com aufgenommen.
bm_description=Add_Buttons gibt den Titel der Webseite an, der dann schon voreingetragen ist.
Der Text, der beim Attribut title im Linkelement a steht, wird als Tooltipp angezeigt, wenn man mit der Maus über den Button fährt.
standardkonform
Bei der Übergabe per URL werden mehrere Parameter durch & getrennt aneinander gefügt. Wenn das Ganze standardkonform sein soll, damit ein Überprüfungsprogramm wie der Validator vom W3C nicht meckert, sollten Sie das &-Zeichen durch & ersetzen.
Rahmen um Button entfernen
Verlinkte Bilder erhalten normalerweise einen blauen Rahmen. Diesen können Sie per HTML oder CSS abschalten. Für eine HTML-Lösung notieren Sie bei jedem Bild border="0". In CSS lautet die entsprechende Angabe wie im Beispiel:
<img src=" ... " .... style="border: none" />
Eleganter ist es, im Stylesheet den Rahmen für alle Bilder innerhalb von Links über folgende Regel zu entfernen:
a img { border: none; }
Dies ist eine Leseprobe
Möchten Sie den Beitrag komplett lesen? Dann werden Sie Probemitglied und testen Sie akademie.de 14 Tage kostenlos!
Auf Social Bookmarks: Add-Buttons einbinden erfahren Sie mehr über diesen Beitrag und die weiteren Leseproben.
Weitere Informationen finden Sie auf unserer Infoseite zur Mitgliedschaft und in unseren AGB.
Ich bin bereits Mitglied