[TYPO3-german] Fluid Template: Bilder / CSS richtig einbinden

[Wolfertz, Sebastian]

Hallo Andreas,

habe vor 2 Monaten denselben Weg beschritten wie du und mein erstes Fluid-Template gebaut. 
Da ich nicht sicher bin wo du stehst verfasse ich mal die größtmögliche Antwort, pick dir einfach davon raus was du tatsächlich gebrauchen kannst. 

Für deine eigene, geistige Gesundheit: Benutz den Extension Builder und trage einfach nur einen Namen, Vendor Name, Key und Description ein. Dann speichern und du hast alles was du brauchst für deine Verzeichnisverwaltung.
Dadurch kannst du deine Dateien unter typo3conf/ext/deinkey ablegen und das Typoscript am Ende einfach per Template include dazuladen.

Mein Aufbau:

-typo3conf
--ext
---deinkey
----Configuration
-----TypoScript
----Resources
-----Private
------Layouts
------Partials
------Templates
-----Public
------Css
------Fonts
------Javascript
------Images

Unter deinkey/Configuration/TypoScript habe ich meine setup.ts mit folgendem Inhalt der für deine Frage von Bedeutung ist:

page = PAGE
page {
    // baseURL ist aus Sicherheitsgründen deprecated
    // stattdessen absRefPrefix verwenden
    config.absRefPrefix = http://www.example.com/
    config.baseURL >
    includeCSS {
        template_main = EXT:deinkey/Resources/Public/Css/example.min.css
    }
}

page.10 = FLUIDTEMPLATE
page.10 {
    # das neue Template:
    templateName = TEXT
    templateName.stdWrap.cObject = CASE
    templateName.stdWrap.cObject {
        key.field = backend_layout
        key.ifEmpty.data = levelfield:-2, backend_layout_next_level, slide
        default = TEXT
        default.value = default
        1 = TEXT
        1.value = default
        2 = TEXT
        2.value = sidebar_right
    }
    templateRootPaths.10 = EXT:deinkey/Resources/Private/Templates/
    partialRootPaths.10 = EXT:deinkey /Resources/Private/Partials/
    layoutRootPaths.10 = EXT:deinkey /Resources/Private/Layouts/
    variables {
        content =< styles.content.get
        content.select.where = colPos=0
        aside =< styles.content.get
        aside.select.where = colPos=2
        company  = {$constants.company}
    }
}

Für das Logo im Template benutze ich im Partials/header.html den entsprechenden Fluid-View-Helper

<img src="{f:uri.image(src: 'EXT:deinkey/Resources/Public/Images/logo.svg')}" alt="{company}"  class="logo responsive">

Natürlich nicht vergessen die eigene Extension zu installieren und per Template -> Includes ein zu binden.

Hoffe irgendein Teil des Ganzen konnte dir helfen.

MfG, Sebastian




-----Ursprüngliche Nachricht-----
Von: typo3-german-bounces at lists.typo3.org [mailto:typo3-german-bounces at lists.typo3.org] Im Auftrag von Bernhardt Andreas
Gesendet: Dienstag, 11. April 2017 22:22
An: German TYPO3 Userlist
Betreff: [TYPO3-german] Fluid Template: Bilder / CSS richtig einbinden

Hallo!

Bei meinem Versuch, mal eine erste Seite ohne die altbekannten „Standard-Templates“ oder TemplaVoila mit Fluid zu machen, stehe ich mir etwas im Weg.
Ich versuche dabei, ohne irgendwelche Extensions auszukommen, da ich garantiert wieder die auswähle, dich in einem Jahr nicht mehr unterstützt wird.


Wie kann ich denn z.B. das CSS oder Bilder so einbinden, dass sie mit dem richtigen Pfad versehen und dann geladen werden?

Bei den normalen Templates tut „relPathPrefix“ das ja - wie mache ich das bei Fluid Templates?


Besten Dank für eure Tipps!

Andreas
_______________________________________________
TYPO3-german mailing list
TYPO3-german at lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german