TemplaVoila! für Typo3 ist schon eine schicke Sache und wird sehr gern für unsere Kundenprojekte genutzt. Dumm jedoch, dass TV seit geraumer Zeit die Elemente mit dem Typ “Inhaltselemente auswählen” im Backend in Spalten nebeneinander und nicht untereinander darstellt. Nicht nur, dass es für uns verwirrend ist, es ist auch für die Kunden die später mal ihre Seiten selbst pflegen sollen alles andere als intuitiv.

Um dieses Problem zu beheben und euch an der Lösung teilhaben zu lassen, beschreiben wir, wir ihr das Layout selt in wenigen Schritten ändern könnt.

Schritt 1:
Als erstes öffnet bitte die index.php im Order typo3conf/ext/templavoila/mod1.

Schritt 2:
Geht dann zu Zeile 1408. Dort ersetzt ihr folgenden Inhalt:

foreach ($cells as $cell) {
	$headerCells[] = vsprintf('<td width="%4$d%%" class="bgColor6 tpm-title-cell">%3$s</td>', $cell);
	$contentCells[] = vsprintf('<td %2$s width="%4$d%%" class="tpm-content-cell">%5$s</td>', $cell);
}

$output = '
<table border="0" cellpadding="2" cellspacing="2" width="100%" class="tpm-subelement-table">
	<tr>' . (count($headerCells) ? implode('', $headerCells) : '<td>&nbsp;</td>') . '</tr>
	<tr>' . (count($contentCells) ? implode('', $contentCells) : '<td>&nbsp;</td>') . '</tr>
</table>
';

durch diesen hier:

foreach ($cells as $cell) {
	//$headerCells[] = vsprintf('<td width="%4$d%%" class="bgColor6 tpm-title-cell">%3$s</td>', $cell);
	//$contentCells[] = vsprintf('<td %2$s width="%4$d%%" class="tpm-content-cell">%5$s</td>', $cell);
	$contentCells[] = '<tr>' . vsprintf('<td width="100%%" class="bgColor6 tpm-title-cell">%3$s</td>', $cell) . '</tr>'; // header cell
	$contentCells[] = '<tr>' . vsprintf('<td %2$s width="100%%" class="tpm-content-cell">%5$s</td>', $cell) . '</tr>'; // content cell
}

//$output = '
//	<table border="0" cellpadding="2" cellspacing="2" width="100%" class="tpm-subelement-table">
//		<tr>' . (count($headerCells) ? implode('', $headerCells) : '<td>&nbsp;</td>') . '</tr>
//		<tr>' . (count($contentCells) ? implode('', $contentCells) : '<td>&nbsp;</td>') . '</tr>
//	</table>
//';

$output = '
	<table border="0" cellpadding="2" cellspacing="2" width="100%" class="tpm-subelement-table">
		' . (count($contentCells) ? implode('', $contentCells) : '<tr><td>&nbsp;</td></tr>') . '
	</table>
';

Schritt 3:
Fertig! Nun braucht ihr nur noch die entsprechende Seite im Backend anschauen und euch davon zu überzeugen :)