The intro element

The 'intro' element

On top there is the usual 'general' block.

Next there is the option to set a frame (which we need in this template to set the width of a content element in the grid).

For the header we don't need all the fields of a normal 'header' or 'headers' palette, so we'll have to make our own palette.

The last part of the 'General' tab is an RTE field.

On the 'Access' tab are the usual fields to determine visibility for frontend user and other related fields.

In the definition is also the beginning of the configuration of a tab 'Extended'. This will be added in case other extensions add fields to all TCA types. These will be added at the end of the field list and will thus end up in the 'Extended' tab. Tabs without fields are hidden by default, so the tab 'Extended' is only visible if an extension adds fields this way.

A new feature in TYPO3 CMS 6.2 is that we can simply change the TCA by putting files in Configuration/TCA/Overrides/ . The TCA in these files will be added to the cached TCA for extra speed. By convention we'll simply use as filename <tableName>.php ; in our case: Configuration/TCA/Overrides/tt_content.php .

A new palette

For the slightly different header fields there is enough inspiration in the original tt_content TCA. Look in the 'palettes' section for the palettes that are defined for the core elements.

$GLOBALS['TCA']['tt_content']['palettes']['introheader'] = array(
  'showitem' => 'header;LLL:EXT:cms/locallang_ttc.xlf:header_formlabel,
             --linebreak--, subheader;LLL:EXT:cms/locallang_ttc.xlf:subheader_formlabel,
              --linebreak--, header_link;LLL:EXT:cms/locallang_ttc.xlf:header_link_formlabel',
 'canNotCollapse' => 1
);

It adds the 'header' field with a label from the core locallang file, a line break, the 'subheader' field, and so on.

This palette can be used in the definition of the content element:

$GLOBALS['TCA']['tt_content']['types']['intro'] = array(
  'showitem' => '--palette--;LLL:EXT:cms/locallang_ttc.xlf:palette.general;general,
                 section_frame;LLL:EXT:cms/locallang_ttc.xlf:section_frame_formlabel,
                 --palette--;LLL:EXT:cms/locallang_ttc.xlf:palette.header;introheader,
                 bodytext;Text;;richtext:rte_transform[flag=rte_enabled|mode=ts_css],
                 rte_enabled;LLL:EXT:cms/locallang_ttc.xlf:rte_enabled_formlabel,
               --div--;LLL:EXT:cms/locallang_ttc.xlf:tabs.access,
                 --palette--;LLL:EXT:cms/locallang_ttc.xlf:palette.visibility;visibility,
                 --palette--;LLL:EXT:cms/locallang_ttc.xlf:palette.access;access,
               --div--;LLL:EXT:cms/locallang_ttc.xlf:tabs.extended'
);

It starts with the palette 'general', next there is the field 'section_frame', the new palette 'introheader', and so on.

Finally the new content element has to be added to the list of available content elements (the select box in the general section of a content element):

$GLOBALS['TCA']['tt_content']['columns']['CType']['config']['items'][] = array(
  'LLL:EXT:typo3coder/Resources/Private/Language/newContentElements.xlf:extra_intro_title',
  'intro',
  'EXT:typo3coder/Resources/Public/Backend/Images/intro_small.png'
);

This defines a label from a language file, the internal name of the content element ('intro') which was already used in the 'types' list earlier, and an icon.

Frontend rendering

Now that the backend knows about a new type the frontend needs to be able to render it too. All the definitions are in the tt_content section:

tt_content.intro = FLUIDTEMPLATE
tt_content.intro {
  template = FILE
  template.file = EXT:typo3coder/Resources/Private/Templates/ContentELements/Intro.html
  layoutRootPath = EXT:typo3coder/Resources/Private/Templates/Layout/
}

In the Fluid template there was a problem with the rendering of the link (displayed as “Read more”). In the backend there is a field which can be filled with the wizard. This field can contain a page UID, a file, an external URL, a mail address,... plus the settings for target, title and CSS class. Fluid currently doesn't have a viewhelper that will take all these into consideration. The page link viewhelper can accept these parameters, but will not use target, title and class.

In Classes/ViewHelpers/TypolinkViewHelper.php is a viewhelper to render the link completely with all these attributes.

TYPO3 development for fun