rtgx

Vytvorenie typo3 webu - pravidlá

Šablóny HTML a CSS štýly

  • spraviť XHTML beztabuľkový layout
  • validovat minimálne pre XHTML Strict 1.0
  • CSS optimalizovať minimálne pre MS Internet Explorer 7 až 9, Firefox (SeaMonkey), Chrome, Opera

Súborový priestor

Keďže na jednej inštalácii typo3 môže byť umiestnených viacero domén alebo subdomén, máme určený tento vzor stromu súborov a názvoslovia (za názvom je zakomentovaný popis):

fileadmin
    prvastranka // podla domény: www.prvastranka.sk
        css
            style.css // základné štýly dizajnu
            rte.css // štýly pre RTE htmlarea editor
        img // obrázky dizajnu
            obrazok.jpg
            title.jpg
            ...
        inc // pomocné, užívateľské skripty
            user.inc
        js // javascript; knižnice, pomocné skripty
            prototype.js
        tmpl // HTML šablóny
            index.html // základná šablóna
            forum.html
            ...
        ts // typoscript
            setup.txt // základný typoscript stránky
...
        user_uploads // priestor pre súbory BE usera (filemount)
            dokument.doc
            ...
    druhastranka // dalšia doména
        css // štruktúra sa opakuje podľa predošlej...
            style.css
            rte.css
        img
            obrazok.jpg
            title.jpg
            ...
        tmpl
            index.html
            forum.html
            ...
        user_uploads
            dokument.doc
            ...

Typoscript

  • vytvoriť a pomenovať typo šablónu podľa domény (tak ako názov rootpage: prvastranka)
  • nastaviť Include static: content (default)
  • nastaviť Include static (from extensions): CSS Styled Content (css_styled_content)
  • uložiť na rootpage domény

Typoscript Constants

# Content formating ###

content.wrap.header = |
content.wrap.header1 = <h1> | </h1>
content.wrap.header2 = <h2> | </h2>
content.wrap.header3 = <h3> | </h3>
content.wrap.header4 = <h4> | </h4>

content.headerSpace = 0|0
content.space = 0|0
content.spaceAfter = 10

pidHome =

Typoscript Setup

# Configuration, Page ######################################################

config {
locale_all = sk_SK
language = sk
metaCharset = utf-8
doctype = xhtml_trans
htmlTag_langKey = sk
inlineStyle2TempFile = 1
removeDefaultJS = external
spamProtectEmailAddresses = 10
spamProtectEmailAddresses_atSubst = (at)
simulateStaticDocuments = 0
baseURL = www.prvastranka.eu
tx_realurl_enable = 1
no_cache = 0
}

page = PAGE
page {
  typeNum = 0
  bodyTag = <body>
}
page.includeCSS {
  rte = fileadmin/prvastranka/css/rte.css
  css = fileadmin/prvastranka/css/style.css
}
page.includeJS {
jquery = fileadmin/prvastranka/js/jquery.js
default = fileadmin/prvastranka/js/default.js
}

includeLibs.pagesTree = fileadmin/prvastranka/inc/user.inc

# Insert meta tag into head section ########################################

page.meta.description = BSP Magnetica, s.r.o. - výroba webových stránok...

page.headerData.1 = TEXT
page.headerData.1 {
  insertData = 1
  value =web,webové,stránky,webove,stranky,...,{field:title},{field:keywords}
  wrap2 = <meta name="keywords" content="|" />
}

page.headerData.2 = HTML
page.headerData.2.value (

<meta name="robots" content="index,follow" />
<meta name="author" content="BSP Magnetica, s.r.o. - výroba webových stránok" />
)

# Menu Top #############################################################

temp.menu_top = HMENU
temp.menu_top {
  entryLevel = 1
  special = directory
  special.value = 457
}
temp.menu_top.1 = TMENU
temp.menu_top.1 {
  wrap = <ul class="menuTop">|</ul>
  NO {
    allWrap = <li>|</li>
    ATagTitle.field = title
  }
  CUR = 1
  CUR {
    allWrap = <li>|</li>
    ATagParams = class="menuTopAct"
    ATagTitle.field = title
  }
  ACT = 1
  ACT < .CUR
}

# Main Menu ##############################################################

