Google +1 Button in die eigene Webseite integrieren / einbinden

Google +1 steht ab sofort zur Nutzung auf der eigenen Webseite zur Verfügung, wie auf dem offiziellen englischen Google Blog zu lesen ist. Das Google pendant zum “Like”-Button von Twitter kann ganz simpel in die eigene Webseite integriert werden.

Anbei der offizielle Google +1 Video

Für die Erstellung des notwendigen Codes besucht man die Webseite: http://www.google.com/webmasters/+1/button/.

Grössen

Die Darstellung des Buttons kann in den Grössen

  • Klein (15 px)
  • Mittel (20 px)
  • Standard (24 px)
  • Gross (60 px)

festgelegt werden.

Dies ergibt dann folgende Möglichkeiten:

Quelle Google +1 API Beschreibung

Sprachen

Nach der Wahl der gewünschten Grösse wählt man noch die gewünschte Sprache aus. Google +1 wird momentan in den folgenden 40 Sprachen angeboten. Neben Sprachen wie Deutsch, Französisch, Englisch, Spanisch, Portugiesisch, stehen auch Sprachen wie Hindu, Rumänisch, Serbisch usw. zur Verfügung.

Erweiterte Optionen

Neben den Standard-Einstellungen können ebenfalls noch erweitere Optionen festgelegt werden.

Weitere Informationen zu den erweiterten Optionen  gibt es auf der folgenden Google +1 Seite.

Integrations-Beispiel

Mit folgendem Code habe ich Google +1 in meinen Blog integriert.

<!– Dieses Tag in den Head-Bereich oder direkt vor dem schließenden Body-Tag einfügen –>
<script type=”text/javascript” src=”http://apis.google.com/js/plusone.js”>
{lang: ‘de’, href: ‘http://florianmuff.com’}
</script>

<!– Dieses Tag dort einfügen, wo die +1-Schaltfläche dargestellt werden soll –>
<g:plusone size=”medium” href=”http://florianmuff.com”></g:plusone>

 

Dies sieht nun folgendermassen aus.

Ablauf zur Google +1 Empfehlung

Schritt 1: Klick auf den Google +1 Button

Schritt 2: Login mit dem persönlichen Google Account

Schritt 3: Klick auf “Bestätige und +1 geben”, Google +1 hat nun den Zählerstand aktualisiert

Sowie ich dies im Moment sehe wird der Google +1 Button nicht für einzelne Artikel gezählt, so wie diese z.B. bei Twitter oder Facebook-Like der Fall ist, sondern nur für die ganze Webseite. Ebenfalls werden gemäss Google die Google +1 Buttons zur Zeit nur in den englischen Trefferliste angezeigt.

[Nachtrag: 02.06.2011 - Es ist möglich, dass jeder Blogpost einen eigenen Google +1 Button erhält. Wie man den Google +1 Button für einzelne Blogposts und Kategorien integriert könnt ihr hier nachlesen.]

Weitere Informationen

Facebook Kommentare

Kommentare

  1. Jan meint:

    Wenn ich das richtig verstehe, soll eigentlich schon für einzelne Artikel/URLs gezählt werden, vgl. http://code.google.com/intl/de-DE/apis/+1button/#target-url – wenn du href explizit setzt, so wie du das im Beispiel getan hast, geht es dann wohl nicht.

  2. Florian Muff meint:

    Hi Jan
    Habe nochmals einwenig recherchiert. Eine separate Einbindung für jeden Blogpost ist möglich. Die URL an das href Attribut kann man mittels

    href=”http://< ?php echo $_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI']; ?>”

    übergeben.

    Habe dazu einen neuen Beitrag geschrieben. “Google +1 Button für Blog Artikel und Kategorien”

  3. Sang meint:

    einmal durchgelesen, verstanden, eingebaut! Gute Erklärung.

Trackbacks/ Pingbacks

  1. [...] Button kann auf jeder Website integriert werden.  Eine schöne Anleitung liefert Florian Muff in seinem Blog.  Es kann sich lohnen, noch ein paar Gedanken darauf zu [...]

Blog Kommentare

*