TYPO3: Email layout of system extension „form“

After working in the past few years with the extensions powermail or formhandler when needing a form extension, I now wanted to give the system extension for forms, named „form“, a new chance. Until now, it looks good, even if the form wizard is a little bit buggy.

Form with extension "form"

Click to enlarge

In this article I want to show how you can adapt the layout of the email, which is sent after the form was submitted. You can see the form and it’s field in the image on the right side. Without modifications, the HTML version of the email looks like this:

HTML email

Especially the output of radio and checkbox groups do not look very nice and I do not like the spaces (around the whole text and around the radio/checkbox groups). Besides, the spaces (made with CSS rule „padding“) do not work in Outlook. But you have the possibility to change the layout with TypoScript:

TS Setup

tt_content.mailform.20 {
    postProcessor {
        mail {
            layout {
                label (
                    <labelvalue />
                )
                legend (
                    <legendvalue />
                )
                containerWrap (
                    <tbody>
                        <elements />
                    </tbody>
                )
                fieldset (
                    <td colspan="2">
                        <table cellspacing="0" cellpadding="0">
                            <legend />
                            <containerWrap />
                        </table>
                    </td>
                )
                checkbox (
                    <td width="200" valign="top">
                        <label />
                    </td>
                    <td>
                        <inputvalue />
                    </td>
                )
                radio (
                    <td width="200" valign="top">
                        <label />
                    </td>
                    <td>
                        <inputvalue />
                    </td>
                )
                radiogroup (
                    <td width="200" valign="top">
                        <legend />
                    </td>
                    <td>
                        <table cellspacing="0" cellpadding="0">
                            <containerWrap />
                        </table>
                    </td>
                )
                checkboxgroup < .radiogroup
                textline (
                    <td width="200" valign="top">
                        <label />
                    </td>
                    <td>
                        <inputvalue />
                    </td>
                )
                fileupload < .textline
                textarea (
                    <td width="200" valign="top">
                        <label />
                    </td>
                    <td>
                        <inputvalue />
                    </td>
                )
                select (
                    <td width="200" valign="top">
                        <label />
                    </td>
                    <td>
                        <elements />
                    </td>
                )
            }
        }
    }
}

Now the HTML email looks like this:

HTML email

Autor:
Geändert: Mittwoch, 2. September 2015 14:17 Uhr
Erstellt: Freitag, 26. September 2014 11:36 Uhr
Tags: , , , , , , , ,
Themengebiet: Web Entwicklung, TYPO3, TYPO3 Extensions

Trackback: Trackback-URL LoadingZu Favoriten hinzufügen

Kommentar abgeben