Hallo,
@ André Sancken
vielen Dank für Deinen Einwurf.
Mit der Boilerplate-Extension war ich aber letztendlich nicht zufrieden,
weil diese etwas veraltet ist. Ich habe mir aber das Setup der Extensoin
genauer angesehen und so mein eigenes Boilerplate-template aufbauen können.
Hier kurz die einzelnen Elemente:
config {
headerComment (
Diese Seite wurde erstellt von:
Marco Brüggemann
)
doctype=html5
htmlTag_setParams=none
htmlTag_stdWrap {
setContentToCurrent = 1
cObject = COA
cObject {
10 = LOAD_REGISTER
10 {
newLine.char = 10
tagEnd {
current = 1
split.max = 2
split.token = <html
split.returnKey = 1
}
}
20 = TEXT
20.value = <!--[if lt IE 8]> <html class="no-js ie7 oldie"
{register:tagEnd} <![endif]-->
20.wrap = |{register:newLine}
20.insertData = 1
30 < .20
30.value = <!--[if IE 8]> <html class="no-js ie8 oldie"
{register:tagEnd} <![endif]-->
40 < .20
40.value = <!--[if IE 9]> <html class="no-js ie9 oldie"
{register:tagEnd} <![endif]-->
50 < .20
50.value = <!--[if gt IE 9]> <!--><html
class="no-js"{register:tagEnd} <!--<![endif]-->
90 = RESTORE_REGISTER
}
}
xmlprologue = none
xhtml_cleaning = all
disablePrefixComment = 1
inlineStyle2TempFile = 1
moveJsFromHeaderToFooter = 0
removeDefaultJS = 1
compressJs = 0
# Realurl Setup
simulateStaticDocuments=0
tx_realurl_enable=1
baseURL= {$BaseURL.srg}
### unterdrückt den automatisch erstellten Header
# disableAllHeaderCode=1
disableImgBorderAttr = 1
### unterdrückt die Comments in der HTML-Ausgabe
disablePrefixComment = 1
### Mehrsprachigkeit
linkVars = L, print
uniqueLinkVars = 1
language = de
locale_all = de_DE.UTF8
renderCharset = utf-8
sys_language_uid = 0
sys_language_mode = content_fallback
sys_language_overlay = hideNonTranslated
### Spam protection
spamProtectEmailAddresses = ascii
### Multidomain setup
typolinkCheckRootline = 1
typolinkEnableLinksAcrossDomains = 1
### Search. This should be disabled if you are not using Indexed
search!
index_enable = {$config.index_enable}
index_externals = {$config.index_externals}
### CoolURI aktivieren
tx_cooluri_enable = 1
redirectOldLinksToNew = 1
### CoolURI aktivieren
config.noPageTitle = 2
}
page = PAGE
page {
# Der eigentliche Seiteninhalt.
10 < tmp.pagebuild
meta {
# verschiedene Metadaten (X-UA-Compatible für Boilerplate)
X-UA-Compatible = IE=edge,chrome=1
X-UA-Compatible.httpEquivalent = 1
keywords = {page:keywords}
keywords.insertData = 1
description = {page:description}
description.insertData = 1
viewport = width=device-width, initial-scale=1
autor = {$designerPerso.srg} - {$designerFirm.srg}
autor.insertData = 1
}
includeCSS {
# Einbinden von CSS-Dateien (Boilerplate) im Header
normalize = fileadmin/css/normalize.css
main = fileadmin/css/main.css
lightbox = fileadmin/css/lightbox.css
}
includeJS {
# Einbinden einer Javascript-Datei (Boilerplate) im Header
modernizr = fileadmin/js/modernizr-2.6.2.min.js
}
includeJSFooter {
# Zwei externe Javascript-Dateien von Google im Footer
googlejquery = {$jquery.srg}
googlejquery.external = 1
googlejqueryUI = {$jqueryUI.srg}
googlejqueryUI.external = 1
# Einbinden von Javascript-Dateien im Footer
plugins = fileadmin/js/plugins.js
boxheight = fileadmin/js/boxheight.js
lightbox = fileadmin/js/lightbox.js
main = fileadmin/js/main.js
eigene = fileadmin/js/eigene.js
}
headerData {
# Google Webfont im Header mit der Variablen {$GoogleFont.srg}
für den Font
10 = COA
10 {
10= TEXT
10.value = <script
type="text/javascript">WebFontConfig={google:{families:[
20= TEXT
20.value = {$GoogleFont.srg}
20.insertData = 1
30= TEXT
30.value = ]}};(function(){var
wf=document.createElement('script');wf.src=('https:'==document.location.protocol?'https':'http')+'://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';wf.type='text/javascript';wf.async='true';var
s=document.getElementsByTagName('script')[0];s.parentNode.insertBefore(wf,s);})();</script>
}
}
footerData {
# Google Analystic am ende der Webseite, mit den Variablen
{$GoogleAnalyticsTrackingID.srg} und {$GoogleAnalyticsSite.srg}
10 = TEXT
10.value
=<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new
Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create',
'{$GoogleAnalyticsTrackingID.srg}',
'{$GoogleAnalyticsSite.srg}');ga('send', 'pageview');</script>
}
}
Am 10.02.2014 08:40, schrieb André Sancken:
es gibt doch eine extension html5boilerplate
Mit freundlichem Gruß
André Sancken
Digitalartworx
Uhlandstr. 3a
27576 Bremerhaven
Tel: 0471/4835667
http://www.digitalartworx.net
a.sanc...@digitalartworx.net
Am 10.02.2014 um 08:34 schrieb Marco Brüggemann <ma...@schauart.de>:
Guten Morgen,
ich habe meine Webseite mit der "Boilerplate" [http://html5boilerplate.com/]
aufgebaut, um eine möglichst eine optimale Verfügbarkeit für die unterschiedlichen
Browser zu erreichen. Boilerplate hat Einträge im Header, hinter dem Body-tag und
unterhalb der Webseite. Daher habe ich die automatische generierung des Headers
ausgeschalten:
config.disableAllHeaderCode=1
Den neuen Header, das was direkt am Anfang unterhalb des Body-Start-Tag, und
das was direkt ans Ende, oberhalb vom Body-End-Tag kommt, habe ich also in
TypoScript geschrieben und hier zum Beispiel benötigte Javascript-Dateien und
benötigte css-Dateien von Hand eingefügt. Das funktioniert auch.
Das Problem: will ich dann doch eine Extension nutzen, dann muss ich erst die
ganze Extension analysieren und benötigte JS- und CSS-Dateien von Hand and die
richtigen Positionen eintragen, was natürlich aufwendig und unflexibel ist.
Ich sehe zur Zeit zwei möglichkeiten:
1.) es muss doch ein bestehendes TS geben, welches den Header generiert. Kann
ich den nicht so umschreiben, dass dieser mir letztentlich das Format der
Boilerplate auswirft?
2.) Ich behalte meinen eigenen Header, füge aber das Skript ein, welches mir
die Einbindung von JS- und CSS-Dateien so ermöglicht, wie es eigentlich mit TS
gedacht ist (und vor allem, damit die Extensions wieder ihren Code einfügen
können):
includeJS {
file1 = fileadmin/helloworld.js
file1.type = application/x-javascript
file2 = javascript_uploaded_to_template*.js
}
und
includeCSS {
file1 = fileadmin/mystylesheet1.css
file2 = stylesheet_uploaded_to_template*.css
file2.title = High contrast
file2.media = print
}
Könnt Ihr mir sagen, wie ich 1) oder 2) umsetzen kann?
Vielen Dank,
Marco.
_______________________________________________
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
_______________________________________________
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
_______________________________________________
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
