Individuelle Rahmen für Content Elemente

caticonslite_bm_alt

Um Inhaltselementen (engl. Content Elements) in TYPO3 ein individuelles Aussehen zu verpassen (z.B. Überschrift und Text in einer abweichenden Farbe), hat man die Möglichkeit vordefinierte Rahmen zu verwenden oder auch eigene festzulegen. Die Einstellung „Einrückung und Rahmen“ (engl. „Indentation and Frames„) befindet sich in den Eigenschaften jedes (Standard-)Inhaltselements auf der Registerkarte „Erscheinungsbild“ (engl. „Appearance„). Damit die Einstellung dargestellt wird, muss „Zweite Optionspalette anzeigen“ (engl. „Show secondary options (palettes)„) am Ende in den Eigenschaften aktiviert sein.

Abhängig davon, welcher Wert für „Einrückung und Rahmen“ ausgewählt wird, werden unterschiedliche CSS-Klassen im HTML-Quelltext ausgegeben. Die vordefinierte Option „Standardframe“ führt beispielsweise zur Ausgabe der CSS-Klasse „csc-default“.

Um einen individuellen Rahmen festzulegen, fügt man im PageTS folgende Zeilen ein:

TCEFORM.tt_content {
	section_frame.addItems.101 = Individueller Rahmen
	section_frame.addItems.102 = Weiterer individueller Rahmen
}

Die Zahlen „101“ und „102“ stehen in diesem Beispiel für die IDs der Rahmen (um nicht unbeabsichtigt vordefinierte Rahmen zu überschreiben sollten Zahlen größer als 100 gewählt werden), „Individueller Rahmen“ und „Weiterer individueller Rahmen“ für die Beschreibungen, die als Optionen angezeigt werden. Anstelle einer hardcodierten Beschreibung, wie in diesem Fall, ist der Verweis auf eine Sprachdatei empfehlenswert (z.B.: „section_frame.addItems.101 = LLL:EXT:webentwickler_at/Resources/Private/Language/locallang_ttc.xlf:section_frame.I.101“).

Im TypoScript-Setup muss noch das gewünschte Verhalten festgelegt werden:

tt_content.stdWrap.innerWrap.cObject {
	101 =< tt_content.stdWrap.innerWrap.cObject.default
	101.20.10.value = csc-frame csc-frame-individual
 
	102 = TEXT
	102.value = <div class="another-individual-frame">|</div>
}

In diesem Beispiel erfolgt das Rendering des Rahmens „[101] Individueller Rahmen“ analog zu den vordefinierten Rahmen und es können sämtliche css_styled_content-Eigenschaften (z.B. „Oberer Abstand“ (engl. „Top Margin“)) verwendet werden. Für „[102] Weiterer individueller Rahmen“ ist dies nicht der Fall und es wird ausschließlich o.g. HTML-Tag als Rahmen verwendet.

Frontend Page Rendering Template anpassen

caticonslite_bm_alt

In TYPO3 lässt sich so gut wie alles konfigurieren, auch das Page Rendering Template lässt sich anpassen. Dieses Template legt die HTML-Struktur der Seite fest, d.h. an welche Position Titel, JavaScript, CSS, etc. eingefügt werden. Der Template-Pfad lässt sich im TypoScript-Setup mit der Anweisung „config.pageRendererTemplateFile“ setzen, das Standard-Template ist unter „typo3/sysext/cms/tslib/templates/tslib_page_frontend.html“ zu finden.

Möchte man beispielsweise nur Conditional Comments einfügen, um den Browser zu identifizieren und CSS-Hacks zu vermeiden  (siehe Blog-Eintrag von Paul Irish), so kann man entweder Hooks im PageRenderer (typo3/sysext/core/Classes/Page/PageRenderer.php) oder auf die TypoScript-Konfigurationsoptionen im PageGenerator (typo3/sysext/frontend/Classes/Page/PageGenerator.php) zurückgreifen. Um den HTML-Tag zu erweitern lässt sich beispielsweise „config.htmlTag_stdWrap“ verwenden.

