---
title: "TypoScript"
manual: "Mail system"
version: "4.2"
permalink: "https://docs.typo3.org/permalink/mediaessenz/mail:typoscript-settings@4.2"
source: "Reference/TypoScript/Index.rst"
rendered: "2026-11-03T08:21:25+00:00"
---

# TypoScript {#typoscript-settings}

-   [Page View Settings](https://docs.typo3.org/permalink/mediaessenz/mail:page-view-settings@4.2)
-   [Content View Settings](https://docs.typo3.org/permalink/mediaessenz/mail:content-view-settings@4.2)
-   [Header Settings](https://docs.typo3.org/permalink/mediaessenz/mail:header-settings@4.2)
-   [SCSS Settings](https://docs.typo3.org/permalink/mediaessenz/mail:scss-settings@4.2)
-   [Content Objects](https://docs.typo3.org/permalink/mediaessenz/mail:content-objects@4.2)

<a id="ts-page-view-layouts-root-path"></a>
<a id="ts-page-view-partials-root-path"></a>
<a id="ts-page-view-templates-root-path"></a>

## Page View Settings {#typoscript-page-view-settings}

All page view settings need to be prefixed with  `plugin.mail.view.page`.

<!-- TODO: no Markdown rendering for "only" -->

**Properties**

-   **templatesRootPath**

    -   *type:* string
    -   *Default:* EXT:mail/Resources/Private/Templates/Mail/
    -   *Path:* plugin.mail.view.page.templatesRootPath

    Path to template root for mail pages (FE)

-   **partialsRootPath**

    -   *type:* string
    -   *Default:* EXT:mail/Resources/Private/Partials/
    -   *Path:* plugin.mail.view.page.partialsRootPath

    Path to partials root for mail pages (FE)

-   **layoutsRootPath**

    -   *type:* string
    -   *Default:* EXT:mail/Resources/Private/Layouts/
    -   *Path:* plugin.mail.view.page.layoutsRootPath

    Path to layouts root for mail pages (FE)

<a id="ts-content-view-layouts-root-path"></a>
<a id="ts-content-view-partials-root-path"></a>
## Content View Settings {#ts-content-view-templates-root-path}

All content view settings need to be prefixed with  `plugin.mail.view.content`.

<!-- TODO: no Markdown rendering for "only" -->

**Properties**

-   **templatesRootPath**

    -   *type:* string
    -   *Default:* EXT:mail/Resources/Private/Templates/ContentElements/
    -   *Path:* plugin.mail.view.content.templatesRootPath

    Path to template root for mail contents (FE)

-   **partialsRootPath**

    -   *type:* string
    -   *Default:* EXT:mail/Resources/Private/Partials/
    -   *Path:* plugin.mail.view.content.partialsRootPath

    Path to partials root for mail contents (FE)

-   **layoutsRootPath**

    -   *type:* string
    -   *Default:* EXT:mail/Resources/Private/Layouts/
    -   *Path:* plugin.mail.view.content.layoutsRootPath

    Path to layouts root for mail contents (FE)

<a id="ts-content-header-image-height"></a>
<a id="ts-content-header-image-width"></a>
<a id="ts-content-header-image-alt"></a>
<a id="ts-content-header-image-src"></a>
<a id="ts-content-header-title"></a>

## Header Settings {#ts-content-header-settings}

All header settings need to be prefixed with  `plugin.mail.settings.header`.

<!-- TODO: no Markdown rendering for "only" -->

**Properties**

-   **title**

    -   *type:* string
    -   *Default:* Newsletter
    -   *Path:* plugin.mail.settings.header.title

    Title of the mail header

-   **image.src**

    -   *type:* string
    -   *Default:* EXT:mail/Resources/Public/Images/Logo.png
    -   *Path:* plugin.mail.settings.image.src

    Logo source

-   **image.alt**

    -   *type:* string
    -   *Default:* Logo
    -   *Path:* plugin.mail.settings.image.alt

    Logo alt text

-   **image.width**

    -   *type:* string
    -   *Default:* 300
    -   *Path:* plugin.mail.settings.image.width

    Logo width

-   **image.height**

    -   *type:* string
    -   *Default:*
    -   *Path:* plugin.mail.settings.image.height

    Logo height

<a id="ts-content-scss-primary-color"></a>
<a id="ts-content-scss-modification"></a>

## SCSS Settings {#ts-content-scss-settings}

All scss settings need to be prefixed with  `plugin.mail.settings.scss`.

<!-- TODO: no Markdown rendering for "only" -->

**Properties**

-   **modifications**

    -   *type:* string
    -   *Default:* EXT:mail/Resources/Public/Scss/mail.scss
    -   *Path:* plugin.mail.settings.scss.modifications

    Scss file to modify the default scss of foundation mail

-   **primary-color**

    -   *type:* color
    -   *Default:* #037eab
    -   *Path:* plugin.mail.settings.scss.primary-color

    Primary color, used with components that support the `.primary` class

-   **secondary-color**

    -   *type:* color
    -   *Default:* #777777
    -   *Path:* plugin.mail.settings.scss.secondary-color

    Secondary color, used with components that support the `.secondary` class

-   **success-color**

    -   *type:* color
    -   *Default:* #3adb76
    -   *Path:* plugin.mail.settings.scss.success-color

    Color to indicate a positive status or action, used with the `.success` class

-   **warning-color**

    -   *type:* color
    -   *Default:* #ffae00
    -   *Path:* plugin.mail.settings.scss.warning-color

    Color to indicate a caution status or action, used with the `.warning` class

-   **alert-color**

    -   *type:* color
    -   *Default:* #ec5840
    -   *Path:* plugin.mail.settings.scss.alert-color

    Color to indicate a negative status or action, used with the `.alert` class

-   **light-gray**

    -   *type:* color
    -   *Default:* #f3f3f3
    -   *Path:* plugin.mail.settings.scss.light-gray

    Color used for light gray UI items within Foundation

-   **medium-gray**

    -   *type:* color
    -   *Default:* #cacaca
    -   *Path:* plugin.mail.settings.scss.medium-gray

    Color used for medium gray UI items within Foundation

-   **dark-gray**

    -   *type:* color
    -   *Default:* #8a8a8a
    -   *Path:* plugin.mail.settings.scss.dark-gray

    Color used for dark gray UI items within Foundation

-   **black**

    -   *type:* color
    -   *Default:* #0a0a0a
    -   *Path:* plugin.mail.settings.scss.black

    Color used for black ui items within Foundation

-   **white**

    -   *type:* color
    -   *Default:* #fefefe
    -   *Path:* plugin.mail.settings.scss.white

    Color used for white ui items within Foundation

-   **pre-color**

    -   *type:* color
    -   *Default:* #ff6908
    -   *Path:* plugin.mail.settings.scss.pre-color

    Code color (\<pre>)

-   **header-color**

    -   *type:* color
    -   *Default:* #444444
    -   *Path:* plugin.mail.settings.scss.header-color

    Headlines color

-   **global-font-color**

    -   *type:* color
    -   *Default:* #444444
    -   *Path:* plugin.mail.settings.scss.global-font-color

    Text color

-   **header-background-color**

    -   *type:* color
    -   *Default:* #037eab
    -   *Path:* plugin.mail.settings.scss.header-background-color

    Header background color

-   **body-background**

    -   *type:* string
    -   *Default:* $light-gray
    -   *Path:* plugin.mail.settings.scss.body-background

    Body background color

-   **container-background-color**

    -   *type:* string
    -   *Default:* $white
    -   *Path:* plugin.mail.settings.scss.container-background-color

    Container background color

-   **footer-background-color**

    -   *type:* string
    -   *Default:* $light-gray
    -   *Path:* plugin.mail.settings.scss.footer-background-color

    Footer background color

-   **global-width**

    -   *type:* string
    -   *Default:* 600px
    -   *Path:* plugin.mail.settings.scss.global-width

    Container width

-   **global-width-small**

    -   *type:* string
    -   *Default:* 95%
    -   *Path:* plugin.mail.settings.scss.global-width-small

    Container width (small screens)

-   **global-gutter**

    -   *type:* string
    -   *Default:* 20px
    -   *Path:* plugin.mail.settings.scss.global-gutter

    Gutter for grid elements

-   **global-gutter-small**

    -   *type:* string
    -   *Default:* $global-gutter
    -   *Path:* plugin.mail.settings.scss.global-gutter-small

    Gutter for grid elements (small screens)

-   **global-padding**

    -   *type:* string
    -   *Default:* 20px
    -   *Path:* plugin.mail.settings.scss.global-padding

    Global padding

-   **global-margin**

    -   *type:* string
    -   *Default:* 16px
    -   *Path:* plugin.mail.settings.scss.global-margin

    Global margin

-   **global-radius**

    -   *type:* string
    -   *Default:* 3px
    -   *Path:* plugin.mail.settings.scss.global-radius

    Global radius

-   **global-rounded**

    -   *type:* string
    -   *Default:* 500px
    -   *Path:* plugin.mail.settings.scss.global-rounded

    Global rounded radius of rounded-corners

-   **global-breakpoint**

    -   *type:* string
    -   *Default:* $global-width + $global-gutter
    -   *Path:* plugin.mail.settings.scss.global-breakpoint

    Global media query to switch from desktop to mobile styles

## Content Objects {#content-objects}

This extension brings two new content object `EMOGRIFIER` and `SCSS`

`EMOGRIFIER` is used to transform all given css files to inline styles.

`SCSS` is used to transform given scss files to css.

See `EXT:mail/Configuration/TypoScript/ContentElements/setup.typoscript` for how to use.