Typo3 Bednarik.org

Typo3 šablony

Proč šablony?

Šablony jsou zde proto, aby bylo docíleno shodného vzhledu všech stránek (samozřejmě jde nadefinovat více šablon pro jeden web a každá větev stránek může mít jiný vzhled).

Pomocí šablony se vytvoří základní vzhled webu, nadefinují se jednotlivé oblasti a doplní se obsah. Definicí oblastí se myslí určení míst, kde bude menu, kde bude obsah, kde bude anketa atd.

Proč šablony? Protože přeci nemůžeme dát uživateli možnost zasahovat do vzhledu stránky jenom tak. Uživatel má možnost přidávat obsah, ale neměl by zasahovat do komplexního vzhledu. Pomocí šablony určíme místa, kam lze přidat obsah a mimo tuto oblast nebude moci uživatel zasáhnout.

Vytvoření šablony

Já osobně mám specifický postup tvorby, ale domnívám se, že zásadně rozdílný není ani možný. V čem tedy spočívá?

1. Návrh designu
Ten si samozřejmě připravím buď na papíře nebo v nějakém grafickém editoru, případně jej obdržím od designéra.
Potřebná znalost: grafické cítění

2. Vytvoření statické šablony
Převedení grafického návrhu do statické HTML stránky. To je defakto běžný postup při vytváření statické prezentace. Jediný rozdíl je v tom, že je jedno jaký obsah se doplní, je zde pouze kvůli testování.
Potřebná znalost: xHTML, CSS, JavaScript

3. Doplění Typo3 značek
Pro definování oblastí v šabloně je třeba doplnit značky (tzv. markers), které určí, kde bude menu, kde bude obsah atd. Tyto značky vždy tvoří dvojici - počáteční a koncovou. Počáteční vypadá např. takto: <!-- ###ZNACKA### start--> a koncová poté <!--### ZNACKA ### end-->. Jak je vidět, tyto značky jsou ve formátu HTML poznámky, tím pádem nenaruší nijak obsah šablony. Značky jsou posléze nahrazeny dynamicky generovaným obsahem.

4. Tvorba kostry stránek
Nejprve je nutné vytvořit prázdné stránky v Typu. Každá šablona totiž musí být vázána ke stránce. Ovšem kvůli testování definice menu je vhodné ihned vytvořit co nejvíce stránek. Obsah se doplní později.

5. Definice Typo3 šablony
Nyní nadchází nejtěží část tvorby. Šablony jsou tvořeny jakýmsi pseudojazykem nazvaným TypoScript. Více než jazyk se jedná o definování proměnných a na základě jejich hodnot se poté generuje samotný obsah. Příklad jednodušší šablony, která tvoří tento web je k náhledu zde.
Potřebná znalost: TypoScript

6. Doplnění obsahu
Šablona je hotova, zbývá doplnit obsah, to již ale není úkol pro programátora, že :)

TypoScript

Ja již bylo řečeno, TypoScript není programovací jazyk (jak by se mohlo zdát díky podobnosti názvu s JavaScriptem), ale spíše obrovské množství proměnných, kterým je přiřazena hodnota.

Například TypoScript definice tt_content.menu.20.2.1.NO. allWrap = x|x se "přepíše" do podoby proměnné PHP, která bude $GLOBALS['TSFE']->tmpl->setup ['tt_content.']['menu.']['20.']['2.'] ['1.']['NO.']['allWrap'] = x|x

Raději tedy nezkoumat, jak to funguje, hlavně že to funguje.

Naučit se TypoScript není jen tak. Asi jako naučit se programovací jazyk o kterém nevíte vůbec nic. Specifické je to navíc v tom, že se nejedná ani o funkcionální ani o imperativní sémantiku. Prostě je to něco speciálního.

Osobně se musím přiznat, že po roce práce s Typo3 a někola desítek hotových šablon mi stále některé věci nejsou jasné. Naštestí je příliš často nepotřebuji nebo si holt musím poradit jinak.

Největším pomocníkem v začátcích jsou asi návody, které jsou k nalezení na stránkách www.typo3.org

  • TypoScript by Example
  • TypoScript Reference

Druhá z nich je jakási bible TypoScript programátora. Jedná se o popis všech vlastností, které jsou v TypoScriptu dostupné.

 

You can support development of CoolUri extension (or anything else) by donation.

 
XLINE hosting + Typo3 = ideální kombinace