AddToAny – Social Bookmarks

Für mich ist es immer noch überraschend, dass es auf WordPress.com mit der Einbindung von Social Bookmarks in den eigenen Artikeln schlecht bestellt ist. Damit meine ich die praktischen Buttons unter Artikeln in vielen selbst gehosteten Blogs, die es den Lesern erlauben, interessante Artikel durch einfachen Klick auf Digg, Facebook, Mr.Wong & Co in ihren Profilen abzulegen.

Es gibt zwar die Möglichkeit eines Digg Buttons, aber das Prozedere ist sehr arbeitsaufwendig und deckt zudem nur einen Dienst ab. Torsten hat sich für Mister Wong und dessen Button auch um eine WordPress.com kompatible Lösung bemüht. Aber auch hier ist der Arbeitsaufwand und die Einstiegshürde sehr hoch.

Abgesehen davon ist das die einzige Möglichkeit, einen Button direkt im Artikel abzulegen.

Der AddThis Dienst ist leider nur etwas für die Seitenleiste bzw. ein Text Widget. Damit kann der geneigte Leser also nur das Blog, aber nicht einen bestimmten Artikel ablegen.

Die von vielen Bookmarkdiensten im Internet angebotenen Lösungen fallen für WordPress.com leider auch flach, das fast alle den Einsatz von Javascript voraussetzen. Dieses wird aber aus Sicherheitsgründen auf der Plattform ausgefiltert.

Dieser Umstand hat zur der bekannten Lösung GetSocial bzw. GetSocialLive geführt, die diese Klippe umschiffen soll. Die Desktop Anwendung läuft allerdings nur unter Windows und die eingebetteten Icons werden natürlich von einem Drittserver referenziert. Sollte der mal ausfallen oder den Dienst einstellen, hat man eine Unmenge von defekten Links in seinen Artikeln. Zudem wirkt sich das ganze nicht vorteilhaft auf die Ladezeiten des eigenen Blogs aus.

Glücklicherweise hat sich vor einem halben Jahr der Dienst AddToAny.com den WordPress.com Bloggern angenommen, und sein Angebot dementsprechend angepasst. Das verschafft zumindest ein bisschen Linderung, auch wenn eine in WordPress.com implementierte Lösung immer noch das Beste wäre.

Wie funktioniert die Geschichte mit AddToAny also? Hübsch und einfach der Reihe nach. 🙂

  1. Zuerst ein Besuch auf AddToAny.com
  2. Dort klickt ihr auf Get the Share Button
  3. Unten auf der Seite findet ihr unter Or choose one of the following: einen WordPress.com Link
  4. Auf dieser folgenden Seite schlägt euch die Seite eine Buttongrafik vor. Näheres dazu später.
  5. Weiter unten findet ihr einen grauen WP.com Share Button. Klickt diesen mit der Maus an, und zieht ihn einfach in die Lesezeichensymbolleiste eures Browsers.
  6. Voilà, geschafft. Jetzt habt ihr ein AddToAny Bookmarklet erstellt

Bevor wir uns damit beschäftigen, was wir mit diesem Bookmarklet anstellen, noch ein paar Worte zur Buttongrafik.

Sollte euch die vorgeschlagene Buttongrafik nicht gefallen, oder nicht mit eurem Blogdesign harmonieren, bietet AddToAny euch an, eine eigene Grafik zu benutzen. Ihr könnt euch entweder im Flickr Pool nach einer geeigneteren Grafik umsehen, oder bei genug ausreichendem Talent mit einem Bildbearbeitungsprogramm eurer Wahl eine eigene Grafik erstellen.

Egal für was ihr euch entscheidet, wichtig ist, am Ende die Grafik in das eigene Blog hochzuladen. Wie das funktioniert, solltet ihr ja wissen, ansonsten hilft euch vielleicht die entsprechende Supportseite weiter. Wenn das erledigt ist, gilt es sich die FILE URL, also die Internetadresse des Bildes, zu kopieren.

Diese fügt ihr auf der AddToAny Seite in das Textfeld ein, klickt auf Change Button und zieht erst dann den WP.com Share Button in eure Lesezeichensymbolleiste. Soviel dazu.

Jetzt haben wir also unser AddToAny Bookmarklet, aber wie funktioniert das Ganze? Folgendermaßen:

  1. Artikel schreiben und wenn er fertig ist auf „Veröffentlichen“ klicken
  2. Wenn ihr die Bestätigung erhaltet, dass der Artikel veröffentlicht wurde einfach einmal auf das Bookmarklet in der Lesezeichensymbolleiste klicken, und der Code für den Button wird automatisch in euren Beitrag eingefügt.
  3. Jetzt nochmal den Artikel aktualisieren und es ist geschafft

