Bastian-Bringenberg.de → Zu TYPO3 → Tutorials → FaceBook in TYPO3

Dieses Tutorial wird bald mit Canonical arbeiten. Für die Pluginvariante fehlen mir noch Backend Konfigurationsmöglichkeiten. Dies werde ich mir Zeitnah aneignen.

FaceBook "Mag ich" in TYPO3

Web2.0 erreicht immer mehr Firmen, die eigentlich auch ohne Web2.0 funktionieren sollten. Immer häuftiger kommt es vor, dass ich gefragt werde ob es möglich sei einen FaceBook Button auf die eigene Firmenpräsez zu bekommen. Natürlich bietet FaceBook dafür einfache Möglichkeiten an, immerhin ist diese Verknüpfung auch von Facebook erwünscht. Nun gibt es mehrere Möglichkeiten:

Den Button auf jeder Seite haben
Den Button auf ausgewählten Seiten haben

Den Button auf jeder Seite haben:

Um den Button auf jeder Seite zu haben muss lediglich eine userFunction aufgerufen und implementiert werden. Die Datei liegt bei mir beispielhaft im Fileadmin Verzeichniss und hat folgenden Inhalt:

<?php
class user_facebook{
private var $cObj;
private var $staticURL=false;
private var $onlyDomain=false;
private var $layout="button_count";
private var $showFaces="false";
private var $private="like";
private var $font="verdana";
private var $colorscheme="light";
private var $width=240;
private var $height=50;
function main($content,$conf){
if(isset($conf['staticUrl'])) $this->staticUrl = $conf['staticUrl'];
if(isset($conf['onlyDomain'])) $this->onlyDomain = $conf['onlyDomain'];
if(isset($conf['layout'])) $this->layout = $conf['layout'];
if(isset($conf['showFaces'])) $this->showFaces = $conf['showFaces'];
if(isset($conf['private'])) $this->private = $conf['private'];
if(isset($conf['font'])) $this->font = $conf['font'];
if(isset($conf['colorscheme'])) $this->colorscheme = $conf['colorscheme'];
if(isset($conf['width'])) $this->width = $conf['width'];
if(isset($conf['height'])) $this->height = $conf['height'];
if($this->staticURL===false){
if($this->onlyDomain==true){
$var="http://".$_SERVER['SERVER_NAME'];
}else{
$var="http://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'];
}
}else{
$var=$this->staticURL;
}
$var=urlencode($var);
return '<iframe src="http://www.facebook.com/plugins/like.php?href='.$var.'&layout='.$this->layout.'&show_faces='.$this->showFaces.'&width='.$this->width.'&action='.$this->like.'&font=tahoma&colorscheme='.$this->colorscheme.'&height='.$this->height.'" scrolling="no" frameborder="0" class="faceBookButton" style="border:none; overflow:hidden; width:'.$this->width.'px; height:'.$this->height.'px; " allowTransparency="true"></iframe>';
}
}
?>

Datei herunterladen: uploads/tx_jphcodesnippets/user_facebook.txt

Nun gibt es mehrere Möglichkeiten das ganze Anzupassen. Für das Layouten gibt es eine CSS Klasse namens faceBookButton. Die weiteren Optionen im Detail:

staticURL
Mit diesem Wert kann eine statische Adresse bestimmt werden, die angesprochen wird. Zum Beispiel das oben genannte FaceBook Profil oder eine externe Seite, die häufiger Besucht wird als die eigene.
Einzutragen in Anführungszeichen mit beginnendem http://
Default: false
onlyDomain
Der boolsche Wert bestimmt ob lediglich die Domain oder auch die einzelnen Seiten angesprochen werden. Bei true würde auf jeder Seite ein Ich mag Bastian-Bringenberg.de verwendet, bei false würden die einzelnen Seiten von dem Ich mag ... angesprochen werden.
Aktzeptierte Werte: true oder false
Default: false
layout
Bestimmt das Optische Erscheinungsbild des Buttons, wie FaceBook es realisiert. Hier gilt es auszuprobieren
Aktzeptierte Werte: ( in Anführungszeichen ) standard oder button_count oder box_count
Default: button_count;
showFaces
Bestimmt ob eine Auswahl an Gesichtern rechts neben dem Button stehen soll, die mögen wo drauf der Button zeigt. Nur im Standardlayout verwendbar.
Aktzeptierte Werte: ( in Anführungszeichen ) true oder false
Default: false
action
Ist das Verb, welches auf dem Button steht.
Aktzeptierte Werte: ( in Anführungszeichen ) like oder recommend
Default: like
font
Die ausgewählte Schriftart auf dem Button.
Aktzeptierte Werte: ( in Anführungszeichen ) arial oder lucida grande oder segoe ui oder tahoma oder trebuchet ms oder verdana
Default: verdana
colorscheme
Die Farbgebung des Buttons.
Aktzeptierte Werte: ( in Anführungszeichen ) light oder dark
Default: light
width
Bestimmt die Breite des IFrames in dem der FaceBookButton ist.
Aktzeptierte Werte: Integer
Default: 240
height
Bestimmt die Höhe des IFrames in dem der FaceBookButton ist.
Aktzeptierte Werte: Integer
Default: 50

Um diese Optionen wirksam zu machen müsst ihr nur euer Template erweitern. Zuerst ein Einbaut ohne Veränderungen:

includeLibs.facebook = fileadmin/templates/facebook.php
page.10.marks{
FACEBOOK = USER
FACEBOOK.userFunc=user_facebook->main
}
###
# Wenn wir nun zum Beispiel eine statische Seite, zum Beispiel https://www.google.com einfügen möchten, reicht eine kleine Abwandlung:
###
includeLibs.facebook = fileadmin/templates/facebook.php
page.10.marks{
FACEBOOK = USER
FACEBOOK.staticURL=https://www.google.com
FACEBOOK.userFunc=user_facebook->main
}

Nur auf einzelnen Seiten

Eine Extension dafür ist in Arbeit und wird in Kürze folgen. Hilfe im Bereich FLEX wird gerne angenommen. Alternativen zur Pluginkonfiguration werden gerne genommen.

Weitere Informationen und Hinweise

Like Button Facebook-Entwickler

Für Anregungen und Wünsche, so wie bei bekannten Fehlern bitte eine Email an mich schicken. Ich freue mich außerdem über jedes kleine Danke per Email oder mit einem FaceBook klick.

Stand: 16. September 2010

Nach Oben