Für einfache Formulare genügt oft bereits das bei Typo3 mitgelieferte „Mailform“. Eine große Herausforderung ist jedoch oft, wie man es anpasst.
Hier ein Vorschlag, der dann durch eigene Vorstellungen ersetzt/ergänzt werden kann.
Inhaltsverzeichnis
Template-Setup
Zunächst definieren wir Weiterleitungen, CSS-Klassen und einige Basis-Infos (Vorsicht beim Kopieren über die Zwischenablage – ev. werden Sonderzeichen verändert):
## Layout für Kontakt-Formular
tt_content.mailform.20 {
accessibility = 1
noWrapAttr=1
formName = mailform
dontMd5FieldNames = 1
REQ = 1
//layout = <div>###LABEL### ###FIELD###</div> <-- in neuer Version nicht mehr!
//COMMENT.layout = <div>###LABEL###</div> <-- in neuer Version nicht mehr
### doppeltes LABEL
// RADIO.layout = <div>###LABEL### ###FIELD###</div>
RADIO.layout = <div class="radiolayout">###FIELD###</div>
LABEL.layout = <div>###LABEL### ###FIELD###</div>
### Möglichkeit die Input Felder nebeneinander sauber darzustellen
//labelWrap.wrap = <div style="width:100px; float:left;">|</div>
labelWrap.wrap = <div>|</div>
commentWrap.wrap = |
!>### nach jeden Optionsfeld ein Umbruch, lässt man den weg, sind die Optionsfelder nacheinander
radioWrap.wrap = |<br />
### Das selbe gilt für benötigte Felder in Formularen
REQ.labelWrap.wrap = <div>|</div>
stdWrap.wrap = <div class="formular">|</div>
### Fehlermeldung anpassen
badMess = Diese Felder müssen ausgefüllt werden:
### Ziel-Seite nach Versenden des Formulars (wenn nicht im PlugIn definiert):
#target = _self
#type = 47
### CSS-Klassen um jedes Element legen
params >
params.input = class="mf-input"
params.password = class="mf-pass"
params.textarea = class="mf-text"
params.check = class="mf-check"
params.radio = class="mf-radio"
params.select = class="mf-select"
params.file = class="mf-file"
params.reset = class="mf-reset"
params.submit = class="mf-submit"
} Dann binden wir auch noch eine CSS-Datei ein:
# CSS-Datei für mailform anhängen
page.includeCSS {
file1 = fileadmin/templates/styles/montechristo_mailform_styles_01.css
}CSS-Datei
Diese bezieht sich auf die angegebenen Klassen:
@charset "utf-8";
/* CSS Document */
legend {padding-left:10px;padding-right:10px;border: 0px;}
fieldset {border:0px;padding-left:10px;padding-right:10px;padding-top:10px;padding-bottom:10px;}
.radiolayout {width:60%;padding-top:15px;padding-bottom:15px;}
.formular {width:80%;padding-top:10px;padding-bottom:10px;padding-left:10px;border: 1px solid #C0C0C0;}
.mf-radio {border:0px;}.mf-text {color: #000000;border: 1px solid #C0C0C0;margin-bottom: 5px;}
.mf-check {border: 0px;}.mf-select {border:0px;}.mf-input {border: 1px solid #C0C0C0;margin-bottom: 5px;}
.mf-submit {color: #ffffff;background-color: #C0C0C0;border: 0px;}
Fehlerbeseitigung
Eine Lösung für den Fehler
Fehler: Address in mailbox given @localhost does not comply with RFC 2822, 3.6.2. beim Newsletterversand mit Direct Mail.findet sich hier:
Ev. liegt es auch daran, dass bei den Erweiterten Eigenschaften des PlugIns und im TypoScript keine Empfängeradresse angegeben wurde!?
Loading…