Jetzt sollte ein entsprechender Button euren Artikel zieren, über den der Leser euren Beitrag komfortabel in seinem bevorzugten Dienst ablegen kann. Diese Lösung hat den Vorteil, dass AddToAny die Liste der verfügbaren Dienste pflegt und neue Dienste ohne euer Zutun für eure Leser sofort verfügbar sind.

Achtung:

Im Lauf meiner Recherche habe ich herausgefunden, dass das AddToAny Bookmarklet zwingend den grafischen Editor voraussetzt. Solltet ihr diesen so wie ich deaktiviert haben, wird das Bookmarklet nicht funktionieren.

Auf der AddToAny Seite habe ich einen entsprechenden Hinweis vermisst. Auch eine E-mail an AddToAny.com, in dem ich sie auf darauf hingewiesen habe, dass das Bookmarklet unter gewissen Umständen nicht funktioniert, ist bisher unbeantwortet geblieben. 😦

Deswegen habe ich in den letzten Tag selbst ein kleines Bookmarklet zusammengestrickt, das auch für Leute ohne den grafischen Editor seinen Dienst verrichten sollte. Da wie gesagt Javascript Code ausgefiltert wird, kann ich hier leider kein klickbares Bookmarklet erstellen.

Ihr müsst also manuell ein Lesezeichen erzeugen, den unten angegebenen Code kopieren und dann in das Adressfeld eures Lesezeichens einfügen. Abspeichern und ihr habt es geschafft.

