Backend layouts

For some time it's possible to define the layout of the various content areas in the Page module using so called Backend Layouts. These are usually stored in records (which an easy wizard to create them), but this makes it harder to migrate them between installations.

In TYPO3 CMS 6.2 a feature was introduced that allows extensions to have a so called dataprovider for backend layouts.

Georg Ringer made an example for such an extension. In this sitepackage is a very simplified version which assumes that the files are in a specific location.

The class is located in  Classes/Provider/FileProvider.php . The provider needs to be registered with:

$GLOBALS['TYPO3_CONF_VARS']['SC_OPTIONS']['BackendLayoutDataProvider']['typo3coder'] = 'jigal\\typo3coder\\Provider\\FileProvider';

The last part between square brackets contains the prefix that will be used in the backend layout identifier. These have the naming format <prefix>__<backendLayoutName> (with 2 underscores!).

For the provider in this extension the following locations and conventions are used:

  •  backend layout:  Resources/Private/BackendLayouts/<name>.ts
  •  title:  Resources/Private/Language/BackendLayouts.xlf ; id =  <name>
  • icon:  Resources/Public/Backend/Images/<name>.png|gif

Creating backend layouts

For someone whose not familiar with the syntax the wizard can still be used. Simply create a backend layout record, use the wizard button next to the field for the definition and create the structures, set the column numbers and title as you like. Save en close the wizard. Instead of saving the record you can now copy the layout configuration and paste it into a file in the sitepackage.

Add the title to the language file, create a nice icon and that's it.

Usage in TypoScript

The identifier can easily be used to determine which page template to use for the frontend rendering:

1 {
pageLayout.cObject = TEXT
pageLayout.cObject {
data = levelfield:-1, backend_layout_next_level, slide
override.field = backend_layout
split {
token = typo3coder__
1.current = 1
1.wrap = |

10 {
file = EXT:typo3coder/Resources/Private/Templates/Templates/Main.html
format = html
partialRootPath = EXT:typo3coder/Resources/Private/Templates/Partials
layoutRootPath = EXT:typo3coder/Resources/Private/Templates/Layout
variables {
layout = TEXT = register:pageLayout

The LOAD_REGISTER part fetches the field in the current page, if necessary from pages further up in the rootline and takes into consideration the backend_layout_next_level setting. After that it removes the prefix and the two underscores to end up with the name of the layout. In the Fluid template it's now easy to use the correct template, which we simply give the same name as the backend layout:

<f:render partial="{layout}" arguments="{_all}"/>

The arguments attribute forwards all variables to the partial.

Back to Top