[TYPO3-english] Fluid Template Implementation

[Jigal van Hemert]

Hi,

On 4-10-2014 13:06, Hemantha Wijesinghe wrote:
> My own template there are meany content area is there a way to add a
> content into that by using System Folder contain file.
> How can I add the content using back end layout any related document or
> clear tutorials anybody have.

A simple method is to put the rendered content elements in TypoScript 
and insert TS objects in your Fluid template:

page = PAGE
page {
   10 = FLUIDTEMPLATE
   10 {
     file = path/to/Main.html
     format = html
     partialRootPath = path/to/Partials-directory
     layoutRootPath = path/to/Layout-directory
   }
}
# get content elements in colPos 0-3
lib.content0 < styles.content.get
lib.content1 < styles.content.getLeft
lib.content2 < styles.content.getRight
lib.content3 < styles.content.getBorder
# get colPos 4 & 5
lib.content4 < styles.content.get
lib.content4.select.where = colPos=4
lib.content5 < styles.content.get
lib.content5.select.where = colPos=5

Now in your Fluid template you can put:

<f:cObject typoscriptObjectPath="lib.content1"/>

In your backend layout you can set the colPos value that the area is 
connected to.

Different backend layouts
=========================

If you defined more than one backend layout you want to switch between 
them as they are selected in the page properties.
We'll put a variable in the FLUIDTEMPLATE object (see above) that 
contains the name of the template file.

variables {
   layout = CASE
   layout {
     # take care of selections on higher level for subpages
     key.data = levelfield:-1, backend_layout_next_level, slide
     key.override.field = backend_layout
     # BE layout with uid=1
     1 = TEXT
     1.value = homepage.html
     # BE layout with uid=3
     3 = TEXT
     3.value = otherpage.html
   }
}

Okay, some simple template structures:

Main.html:
<f:layout name="Default" />
<f:section name="main">
<!-- common html for all templates here -->
<f:render partial="{layout}" arguments="{_all}"/>
<!-- more common html for all templates here -->
</f:section>

Here the partial with the name which is loaded in the variable "layout" 
(see TypoScript above) is inserted. With the arguments="{_all}" all 
other variables are forwarded to that partial (so you can use them in 
the partial too).

Default.html (in the Layout directory defined earlier):
<f:render section="main" />

homepage.html and otherpage.html live in the partials directory we 
defined earlier and contain the HTML that is specific for that page 
type; the common stuff was already put in Main.html


>
> My template sample is attached here with.
> begin 644 typotemp.jpg
> M_]C_X0`817AI9@``24DJ``@``````````````/_L`!%$=6-K>0`!``0```!0
> M``#_X0-O:'1T<#HO+VYS+F%D;V)E+F-O;2]X87`O,2XP+P`\/WAP86-K970@

Attachments in the forum usually show up as blocks of "random" 
characters for people who read the mailing lists or news groups.

-- 
Jigal van Hemert
TYPO3 CMS Active Contributor

TYPO3 .... inspiring people to share!
Get involved: typo3.org