Mit diesem ViewHelper kann ein Hintergrundbild Client-übergreifend generiert werden.
Achtung
Folgendes muss im TypoScript gesetzt sein:
config.htmlTag_setParams = xmlns:v="urn:schemas-microsoft-com:vml"
Folgender Namespace muss im Templatefile gesetzt werden:
{namespace newsletter=TYPO3\BhNewsletter\ViewHelpers}
{namespace newsletter=TYPO3\BhNewsletter\ViewHelpers}
Attribute
| Name | Beschreibung | Type | default | required |
|---|---|---|---|---|
| picture | Übergibt das Bild als Objekt - '{cObj.thing.picture}' | object | - | true |
| property | Legt fest, dass es sich um ein Bild handelt - 'picture' | string | - | true |
| height | Höhe des Bildes in Pixel | integer | - | true |
| max-width | Breite des Bildes in Outlook. Die Breite kann je nach CSS in anderen Clients diesen Wert auch überschreiten | integer | - | true |
| valign | Gibt die vertikale Ausrichtung des Contents an - (top, middle, bottom) | string | middle | false |
Beispiel
html
<newsletter:property.backgroundImage picture="{cObj.thing.picture}" property="picture" height="400" max-width="600" valign="middle">
###Content###
</newsletter:property.backgroundImage>
Ausgabe
html
<table width="100%" align="center" border="0" cellpadding="0" cellspacing="0" >
<tr>
<td data-type="picture" data-property="picture" style="background-image: url(uploads/tx_bh/1/bild.jpg); background-size: cover; background-position: center center;background-repeat:no-repeat;" background="uploads/tx_bh/1/bild.jpg" height="400" valign="middle">
<!--[if gte mso 9]>
<v:rect style="width:600px;height:400px;" strokecolor="none" stroke="false">
<v:fill type="frame" src="typo3temp/assets/_processed_/e/8/bild_c4df5ed9bf.jpg" /></v:fill>
</v:rect>
<v:shape style="position:absolute;width:600px;height:400px;">
<v:textbox style="v-text-anchor:middle" style="position:absolute;width:600px;height:400px;" >
<![endif]-->
### CONTENT ####
<!--[if gte mso 9]>
</v:textbox/>
</v:shape>
<![endif]-->
</td>
</tr>
</table>