Twitter, Facebook, Google+ in WordPress Widget einbindenEmbedding Twitter, Facebook and Google+ widgets into your WordPress website

Es gibt zwar eine große Menge WordPress Plugins, die es einem erlauben, die eigenen Social Media Kanäle per Widget in die eigene Website einzubinden. Allerdings gilt es zu beachten, dass jedes aktive Plugin sich negativ auf die Ladezeit der Website auswirkt. Zusätzlich laden zum Beispiel ein Plugin für den Facebook Like Button, eines für das Like-Box-Widget und ein weiteres Plugin für Facebook Kommentare alle erneut das gleiche Skript.

Eine ganz einfache Lösung ist daher, die Widgets der drei großen Social Media Netzwerke manuell einzufügen. Hier erklären wir, wie das geht:

Twitter Widget

Ein Twitter Widget zu erstellen ist wirklich ganz einfach: Loggen Sie sich in Ihren Twitter Account ein und gehen dann zu Ihren Twitter Account Einstellungen. In dem Submenü, das linkerhand auftaucht, finden Sie ganz unten den Punkt „Widget“. Klicken Sie dann einfach auf den Button „Neu erstellen“ und Sie gelangen direkt zur Konfiguration Ihres Twitter Widgets. Sie können die Farbe der Links und andere Einstellungen vornehmen und sehen direkt daneben, wie das fertige Widget aussehen wird.

Wenn alles so ist, wie Sie es gerne haben möchten, klicken Sie einfach auf den blauen Button „Widget erstellen“. Direkt rechts neben dem Button wird Ihnen dann der Quellcode angezeigt, den man für die Einbindung des Widgets in Ihre Website braucht.

twitter widget code <!  :de  >Twitter, Facebook, Google+ in WordPress Widget einbinden<!  :  ><!  :en  >Embedding Twitter, Facebook and Google+ widgets into your WordPress website<!  :  >

Diesen Code kopieren Sie sich und fügen ihn in ein WordPress Text-Widget ein.

Google+ Badge

Eine Google+ Badge zu erstellen ist auch nicht schwer. Die Erstellung erfolgt direkt auf der Google Seite zur Google+ Badge. Nach Auswahl der Google+ Seite oder des Google+ Profils sieht man direkt daneben, wie es später aussehen wird. Der Code, der direkt unter der Vorschau angezeigt wird, kann wiederum in ein Text-Widget kopiert werden.

googleplus badge code <!  :de  >Twitter, Facebook, Google+ in WordPress Widget einbinden<!  :  ><!  :en  >Embedding Twitter, Facebook and Google+ widgets into your WordPress website<!  :  >

Hier ist allerdings ein bisschen Vorsicht geboten, denn das Google Skript wird innerhalb des Widgets ggf. nicht geladen! Sollte das passieren und sich das Widget nicht richtig anzeigen, kontaktieren Sie uns.

Facebook Like-Box

Die Like-Box für Facebook Fanseiten kann direkt auf der Facebook Entwickler Seite erstellt werden. Alles, was man dafür braucht, ist der URL-Name der eigenen Fanpage.

Wenn die Fanseite noch weniger als 25 Likes hat, besteht die URL der Fanseite aus pages/NamederSeite/1456985237. Markieren Sie einfach die gesamte URL bis vor das ggf. angezeigte ? und kopieren Sie alles in die Facebook Developer Seite zur Erstellung der Like-Box.

Hat Ihre Fanseite mehr als 25 Likes, aber trotzdem noch die hässliche lange URL mit Ziffern etc., dann sollten Sie für deine Fanseite einen Usernamen erstellen. Dies kann man im Administrationsbereich der eigenen Fanseite in den „Allgemeinen Einstellungen“ tun. Diesen Usernamen tragen Sie dann auf der Facebook Entwickler Seite ein hinter das bereits angezeigte „http://www.facebook.com/“.

Sobald Sie nun mit den weiteren Einstellungen fortsetzen, erscheint rechterhand die Vorschau Ihres Facebook Widgets. Hier zeigen wir Ihnen ein Beispiel, wie die Like-Box konfiguriert sein kann:

facebook like box widget <!  :de  >Twitter, Facebook, Google+ in WordPress Widget einbinden<!  :  ><!  :en  >Embedding Twitter, Facebook and Google+ widgets into your WordPress website<!  :  >

Wenn Sie mit der Darstellung zufrieden sind, klicken Sie auf den „Get Code“ Button. Sie haben hier mehrere Auswahlmöglichkeiten:

a) Gibt es auf Ihrer Webseite den Facebook Like Button oder Facebook Kommentare? Wenn ja, dann können Sie getrost den 2. Teil des HTML5 Codes kopieren und in ein Text-Widget in Ihr WordPress einfügen.

b) Wenn auf Ihrer Webseite bisher kein Facebook Element auftaucht (weder Like-Button noch Kommentare von Facebook usw.), dann können Sie auf der „Get Code“ Ansicht auf „iframe“ klicken. Den dort angezeigten Code können Sie nun kopieren und in ein Text-Widget in Ihr WordPress einfügen.

Noch Fragen?

Keine Sorge, wir stehen Ihnen mit Rat und Tat zur Seite und helfen Ihnen bei der Einbindung Ihrer Social Media Kanäle. Nehmen Sie einfach Kontakt zu uns auf!

6 thoughts on “Twitter, Facebook, Google+ in WordPress Widget einbindenEmbedding Twitter, Facebook and Google+ widgets into your WordPress website

  1. Anonymous said:

    Das #Twitter-Widget sieht super chic aus, aber hier links die ganzen Buttons auf eurer Webseite finde ich noch viel chicer…habt ihr einen Tipp, wie man DIE einbindet? #Wordpress #Widgets #socialbar

    • Tatjana Sochowski said:

      Die Einbindung der Buttons auf unserer Webseite ist nicht über ein Plugin oder ein Widget geschehen. Die Share Buttons wurden extra für unsere Webseite kreiert und direkt in das Theme integriert.

  2. Hallo,

    wir kann ich ich das Twitter-Widget weiter anpassen, z.B. in der Breite? Oder gibt es ein Plugin, was Facebook, Twitter und Google+ in der Form einbindet?

    Gruß
    Erkan

    • Regina Gschladt said:

      Hallo Erkan,

      die Breite der Widgets lässt sich jeweils beim erstellen (s.o. im Artikel) verändern, allerdings gibt es gerade bei Twitter manchmal Probleme, das widget zu personalisieren. Natürlich gibt es auch zahlreiche Plugins, die die Einbindung der Widgets ganz einfach machen.

      Viele Grüße
      Regina

  3. Habe eine Möglichkeit gesucht, meinen Google+ Account in meine Seite einzubinden und bin durch diesen Artikel fündig geworden, vielen Dank!

  4. Maximilian said:

    Klasse, damit funktioniert es tatsächlich. Vielen Dank.

Join the conversation

*