Fluid Templates

Fluid Templates: HTML-Vorlagen als Grundgerüst der Webseite

config.no_cache = 1
config.doctype = html5

page = PAGE
page.typeNum = 0

page.10 = FLUIDTEMPLATE
page.10 {
    format = html
    file = fileadmin/templates/templateMain.html
    partialRootPath = fileadmin/templates/partials/
    layoutRootPath = fileadmin/templates/layouts/
    variables {
      headerimage-main  < temp.headerimage-main  
      content-main < temp.content-main
      content-form < temp.content-form
      aktuelles_datum < temp.aktuelles_datum
      menu-mobile < temp.menu-mobile
      menu-main < temp.menu-main
      language < temp.language
      footer < temp.content-footer
      datenschutz < temp.datenschutz
      datenschutz-button < temp.datenschutz-button
    }
}

#Template Selector über BE-Layouts
page.10.file.stdWrap.cObject = CASE
page.10.file.stdWrap.cObject {
    key.data = levelfield:-1, backend_layout_next_level, slide
    key.override.field = backend_layout
    
    default = TEXT
    default.value = fileadmin/templates/templateMain.html
    1 = TEXT
    1.value = fileadmin/templates/templateIntro.html
    2 = TEXT
    2.value = fileadmin/templates/templateDetail.html
    3 = TEXT
    3.value = fileadmin/templates/templateMain.html
}

page.includeCSS {
    file1 = fileadmin/css/base.css
}

page.includeJSFooter {
     file1 = fileadmin/helloworld.js
     file1.type = application/x-javascript
     Include a second file, but only if myConstant is set
     in the TS constants field.
     file2 = javascript_uploaded_to_template*.js
     file2.if.isTrue = {$myConstant}

     jquery = https://code.jquery.com/jquery-3.4.1.min.js
     jquery.external = 1
}


CSS - Checkbox & Radio Buttons

Checkbox und Radio Buttons mit css stylen



CSS

AOS Animate On Scroll Library

Webseiten-Inhalte beim Scrollen einblenden



CSS Java Script

Random Content

Inhalte zufällig auslesen



Typo3 Typo Script

IMG_RESOURCE

Bild aus Seiten Ressourcen auslesen.



Typo Script

RTE CKEditor - Code-Snippet

Der seit TYPO3 8 verwendete RTE CKEditor kann sehr gut auf die eigenen Bedürfnisse konfiguriert…



Typo3 Typo Script

Sprachen Variablen ab Version 9

globalVar und Language



Typo Script

DSGVO-konform

Google Fonts lokal einbinden. Anstatt die Schriften vom Google Server zu laden, können diese auch…




Sitemap

Die XML-Sitemap richtig routen



Typo Script XML

Flexible Container und Grids

Wie man flexible seiteninterne Strukturen mit einer einfachen Erweiterung Core-nah hinzufügt.



Typo3 Typo Script PHP

Transfonter

Online Webfont Generator



CSS

SEO Typo3 News

Sitemap für News mit mehreren Landing Pages.




TYPO3 Installieren

Mit Symlinks ohne SSH per FTP installieren



PHP Typo3

Inline Youtube Video

Youtub link mit einer css classe "youtube-play" in ein iFrame umwandeln




Masonry

Masonry Anwendung für Typo3 tx_news Listen Ansicht.




Gridelements

Mittels der Extension Grid Elements erhält der TYPO3-Entwickler die Möglichkeit, komfortabel…



Typo3 Typo Script

Clickstorm SEO

cs_seo Extension optimiert SEO für TYPO3



Typo3

Slick Slider & News

Typo3 tx_news Listview Slider ohne Erweiterung erstellen, Beispiel mit dem Open Source Slick Slider.




tx_news verschiedene Bildgrössen

Bildgrösse anpassen in der ListView und der DetailView




tx_news Powermail

Felder von tx_news an Powermail übergeben, in diesem Fall für eine Event Anmeldung..



Typo3 Typo Script

Mehrere Detail Templates

Hier ist beschrieben, wie Ihr die Detail-Ansicht auf mehrere Templates aufbaut. Dieser Part…




Fluid Templates

Fluid Templates: HTML-Vorlagen als Grundgerüst der Webseite



Typo Script Typo3

Site Configuration ab TYPO3 Version 9

Seit Version 9.5 beherrscht TYPO3 "Sprechende URLs" ohne Erweiterungen. Ihr benötigt nur eine Site…




Jquery Beispiele

Mobile Menu, Menu .fadeToggle(), Responsive, window.matchMedia




Typo Script Basics

Random Content, Aktuelles Datum ausgeben, tx_news date, tx_news alle Kategorien ausgeben



Typo3 Typo Script

mp4 Video

Video full Screen einbinden




tx_news

Template Selector & Templates, show in all view default, tx_news alle Kategorien ausgeben




Page Transitions.

A simple and easy jQuery plugin for CSS animated page transitions




Partner & Links

Inspiration & Wissen.