TYPO3 Introduction Package

Um ein bestehendes Template in TYPO3 auf Basis des Introduction Packages anzupassen, genügt es in den meisten Fällen, sich im Ordner \typo3conf\ext\bootstrap_package\Resources\Private\Templates\Page\ aufzuhalten, so z.B. für eine Anpassung des 3-spaltigen Templates die Datei \typo3conf\ext\bootstrap_package\Resources\Private\Templates\Page\ Default3Columns.html anzupassen. Möchte man jedoch die Möglichkeit haben,  weitere Zeilenstrukturen oberhalb oder unterhalb der gegebenen 3-Spaltigkeit einzurichten, ist dies in den Backendtemplates anzugeben.

 

  Möchte man nun beispielsweise im Backend für das 3-spaltige Layout die Möglichkeit haben einen Block in voller Breite oberhalb des 3-spaltigen Inhalts einzufügen, verändert man in der Datei

 

\typo3conf\ext\bootstrap_package\Configuration\PageTS\Mod\WebLayout\BackendLayouts\default_3_columns.txt

 

diesen Teil:

 

                        rowCount = 2

                        rows {

                            1 {

                                columns {

                                    1 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.left

                                        colPos = 1

                                        colspan = 1

                                    }

                                    2 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.normal

                                        colPos = 0

                                        colspan = 4

                                    }

                                    3 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.right

                                        colPos = 2

                                        colspan = 1

                                    }

                                }

                            }

                            2 {

                                columns {

                                    1 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.footer1

                                        colPos = 10

                                        colspan = 2

                                    }

                                    2 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.footer2

                                        colPos = 11

                                        colspan = 2

                                    }

                                    3 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.footer3

                                        colPos = 12

                                        colspan = 2

                                    }

                                }

                            }

                        }

 

zu 3 Zeilen, so zu beispielsweise:

 

                        rowCount = 3

                        rows {

                            1 {

                                columns {

                                    1 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.top

                                        colPos = 20

                                        colspan = 6

                                    }

                                }

                            }

                            2 {

                                columns {

                                    1 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.left

                                        colPos = 1

                                        colspan = 1

                                    }

                                    2 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.normal

                                        colPos = 0

                                        colspan = 4

                                    }

                                    3 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.right

                                        colPos = 2

                                        colspan = 1

                                    }

                                }

                            }

                            3 {

                                columns {

                                    1 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.footer1

                                        colPos = 10

                                        colspan = 2

                                    }

                                    2 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.footer2

                                        colPos = 11

                                        colspan = 2

                                    }

                                    3 {

                                        name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.footer3

                                        colPos = 12

                                        colspan = 2

                                    }

                                }

                            }

                        }

 

Bitte hierbei beachten: Alte Datei nicht als geringfügig umbenannte Datei sichern (z.B. default_3_columnsSICHERUNG.txt o.Ä.), diese wird von TYPO3 noch berücksichtigt und stört damit dann den Ablauf. Heißt also: Wir erhöhen den rowCount von 2 auf 3 und fügen vor den bestehenden Zeilen noch eine weitere Zeile ein mit Spalte mit eigener colPos (diese wird dann nachher in obiger Datei \typo3conf\ext\bootstrap_package\Resources\Private\Templates\Page\Default3Columns.html verwendet) und colspan 6 (Zeile erstreckt sich also über die gesamte Breite). Da wir die Position nun mit "top" bzw. "name = LLL:EXT:bootstrap_package/Resources/Private/Language/Backend.xlf:backend_layout.column.top" bezeichnet haben, müssen wir nun auch noch in den Übersetzungen eingreifen. So fügen wir die neue Position dann zuerst ein in

 

\typo3conf\ext\bootstrap_package\Resources\Private\Language\Backend.xlf

 

als

 

<trans-unit id="backend_layout.column.top">

                <source>Top</source>

</trans-unit>   

 

und berücksichtigen diese dann noch in der jeweiligen Sprache (hier: Deutsch) in

 

\typo3conf\l10n\de\bootstrap_package\Resources\Private\Language\de.Backend.xml

 

mit

 

<label index="backend_layout.column.top">Oben</label>

 

und in

 

\typo3conf\l10n\de\bootstrap_package\Resources\Private\Language\de.Backend.xlf

 

mit

 

<trans-unit id="backend_layout.column.top" approved="yes">

                <source>Top</source>

<target state="translated">Oben</target></trans-unit>

 

Nun kann man mit der neu geschaffenen Position in der oben \typo3conf\ext\bootstrap_package\Resources\Private\Templates\Page\Default3Columns.html arbeiten, heißt also: einfügen in der Fluid-Template-Syntax (f:cObject, siehe hierzu auch https://docs.typo3.org/typo3cms/ExtbaseGuide/Fluid/ViewHelper/CObject.html) z.B. als

 

<f:cObject typoscriptObjectPath="lib.dynamicContent" data="{pageUid: '{data.uid}', colPos: '20'}" />

 

Damit sind wir fertig. Getestet in TYPO3 8.7.1.