Aktualisierung von Webseiten

Sobald ein Kunde Kenntnis davon erhält, dass beispielsweise für das bei ihm eingesetzte Content Management System (CMS) ein Update zur Verfügung steht, möchte dieser das installiert wissen. Meines Erachtens ist es nicht erforderlich jede Version zu installieren, da Updates neben Fehlerbehebungen auch neue Fehler beinhalten und somit mit einem gewissen Risiko verbunden sind. Ein Update/Upgrade empfehle ich nur aus folgenden Gründen:

  1. Für die eingesetzte Version gibt es keine Sicherheitsupdates mehr.
  2. Die eingesetzte Version weist eine Sicherheitslücke auf, die mit der aktuelleren Version behoben wird.
  3. Die eingesetzte Version enthält einen auftretenden Bug, der mit der aktuelleren Version behoben wird.
  4. Die neuere Version enthält Features, die in der eingesetzten Version nicht zur Verfügung stehen und benötigt werden.
  5. Sicherstellung einer einfachen Migration auf zukünftige Versionen.

NGINX als SSL-Wrapper

caticonslite_bm_alt

NGINX ist bekannt für seine gute Performance und ideal, um als Reverse Proxy bzw. Load Balancer vor speicherintensiven Anwendungsservern (z.B. Apache mit PHP) eingesetzt zu werden und in diesem Zuge auch die HTTPS-Verbindung zu terminieren, damit sich die Anwendungsserver nicht mehr darum kümmern müssen. Um NGINX als SSL-Wrapper einzusetzen ist folgende Konfiguration erforderlich:

server {
        listen 80;
        server_name domain.tld;
 
        return 301 https://domain.tld$request_uri;
}
 
server {
        listen 443;
        server_name domain.tld;
 
        ssl on;
        ssl_certificate /etc/ssl/certs/ssl-cert-snakeoil.pem;
        ssl_certificate_key /etc/ssl/private/ssl-cert-snakeoil.key;
        ssl_session_timeout 5m;
        ssl_protocols SSLv3 TLSv1;
        ssl_ciphers ALL:!ADH:!EXPORT56:RC4+RSA:+HIGH:+MEDIUM:+LOW:+SSLv3:+EXP;
        ssl_prefer_server_ciphers on;
 
        location / {
                proxy_set_header Host $host;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_set_header X-Forwarded-Proto $scheme;
                proxy_pass http://10.0.0.1/;
        }
}

Die erste server-Anweisung dient dazu alle HTTP-Anfragen auf HTTPS umzuleiten – „domain.tld“ ist selbstverständlich mit der eigenen Domain zu ersetzen. Sollte neben HTTPS auch HTTP möglich sein, ist diese Konfiguration nicht erforderlich und kann weggelassen werden.

Die zweite server-Anweisung behandelt alle HTTPS-Anfragen und leitet diese im sicheren internen Netz auf den Anwendungsserver „10.0.0.1“ via HTTP-Protokoll weiter. Die Zertifikats- und Schlüsseldatei ist, genauso wie die Adresse des Anwendungsservers, an die eigene Infrastruktur anzupassen. Das Ursprungsprotokoll und die Ursprungsadresse werden als X-Forwarded-Proto bzw. X-Forwarded-For HTTP-Header an den Anwendungsserver weitergeleitet und können somit in der Anwendung entsprechend behandelt werden, z.B. um absolute Links für das verwendete Protokoll zu generieren.

In diesem Fall wurde der Einfachheit halber das automatisch erstellte Snakeoil-Zertifikat von Debian verwendet. Die Installation erfolgt mit „apt-get install ssl-cert“, die Verwendung kann im ubuntuusers.de-Wiki nachgelesen werden.

Mehrsprachigkeit in TYPO3 konfigurieren

caticonslite_bm_alt

Um Mehrsprachigkeit in TYPO3 zu aktivieren sind mehrere Schritte erforderlich. Der hier dargestellte Weg zeigt eine mögliche Variante auf, besonders hinsichtlich RealURL sind viele unterschiedliche Konfigurationen möglich.

