Google+1 und Facebook-Like

 

One.com Forum und Tutorial

Lösungen sind meist ganz einfach - wenn man sie kennt

 

Google+1 Button / Facebook-Like einbinden

 

 

Wie die meisten Provider bietet dir auch One.com die Möglichkeit die „wichtigsten” Social-Media Plattformen vorgefertigt einzubinden. Das sind die üblichen Verdächtigen: Google, Facebook, Twitter und LinkedIn.

 

Es gibt verschiedene Varianten, die leicht zu konfigurieren sind. Wer noch andere Plattformen einbinden will, findet beim jeweiligen Anbieter den entsprechenden Code. Die Codes muß man dann wie gewohnt im Code-Element anordnen.

Am einfachsten einfach alle untereinander schreiben oder mittels einer Tabelle strukturieren. Da braucht man dann etwas HTML.

 

Da nicht alle Möglichkeiten bei den vorgefertigten Varianten verfügbar sind, muss man sich unter Umständen behelfen. Ich persönlich nutze z.Bsp. nur Google+ und Facebook-Like. Wollte aber in einem Fall aus Platzgründen beide untereinander und ohne Zähler. Natürlich eine Variante die es nicht gibt. Wie kann man sich helfen?

 

Für google+1 gibt es direkt von Google die vollständige Erklärung und den Code unter:

 

https://developers.google.com/+/web/+1button/?hl=de

 

Zwar nicht besonders augenfreundlich aufbereitet, aber funktioniert. Man findet unten auf der Seite die komplette Doku, aber die braucht man nicht wirklich.

 

Seitenanfang Button als codeelement

 

Oben rechts über dem Code-Feld hat man die Vorschau.

 

Die Einstellungen kann man lassen. Größe ist klar, Hinweis = Anzeige der Anzahl von „+“, die Breite kann man einstellen soweit die anderen Einstellungen nicht widersprechen. Google optimiert logisch auf das mögliche Minimum gemäß Wunschbreite. Die erweiterten Optionen werden am Anfang nicht angezeigt - erst nach Klick und dann sieht man auch nur die erste Einstellung.

 

Asynchron am besten als Einstellung lassen, dann wird das Script parallel zum Rest der Website geladen und die Website ist schneller beim Besucher. Die anderen Einstellungen kann man derzeit nur per „TAB“-Taste erreichen, da sie nicht eingeblendet werden. Die URL nur ändern, wenn sie nicht identisch ist mit der Hauptdomain (canonical).

 

Code kopieren, einfügen und fertig.

 

Mit dem Snippet ist die große Box gemeint, die erscheint wenn man den Google+1-Button anklickt. Hier kann man die angeziegten Texte und das Bild konfigurieren.

 

Bei Facebook ist es etwas anders. Facebook selbst liefert den Code nur über das entsprechende Tool, wenn man bei Facebook angemeldet ist.

 

Das wäre die URL:

 

https://developers.facebook.com/docs/plugins/like-button/

 

Wer nicht Kunde bei Facebook ist, findet den Code zum Beispiel hier:

 

http://www.button-einbauen.de/facebook.html

 

 

Der Code sieht zum Beispiel so aus – einige Teile sind rot (Erklärung folgt)

 

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fone-com-forum.de&amp;layout=button_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100%; height:80px;" allowTransparency="true"></iframe><a href="http:// up.de/gutscheine">Yp</a>

 

 

Die URL wird ja im Generator festgelegt. Bei Layout habe ich aus „button_count“ einfach nur „button“ gemacht, damit der Zähler verschwindet. Die Breite habe ich dann auch noch angepasst. Und ganz hinten haben die Kollegen noch einen kleinen Werbelink eingebunden, den ich gelöscht habe. Aber das ist jedem seine Entscheidung wie er damit umgeht. Auf jeden Fall habe ich den Kollegen hier einen Backlink gegeben. Ich denke das ist fair.

 

Tja und dann den Code unterhalb vom Google+1-Code mit einem <br> (Zeilenvorschub) vorneweg eingefügt.