Ixiters Welt jetzt auch mit Twitter und Facebook Share Buttons .. aber anders

Diese beiden Buttons findet man hier ab sofort unter jedem Artikel. Es sind sogenannte Share Buttons und dienen dazun es dir einfacher zu machen einen Artikel bei diesen Diensten zu posten.


Benutzt man die vorgeschlagenen Codes der Dienste, soll immer ein Link zu externen Dateien, ein Javascript oder ein iFrame auf der Seite eingebunden werden. Diese Codes telefonieren also immer irgendwie nach hause und der jeweilige Dienst erfährt schon beim bloßen betrachten einer Seite, dass der User xy diese Seite aufruft. An der Funktionalität der Buttons ändert das nichts. Also wozu der ganze Spökes?

Bei meinen Buttons werden keine Daten im voraus an die Dienste übertragen. Klickt ein User auf einen Button, wird in einem neuen Fenstar/Tab die Seite des Dienstes aufgerufen, um den Beitrag dort zu posten. Erst durch diesen Aufruf connected der User mit dem Dienst, was er natürlich immer machen muss, wenn er dort posten will. :)

Zwei Fliegen mit einer Klappe geschlagen. Ich wollte solche Buttons haben. Ich wollte nicht das sie nach hause telefonieren.

So gehts in WordPress

Einfach den gewünschten Code an der richtigen Stelle im Theme einfügen und fertig. Es kann natürlich ein beliebiges Bild benutzt werden. Wenn ihr die gleichen Bilder für die Buttons benutzen wollt wie ich, wäre es schön, wenn ihr die auf eure Server kopiert und die src im img Tag entsprechend ändert.

Twitter Share Button ohne Datenguck

  1. <a href=“http://twitter.com/share?text=<?php echo rawurlencode(strip_tags(get_the_title().‘ - ‘)) ?>&url=<?php echo rawurlencode(get_permalink()) ?> target=“_blank”><img src=“http://ixiter.com/wp-content/uploads/2011/06/twitter_share_btn.png” alt=“twitter share button ohne javascript etc.”></a>
(Sourcecode highlighting by Ixiters Hilighter)

Facebook Share Button ohne Datenguck

  1. <a href=“http://www.facebook.com/share.php?u=<?php echo rawurlencode(get_permalink()) ?>&t=<?php echo rawurlencode(strip_tags(get_the_title())) ?>><img src=“http://ixiter.com/wp-content/uploads/2011/06/fb_share_btn.png” alt=“fb share button ohne javascript etc.”></a>
(Sourcecode highlighting by Ixiters Hilighter)
Kurzlink: http://goo.gl/qtkBT

11 Gedanken zu “Ixiters Welt jetzt auch mit Twitter und Facebook Share Buttons .. aber anders

  1. Herzlichen Dank :)

    Genau das Problem hatte ich auch.
    Buttons: Ja
    Telefonieren: Nein

    Nun kann ich endlich auch solche Buttons einbinden ^^

  2. P.S.
    Ich seh gerade das die Codes nicht nicht “auflösen” wie gewollt…
    Nach dem einfügen stehen folgende Zeilen da:
    &url=“ target=“_blank”>“twitter
    &t=“>“fb
    Codefehler oder hab ich was übersehen? ^^’
    (Verträgt sich da evtl. der PHP code nicht mit meinem Blog?)

  3. @framerunner: OK, ich habs mir mal angeguckt. Du versuchst die obigen Codes in der Sidebar zu verwenden. Das hat so keinen Sinn. Die Codes beziehen sich auf einzelne Artikel, nicht auf das Blog insgesamt. Du musst die Codes also ins Template der Hauptseite und/oder ins Template der Artikel Einzelansicht einbinden.

    Du kannst Codes, die PHP enthalten, grundsätzlich nicht in Artikeln oder in Textwidgets in der Sidebar benutzen! Dort wird PHP von WP nicht mehr ausgeführt.

    Wenn du vor hattest, dass die User deine Seite bei FB oder Twitter posten können, kannst das in der Sidebar in einem Textwidget machen, musst dazu allerdings die PHP Codes durch Texte ersetzen.

    Folgender Code würde in deiner Sidebar funktionieren …

    <!-- Twitter Share Code -->
    <a href="http://twitter.com/share?text=framerunners+Blog+-+lesenswert!+-+&url=http://www.computerconfigteam.de/blog/framerunner/" target="_blank">
    <img src="http://ixiter.com/wp-content/uploads/2011/06/twitter_share_btn.png" alt="twitter share button ohne javascript etc.">
    </a>
    <!-- Facebook Share Code -->
    <a href="http://www.facebook.com/share.php?u=http://www.computerconfigteam.de/blog/framerunner/&t=framerunners+Blog+-+lesenswert!" target="_blank">
    <img src="http://ixiter.com/wp-content/uploads/2011/06/fb_share_btn.png" alt="fb share button ohne javascript etc.">
    </a>
    

    Die Textvorgabe kannst du varieren. z.B. kannst du beim Twitter Text noch ein @deintwittername einbauen, damit du auch immer sofort über diese Tweets informiert wirst. Bei Twitter musst du natürlich auch darauf achten, das der gesamte Text, inkl. der von Twitter konvertierten URL, nicht länger als 140 Zeichen wird.

  4. @ixiter: Aaah ^^
    Okay, das WP in der Sidebar auch kein PHP zulässt wusste ich auch noch nicht.
    (Warum ist mir das nich eingefallen? <_<)

    So funktioniert das ganze auch :)
    Danke!

  5. Gute Sache. Hab gestern gemerkt, dass mein Twitter-Sharer nicht mehr funktioniert, kommt also gerade rechtzeitig.
    Übrigens: Mit trim(get_option(‘home’), ‘/’) . ‘/?p=’ . $post->ID bekommst du die Blogeigene Kurz-URL (also example.com/?p=123). Okay, etwas unnütz, wenn t.co die URL automagisch kürzt. Wollte ich nur mal anmerken.

  6. @wemaflo: Eben :) Und da Twitter ja jetzt immer alles über t.co laufen lässt, kann man eigene Shortener bei Twitter vergessen.

  7. Da hast du auch Recht. Vielleicht sollte ich meinen eigenen Dienst auch mal wieder einstampfen, brauche ich ja für nichts anderes…

  8. Habe den Code für den Twitter-Button ohne Datenguck auch bei mir eingebaut und musste leider feststellen, dass die Sonderzeichen nicht korrekt ausgeliefert werden. Ich habe das Ganze jetzt mit urlencode(the_title()) und urlencode(the_permalink()) gelöst und nun klappt’s auch mit den Anführungszeichen. ;-)

  9. @Olaf: Hmm .. verstehe ich jetzt nicht, weil rawurlencode() konertiert ja auch die Umlaute.

  10. OK, ich war jetzt bei den Umlauten im speziellen, nicht bei den Sonderzeichen im Allgemeinen. Im Grunde kann man urlencode() oder rawurlencode() auch weglassen, da eh alle Browser das selber konvertieren.

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

*

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>