TYPO3@lisardo

Die Optionen aller Eingabefelder im Backend können modifizert (= geändert oder erweitert) werden. Prinzipiell ist die Syntax:

Leider gibt es keine Dokumentation, welche Optionen für welches Feld zur Verfügung stehen und wie diese im Frontend ausgegeben werden. Das kann man wohl am einfachsten aus dem Quelltext des Eingabeformulars im Backend entnehmen. Für das Frontend kenne ich im Moment nur die Möglichkeit, es auszutesten bzw im Falle von tt_content das TypoScript von css_styled_content durchzusehen.

Bezeichnungen der Headline-Layouts ändern:

Ins TSconfig der der Seite folgendes eintragen: 

Falls H1 nicht genutzt werden soll, muss die Default-Einstellung noch geändert werden, bzw. die Ausgabe für header_layout.altLabels.0. Das geht über folgende Eingabe im Constants-Bereich des TypoScript-Templates:

Rahmenoptionen umbenennen:

Neue Rahmenoptionen hinzufügen

Das ist etwas aufwändiger, da hierzu auch das TypoScript von tt_content verändert werden muss. Erster Schritt im TSconfig der Seite:

Danach im TypoScript-Template:

Danach ganz normal in der CSS-Datei formatieren.

ACHTUNG: Das funktioniert seit TYPO3 4.3 nicht mehr; hier wurde css_styled_content etwas verändert. Man kann zwar die alte Fassung als static_content in das Template laden, aber besser ist es, es auf die neue Art zu machen:

Das hat auch den Vorteile, dass die Abstände oben und unten funktionieren.

Weiterführende Links:

• http://typo3.org/documentation/document-library/references/doc_core_tsconfig/4.1.0/view/1/3/TS-Referenz auf Typo3.org

Im Mailformular soll ein Dropdownmenü angeboten werden, mit dessen Hilfe die Zieladresse ausgewählt werden kann. Umsetzung mit der Extension Mailformplus. 

Im Template:

Im TypoScript:

Quelle: Deutschsprachige Mailingliste; Beitrag von Fabian Seltmann.

[Update]

Bei Powermail gibt es einen Eintrag hierzu direkt im Manual. 

Mit dem normalen Inhaltselement FORM kann man bereits einiges machen, allerdings hat es einige Einschränkungen:

• man kann die Formularelemente nur sehr mühsam mehrspaltig anordnen
• Zwischentexte zwischen den Elementen sind zwar möglich, können aber nur mit einer einheitlichen Formatierung versehen werden.
• die Validierung erfolgt nur mittels JavaScript
• der Absender bekommt die gesendeten Inhalte nicht mehr gezeigt.
• die eingebenen Daten werden nicht in einer Datenbank gespeichert

Es gibt einige Erweiterungen, die das Inhaltselement FORM erweitern, ausserdem kann man Erweiterungen einsetzen, die es komplett ersetzen.

Tipps zu FORM

Einzelne Elemente mit Klassen versehen:

In den Beispielen auf Typo3.org findet sich eine Syntax, wie Kopien an mehrere Empfänger versendet werden können

und wie man eine Bestätigungs-E-Mail an den Absender schicken kann: 

Diese Nachricht wird nur gesendet, wenn die E-Mailadresse bekannt ist, also das Feld “email” ausgefüllt wurde. Unklar ist dabei, inwieweit das gegen Spam geschützt werden kann. Ich vermute, dass es ein neues Feature von Typo3 Vs. 4 ist.

Weiterführende Links:

• TypoScript-Referenz bei mittwald (in Deutsch),
• TypoScript-Referenz bei Typo3 (Englisch, enthält aber einige zusätzliche Beispiele)
• Fancy Form Design Using CSS Ziemlich gutes und aktuelles Tutorial zur CSS-Gestaltung von Formularen. Nicht spezifisch Typo3.
• Anleitung zum Formatieren von Mailform in Typo3 Interessantes Tutorial auf der Basis von css_styled_content.
• Uni-Form: Making forms simple Ein Versuch, die Formulargestaltung zu modularisieren. Nicht spezifisch Typo3, ausserdem mit vielen JavaScript-Effekten.
• Wufoo Form Gallery Eine Gallery mit verschiedenen Formular-Vorlagen, deren Templates heruntergeladen werden können. Nicht spezifisch Typo3.

FORM in css_styled_content

In css_styled_content findet sich ein ziemlich ausführliches TypoScript zum FORM-Objekt, das als Ausgangspunkt genommen werden kann. Es ist dann relativ einfach, dieses zu ergänzen. Nachfolgend zuerst der Code, wie das FORM-Objekt standardmäßig überschrieben wird:

Danach folgt die neue Version ([compatVersion = 3.9.0]):