1. Sprache im Backend aktivieren:

Im Modul „Web > Liste“ (engl. „Web > List“) wählt man die Rootseite mit der ID „0“ (Seite mit vorangestelltem TYPO3-Symbol) aus. Nun fügt man einen neuen Datensatz vom Typ „Alternative Seitensprache“ (engl. „Website language“) ein und füllt die erforderlichen Felder aus. Die hier festgelegten Werte haben keinerlei Relevanz für die weitere Konfiguration, sondern dienen nur der Unterscheidung für Benutzer. Nach dem Speichern sucht man sich die Objekt-ID(s) im Modul „Web > Liste“ der angelegten Sprachen heraus, z.B. indem man mit der Maus auf die gewünschte Flagge zeigt. Die Standardsprache ist nicht anzulegen und hat implizit die ID 0 – in diesem Fall ist dies „Deutsch“. Als alternative Sprachen wurden „English“ mit der ID 1 und Italiano mit der ID 2 angelegt.

2. TypoScript-Setup:

config {
	linkVars = L(0-2)
	uniqueLinkVars = 1
	defaultGetVars.L = 0
	language = de
	locale_all = de_AT.UTF-8
	sys_language_uid = 0
	htmlTag_langKey = de
}
[globalVar = GP:L = 1]
	config {
		language = en
		locale_all = en_GB.UTF-8
		sys_language_uid = 1
		htmlTag_langKey = en
	}
[globalVar = GP:L = 2]
	config {
		language = it
		locale_all = it_IT.UTF-8
		sys_language_uid = 2
		htmlTag_langKey = it
	}
[global]

Die Einstellung „linkVars“ legt hier fest, dass der Parameter „L“ im Wertebereich 0-2 bei der Erzeugung von Links immer berücksichtigt wird. Hat man mehr oder weniger Sprachen, muss der Wertebereich entsprechend angepasst werden. Damit Parameter in der URL nur ein Mal vorkommen, wird „uniqueLinkVars“ aktiviert, andernfalls könnten URLs im Format „?L=0&L=2“ erzeugt werden.

Die Zahlen in den Bedingungen/Conditions (z.B.: „[globalVar = GP:L = 1]“) und für den Parameter „sys_language_uid“ (z.B.: „sys_language_uid = 1“) entsprechen den IDs der im ersten Schritt angelegten Sprachen.

Der Parameter „locale_all“ muss an die installierten Systemsprachen angepasst werden und ist erforderlich um beispielsweise das Datum in der korrekten Sprache auszugeben.

3. RealURL: (Die Konfiguration ist hier nur auszugsweise dargestellt):

// [...]
'preVars' => array(
	// [...]
	'GETvar' => 'L',
	'valueMap' => array(
		'de' => 0,
		'en' => 1,
		'it' => 2,
	),
	'noMatch' => 'bypass',
	// [...]
),
// [...]

Damit die 404-Fehlerbehandlung auch auf der ersten Ebene korrekt funktioniert, muss für alle „preVars“ die Option „’noMatch‘ => ‚bypass'“ aktiviert und es darf „postVarSet_failureMode“ nicht gesetzt sein.

4. Sprachkürzel in der URL:

Die gezeigte Konfiguration würde für die Default-Sprache Links im Format „domain.tld/seite/“ generieren, Links für zusätzliche Sprachen im Format „domain.tld/sprache/seite/“ (z.B.: „domain.tld/en/page/“). Möchte man auch bei der Standardsprache das Kürzel in der URL haben, muss man mit dem TypoScript-Setup „config.defaultGetVars.L = 0“ den Standardwert setzen. Würde man in der RealURL-Konfiguration anstelle für „’noMatch‘ => ‚bypass'“ die Option „‚valueDefault‘ => ‚de'“ setzen, würde man zwar das selbe URL-Format erreichen, allerdings würde die 404-Fehlerbehandlung auf der ersten Ebene nicht mehr funktionieren.

1 2 3 4 5 6 8  nach oben