temp.menu = HMENU
temp.menu {
  entryLevel = 0
}
temp.menu.1 = TMENU
temp.menu.1 {
  wrap = <ul>|</ul>
  NO {
    allWrap = <li>|</li>
    ATagTitle.field = title
  }
  CUR = 1
  CUR {
    allWrap = <li>|</li>
    ATagParams = class="menuAct"
    ATagTitle.field = title
  }
  ACT = 1
  ACT < .CUR
}

# Menu Left ##############################################################

temp.menu_left = HMENU
temp.menu_left {
  entryLevel = 1
}
temp.menu_left.1 = TMENU
temp.menu_left.1 {
  wrap = <ul class="menuLeft">|</ul>
  NO.allWrap = <li>|</li>
  CUR = 1
  CUR {
    allWrap = <li>|</li>
    ATagParams = class="menuLeftAct"
  }
  ACT = 1
  ACT < .CUR
}

# Menu Path ###############################################################

temp.menu_path = HMENU
temp.menu_path {
  special = rootline
  special.range = 1|5
}
temp.menu_path.1 = TMENU
temp.menu_path.1 {
  target = _top
  NO {
    linkWrap = | >  |*||*|  |
  }
  CUR = 1
  CUR {
    linkWrap = | >  |*||*|  |
    noLink = 1
    doNotLinkIt = 1
  }
}

# Body template ##########################################################

temp.mainTemplate = TEMPLATE
temp.mainTemplate.template = FILE
temp.mainTemplate.template.file = fileadmin/prvastranka/tmpl/index.html

page.10 = TEMPLATE
page.10.template = FILE
page.10 < temp.mainTemplate

# Layouts variations #####################################################

temp.content = TEMPLATE
temp.content.template = FILE
temp.content.template.file = fileadmin/prvastranka/tmpl/index.html

# Finalization ###########################################################

page.10.workOnSubpart = DOCUMENT_BODY

page.10.marks {
  MENU_TOP < temp.menu_top
  MENU < temp.menu
  CONTENT_BLOCK < styles.content.get
}

# Other settings ########################################################

tt_content.text.20.parseFunc.allowTags =b,i,u,a,img,br,div,center,pre,font,hr,sub,sup,p,strong,em,
li,ul,ol,blockquote,strike,span,h1,h2,h3,h4
tt_content.image.20.maxW = 800
tt_content.div.value = <div class="divSeparator"></div>
lib.stdheader.stdWrap.dataWrap = |

lib.parseFunc_RTE {
nonTypoTagStdWrap.encapsLines.addAttributes.P.class =
externalBlocks.table.stdWrap.HTMLparser.tags.table.fixAttrib.class {
default =
always = 0
list =
}
}

TS config

  • nastavenie RTE htmlarea podľa navrhnutého designu (nadpisy, tabuľky...)
  • otestovať nastavenie RTE htmlarea: vytvoriť všetky bežne popužívané obsahové prvky (text, text s obrázom, tabuľky a zoznamy v RTE...)
  • iné špecifické nastavenia napr.: výber layouts pre stránku, výber použitých obsahových stĺpcov...

TS config, všeobecné nastavenia

mod {
SHARED.colPos_list = 0
web_list {
clickTitleMode = show
}
}

TS config, nastavenie BE formulárov

# Rename and disable pages layout options #

TCEFORM.pages.layout {
altLabels.2 = Tri stĺpce
altLabels.3 = Dva stĺpce
}

TCEFORM.tt_content.header_layout {
altLabels.2 = Nadpis 2
altLabels.3 = Nadpis 3
altLabels.4 = Nadpis 4
removeItems = 0,1,5,6
}

Backend user

  • súborový priestor pre BE užívateľa (filemount: fileadmin/prvastranka/user_uploads/)
  • BE skupina s príslušnými prístupovými právami
  • BE užívateľ, ktorý má priradenú predtým vytvorenú BE skupinu
  • otestovať vytvoreného BE užívateľa (vytváranie/editovanie stránok a obsahu)

BE user, TS config

# Allow clear Typo3 cache for BE users #

options {
clearCache.all = 1
clearCache.pages = 1
}

# Set default language, disable Flash file uploader #

setup.default {
lang = sk
enableFlashUploader = 0
}
 
Žiadne dokumenty ani odkazy k tejto stránke.