Condition für Typo3: Browserweiche

34 Kommentare | Rubrik: Allgemein

Die wohl bekannteste Condition die mit TS erstellt werden kann, ist die Browserweiche. Mit dieser Anleitung lässt sich die von Typo3 generierte Website ganz speziell auf verschiedene Browser optimieren.

Anwendungsbeispiele

Anwendungsbeispiele für eine Abfrage auf den Internetbrowser sind z.B. das Einbinden verschiedener CSS Dateien pro Browser um die Darstellung zu optimieren, oder aber aus marketingtechnischer Sicht die Optimierung von Werbeeinblendungen. Somit kann man z.B. nur bei Nutzern des Internet Explorers die Google-Empfehlung für Firefox angezeigt werden, während Besucher mit Firefox eine alternative Werbung sehen.

Abfrage der Browserfamilie

Implementierung

Folgendes TS bietet die einfache Möglichkeit dem Besucher anzuzeigen, welche Browserfamilie er gerade nutzt. Es wird in das Setup des Templates auf der Rootseite eingebaut und kann mittels Marker oder TemplaVoilà auf den Seiten platziert werden.

page.10 = TEXT
#Standardanzeige wenn keine Regel greift
page.10.value = Welchen Browser benutzen Sie?
#Anzeige beim IE
[browser = msie]
page.10.value = Sie surfen mit dem Internet Explorer
[global] 
#Anzeige bei Netscape und Mozilla
[browser = netscape]
page.10.value = Sie surfen mit Netscape oder einem Mozilla-Nachfolgemodell
[global] 
#Anzeige bei Opera 
[browser = opera]
page.10.value = Sie surfen mit Opera
[global] 

Werte für die Browserbedingung können sein:

Mittels einer Verknüpfung zur Version lässt sich eine Kondition auch auf die Browserversion einschränken. So kann mit folgendem TS eine Abfrage auf den Internet Explorer mit Versionsnummern kleiner 7 gesetzt werden. Die "&&" stellen eine "UND"-Verknüpfung her.

[browser = msie] && [version= <7]

Genauere Abfragen auf den User Agent

Will man das ganze noch browserspezifischer machen, kann man den sogenannten Useragent abfragen. Somit könnte man auch zwischen Mozilla und Firefox unterscheiden, oder auch zwischen IE6 und IE7. Um dies zu realisieren kann man Bedingungen direkt  auf den "useragent" stellen.

Vorwissen

Der Useragent ist laut Wikipedia "die Schnittstelle zum Benutzer, die die Inhalte darstellt und Befehle entgegennimmt" (Quelle). Die meisten Browser übertragen ihren Namen und weitere Informationen über den Rechner in der Headerzeile, die bei der Kommunikation über das Internet immer ausgetauscht wird. Beispiele sind hierfür:

• Mozilla/5.0 (Windows; U; Windows NT 5.1; de; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
• Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0; WOW64; SLCC1; .NET CLR 2.0.50727; .NET CLR 3.0.04506)
• Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0)
• Mozilla/5.0 (Macintosh; U; PPC Mac OS X; de-de) AppleWebKit/523.12.2 (KHTML, like Gecko) Version/3.0.4 Safari/523.12.2

Implementierung

Mit diesem Vorwissen lassen sich beliebig detaillierte Abfragen auf den Browser gestalten. Hier einige Beispiele:

page.10 = TEXT
#Standardanzeige wenn keine Regel greift
page.10.value = Welchen Browser benutzen Sie?
#Anzeige beim IE
[useragent = *Firefox*,*Safari*]
page.10.value = Sie surfen mit dem Firefox oder Safari
[global]
[useragent = *MSIE 6.0*]
page.10.value = Sie surfen noch mit dem Internet Explorer 6
[global]

Wichtig

Da Typo3 Conditions nicht in geschweiften Klammern verwendet werden drüfen, muss immer der komplette Elementenpfad mit "page" beim Inhalt angegeben werden. Innerhalb der Typo3 Condition kann wieder eine geschweifte Klammer geöffnet werden.

Beispiel:

page.10.headerimage.value = /pfad/zum/bild.jpg