Das ergibt zum Beispiel folgenden Output:

Funktionserweiterungen für FORM

Drei Extensions von Christian Jul Jensen erweitern FORM um einige dieser aufgezählten Funktionen:

• julle_formpreview: zeigt nach dem Ausfüllen und vor dem Absenden des Formulars nochmals alle Daten.Repository, Manual
• julle_formreceipt: Damit kann eine Bestätigungsmail an den Ausfüller versendet werden. Repository, Manual
• julle_form2csv: speichert die Daten im CSV-Format. Repository, Manual
• formevalwizard: Damit können Validierungsvorgaben gespeichert werden; das macht es für die Redakteure einfacher, komplexe Validierungen einzusetzen, da sie keine regulären Ausdrücke mehr benötigen. Repository,Manual
• qforms: ein einfach zu nutzender Formulareditor, der den Redakteuren das Anlegen von Formularen erleichtern soll. Repository]=search&no_cache=1&tx;_terfe_pi1[sword]=qforms, Manual

MailformPlus

Diese Extension wird wohl am häufigsten eingesetzt, um FORM zu ersetzen. Die Handhabung ist recht einfache, das eigentliche Formular wird einfach als HTML-Template angelegt, mit den üblichen Platzhaltern. Es ermöglicht somit ein völlig freies Layout. Seine Features:

• flexibles Layout mit Templates
• serverseitige Validierung
• E-Mail an den Absender
• Speichern in Datenbank und als Export als CSV-Datei
• Erweiterbar um JavaScript-Validierung, bis hin zu Ajax.
• ermöglicht mehrseitige Formulare

Nachteil:

• man kann keine Felder dynamisch vorbelegen
• komplexere Validierungen (die über »Feld leer« hinausgehen, sind offensichtlich nicht möglich.

Repository, Manual. Eine schöne Beispielseite mit etwas AJAX ist bei Steffen Kamper zu finden.

Mehrsprachigkeit kann mit mailformplus so realisiert werden:

Mir ist noch dre_formmaker aufgefallen: offensichtlich extrem mächtig, aber neu und noch im Experimentalstadium. Das Manual ist verwirrend, ausserdem erfordert es mindestens PEAR und noch weitere Bibliotheken. Sollte man aber im Auge behalten … Repository, Manual

Es ist möglich, die Felder eines Mailformulars mit GET-Variablen vorzubelegen. Das muss allerdings mit Hilfe von TypoScript vorbereitet werden.

Folgendes Beispiel geht davon aus, dass das Formular mit der Variablen ?prod=xx aufgerufen wird. xx enthalt die uid eines News-Eintrags. Anhand der übergebenen uid soll das Formular mit dem Titel des News-Eintrags vorbelegt werden.

Im Formular kann so auf den Wert zugegriffen werden:

Auch ohne TemplaVoila oder einem Template-Switcher können den Redakteuren verschiedene Layouts einfach über eine TypoScript-Konfiguration im Main-Template zur Verfügung gestellt werden:

Standardmäßig sind vier Varianten vorgesehen. Diese können über PageTSconfig anders benannt werden:

Falls vier Varianten nicht reichen, können noch weitere ergänzt werden:

Mit dieser Technik kann sogar das klassische 4-Spalten-Layout im Backend mit TemplaVoila kombiniert werden, von Seite zu Seite individuell und einfach vom Redakteur auszuwählen:

Allerdings muss dann TemplaVoila so konfiguriert werden, dass in der Rubrik »Web« im Backend beide Seiten-Module gezeigt werden: für TemplaVoila und das klassische. (Je nach Seitenlayout muss das passende Modul für die Eingabe der Inhalte verwendet werden). Dazu öffnet man im Extension Manager TemplaVolia und aktiviert die Option »Enable the classic page module«. Aber Achtung: da beide Seitenmodule leicht verwechselt werden können, erstellen ungeübte Redakteure schnell Inhalte in den falschen Modulen, was dazu führen kann, dass Inhalte zwar in TemplaVoila erscheinen sollen, aber dort nicht referenziert und damit letztlich auch nicht gezeigt werden. Diese Technik setzt also Redakteure voraus, die wissen was sie tun.

Falls doch einmal Inhalte nicht in TemplaVoila referenziert werden und damit nicht im Frontend erscheinen, so gibt es unter »Funktionen« den Assistenten »Referenziere unbenutzte Inhaltselement (TemplaVolia)«. Damit werden alle Inhaltselement in TemplaVoila-Spalten eingefügt – leider oft in die falschen. Aber immerhin sind sie jetzt da und und in der aktuellen Version von TemplaVoila können Inhaltselemente leicht per Drag und Drop verschoben werden, so dass sich der Aufwand in Grenzen hält.