javascript:var%20edtr=document.getElementById("content");edtr.value+="\n<p><a%20href=\"http://www.addtoany.com/share_save?linkurl="+encodeURIComponent(document.getElementById("sample-permalink").firstChild.data+document.getElementById("editable-post-name-full").firstChild.data+"/")+"&amp;linkname="+encodeURIComponent(document.getElementById("title").value).replace(/'/g,'%2527')+"\"><img%20src=\"http://static.addtoany.com/buttons/share_save_256_24.png\"%20alt=\"Verteilen\"%20/></a></p>";void(0);

Sollte euch die verwendete Grafik nicht zusagen, müsst ihr ziemlich am Ende des Codes den „src“ Parameter des „img“ Tags ändern und hier die FILE URL einer alternativen Grafik einfügen.

Getestet habe ich das ganze nur in meinem Firefox 3.0.15. Über andere Browser kann ich mangels Alternativen nichts sagen.

Nachtrag:

carluv bestätigt, das mein kleines Bookmarklet auch unter Opera 10.1 am Mac seinen Dienst verrichtet. Gleiches gilt für das ursprüngliche AddToAny Bookmarklet.

Nachtrag 2:

Torsten hat herausgefunden, dass AddThis entgegen meiner Aussage weiter oben, doch das Speichern einzelner Artikel unterstützt.

Ruft ein Leser eures Blogs also einen eurer Artikel auf (BLOGNAME.wordpress.com/JAHR/MONAT/TAG/Titel), statt ihn in der Gesamtübersicht (BLOGNAME.wordpress.com) zu lesen, wird bei einem Klick auf den AddThis Button die komplette URL an den jeweiligen Dienst übertragen.

Trotzdem bleibe ich dabei, dass der durchschnittliche Leser die Social Bookmarks unter dem Artikel erwartet statt in der Seitenleiste. Im Zweifel entsteht also bei der AddThis Lösung ein gewisser Erklärungsbedarf oder man läuft Gefahr, dass der Leser nicht von dieser Funktion erfährt.

Auf der anderen Seite weist Torsten darauf hin, dass AddToAny im Gegensatz zu AddThis nicht den deutschen Ableger von Mister Wong unterstützt. Ein Anmelden mit den deutschen Login Daten auf der .com Seite von Mister Wong ist nämlich nicht möglich.

Advertisements

23 Gedanken zu “AddToAny – Social Bookmarks

  1. Der AddThis-Button sendet tatsächlich die aktuelle Seite und nicht nur das Blog. Gerade getestet.

    Und noch etwas habe ich beim Testen herausgefunden: Im Gegensatz zu AddtoAny.com schickt mich Addthis inzwischen auch zum deutschen Mister Wong (und nicht zu Mister-Wong.com, wie AddtoAny). Leider kann man sich mit seinem deutschen Account nämlich nicht bei Mister-Wong.com anmelden…

    Fazit: Addthis im Text-Widget ist einfacher und schneller.

    • Hallo Torsten,

      bist du wirklich sicher, was das mit der aktuellen Seite angeht? Egal auf welcher deiner Unterseiten/Artikelseiten ich unterwegs bin, der Code des AddThis Buttons ändert sich nicht.

      Ich sehe auch nicht, wie da der Titel des Artikels/die URL übergeben wird. Javascript?

      Aber selbst wenn, ist das aus Usability Gesichtspunkten keine ideale Lösung. Normalerweise erwartet man die Social Bookmarks doch unter dem Artikel und nicht in der Seitenleiste.

      Wenn ich das richtig verstehe, muss man für den AddThis Button auf alle Fälle immer den einzelnen Artikel aufrufen. Aus der Übersicht heraus würde er immer nur das Blog bookmarken, oder?

      Kann man sich das Ergebnis eigentlich irgendwo auf deinem Mister-Wong Profil mal ansehen? Kann das leider mangels eigenem Mister Wong Profil nicht selbst testen. Will es aber auch nicht ohne den sichtbaren Beweis im Artikel nachtragen/ergänzen. 🙂

      • Der Code ändert sich natürlich nicht, aber es wird definitiv die aktuelle Seite genutzt. Das kann man auch ohne Mister-Wong Profil testen, da AddThis eine Frame-Seite einfügt, die oben als Navigationsframe den aktuellen Link (und nicht nur das Blog!) anzeigt. Kannst Du in meinem Blog ausprobieren.

      • Als ich mein RefControl Addon im Firefox deaktiviert habe, wurde im iFrame der Titel der aktuellen Seite angezeigt. Es funktioniert also tatsächlich.

        Trotzdem bleibt für mich der Punkt der Usability. Der User erwartet die Bookmarks normalerweise unter dem Artikel statt in der Seitenleiste.

        Der zweite Punkt ist die Tatsache, dass es nur funktioniert, wenn man in der Artikelansicht unterwegs ist. In der Übersicht (blogname.wordpress.com) bookmarked AddThis im Gegensatz zu den AddToAny Links logischerweise nur das Blog.

        Werde das trotzdem mal im Artikel nachreichen. Dank dir auf alle Fälle für deinen umfangreichen Test. 🙂

        Nachtrag:
        Kann es übrigens sein. dass du in deinem Blog keinen Blavatar konfiguriert hast? Dein Pingback zeigt nämlich keinen Avatar in der Seitenleiste.

  2. Pingback: Mister Wong-Button auf WordPress.com per Referrer pimpen « Netztaucher

  3. Ich habe tatsächlich keinen Blavatar eingerichtet. Wollte das schon lange mal gemacht haben …

    Der AddThis-Code kann auch (leider nur manuell) unter jeden Artikel gesetzt werden:
    http://starthilfe.wordpress.com/2009/11/18/bookmark-test/

    Aber natürlich nimmt er immer noch nur den Referrer als URL-Angabe, so dass z.B. ein Klick auf den Button in einer Kategorie-Ansicht eben genau diese Kategorie-Seite bookmarken würde.

    Es ist halt nicht perfekt …

  4. Nachtrag:
    Man kann den AddThis-Code aber ganz einfach auf eine explizite URL umstellen, in dem man folgenden Text an den Linktext anhängt „&url=http://www.google.de“. Wobei natürlich die URL entsprechend zum Artikel wird.

    • Damit wäre das ja prinzipiell das gleiche wie die AddToAny Lösung, oder? Da fügt man den Link ebenfalls nur manuell ein, auch wenn das ein Boomarklet erledigt.

      Wie hast du das eigentlich mit dem URL Parameter herausgefunden? Einfach ausprobiert?

  5. Ja, im Prinzip ist das nicht viel anders. Und ein Bookmarklet könnte man sich dafür natürlich auch bauen.

    Der URL-Parameter ist mit einem Blick in den Quelltext leicht zu erraten (ID- bzw. Name-Attribut des Input für die URL).

    • Wobei es der pub Parameter natürlich schwer macht, ein allgemein gültiges Bookmarklet zu erstellen, da er offenbar Userbezogen ist.

      Der URL-Parameter ist mit einem Blick in den Quelltext leicht zu erraten

      Da stehe ich wohl gerade auf der Leitung. Den Quelltext welcher Seite meinst du damit? Würde das gerne nachvollziehen. 🙂

  6. Ich benutze das Plug-In, allerdings sind mir dort viel zu viele Services aufgelistet. Wie bekomme ich diese denn Weg? Wenn ich die „Services.php“ editiere, bzw. Zeilen lösche, werden trotzdem noch alle Dienste angezeigt…

Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s