Facebook “Gefällt mir”-Button in WordPress-Theme integrieren

Bitte beachten: es gibt ein Update für dieses Tutorial! Bitte hier klicken!

****

Seit dem Facebook seine API geändert hat, ist es relativ einfach, Social Plugins wie “Gefällt mir” oder “Teilen” in die eigene Website zu integrieren. Hier will ich kurz zeigen, wie man den “Gefällt mir”-Button ohne WordPress-Plugin im eigenen Theme in der Einzelansicht eines Artikels integriert und so anpasst, dass der Permalink des entprechenden Artikels an Facebook weitergegeben wird.

So sieht der Button aus. Er soll am Ende des Artikels angezeigt werden.

Der Code, den man benötigt, ist kurz und simpel.

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink()); ?>" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px;" allowTransparency="true"></iframe>

Das ist die Minimalversion. Mit dem WordPress template tag “get_permalink()” wird die URL des aktuellen Artikels an Facebook weitergegeben.

Diesen Codeschnipsel muss man nun in das Template single.php des gewünschten WordPress-Themes einfügen. Im aktuellen Default-Theme und im neuen WordPress 3 Theme “Twenty Ten” am besten nach dem tag “<?php the_content() ?>”.

Das iframe kann man natürlich noch mit einem <div>-tag umgeben und mit CSS stylen und ausrichten und so dem eigenen Design anpassen. Außerdem bietet Facebook auf seiner Entwicklerplattform ein Tool an, um verschiedene Varianten zu erstellen. Der Code des von mir verwendeten Buttons sieht z.B. so aus:

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink()); ?>&amp;layout=standard&amp;show_faces=false&amp;width=500&amp;action=like&amp;font=trebuchet+ms&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:500px; height:px"></iframe>

Wie man weitere Social-Buttons wie “Bei Facebook posten” oder “Twittern” integriert, erkläre ich in Kürze.

5 Gedanken zu “Facebook “Gefällt mir”-Button in WordPress-Theme integrieren

  1. Pingback: Tweets die Facebook “Gefällt mir”-Button in Wordpress-Theme integrieren | Matthias Pabst erwähnt -- Topsy.com

      • Hallo Matthias,
        vielen Dank für die Antwort.
        Hab`s mittlerweile selbst gefunden. War eine Einstellung in IncrediMail was ich z. Zt. nutze.
        Weiß aber nicht wer diese Einstellung vorgenommen hatte – manche Sachen kommen eh total suspect vor. Seitdem ich ein paar Schuhe bei Zalando bestellt hatte, werde ich von Zalando regelrecht verfolgt, nahezu jede Webside die ich aufrufe, beinhltet Zalando Werbung und grad “zufällig” die für die ich mich interessiert hatte. Egal – danke Dir und schönen Sonntag noch.
        Gruß Frede

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>