Di, 09.06.15

Dienstag, 09.06.2015, 08.30 - 16.00 Uhr

• Heute: ausführliche Rekapitulation und Darstellung der Themen des Montag,
  TN-Fragen (Diverses)
• Trainer zeigt Durchlauf einer neuen TYPO3-Installation "./typo3-aktuell" inklusive Install-Tool (erste GFX Konfigurationen), einer ersten Startseite und einem Template (TypoScript Snippet von Montag genutzt!) - fertich ;-)
  hier der "kurze Ablauf"
  1) Inhalt des TYPO3-Packages (zip) in neuen Projektordner sauber entpacken
  2) Url in Browser öffnen http://localhost/typo3/typo3-aktuell
  3) Datei FIRST_INSTALL zum Freischalten der Installation in Projektordner legen
  4) Install-Routine durchführen (Hinweis: DB beim Hosting vorher anlegen)
  5) BE-Anmeldung - Install Tool aufrufen - GFX (Graphics) konfigurieren
  6) Übersetzungen "German" aktualsieren - Bentzereinstellungen auf "Deutsch" umstellen
• Übung für TN:
  zweite TYPO3-Installation für Teilnehmer, Probleme geklärt und Techniken verinnerlicht
• Syntax-Highlighting für Notepad++
  Google Suche führt zu Link - Einbau der "userDefinedLang.xml mittels Menü Sprachen - Benutzerdefiniert - Importieren...
  Anm.: Setup-TS mittels Notepad++ als *.ts Dateien sichern
  Tipp: im Notepad++, der in meinem XAMPP-CMSOD eingebaut ist, ist die Syntax-Unterstützung bereits eingebaut
• Statische Templates (Hier: css_styled_content)
  Bei Verwendung von cObject CONTENT für die table = tt_content bleibt Anzeige der Inhalte (Inhaltselemente) leer bis das Statische Template css_styled_content über die Bearbeitung des Root-Templates nachgeholt wird (Register Enthält)
  Anm.: das ist dann auch bei Erweiterungen (Extensions) wichtig, die oft ihre eigenen Statischen Templates benötigen!
  Kompakte Zuweisung der Inhalte (Datensätze) mittels der statischen Template TS Objekte:
  < styles.content.get   (weist die Inhalte für colPos = 0 aus der Tabelle tt_content zu)
  die styles.content.getLeft, .getRight, getBorder   (für die colPos = 1 , 2 und 3)
  Hier folgt ein Auszug aus dem TS-Code, den wir mit dem statischen Template css_styled_content erhalten
  

  # Clear out any constants in this reserved room!
  styles.content >
   
  # get content
  styles.content.get = CONTENT
  styles.content.get {
   	table = tt_content
   	select.orderBy = sorting
   	select.where = colPos=0
   	select.languageField = sys_language_uid
   }
   
  # get content, left
  styles.content.getLeft < styles.content.get
  styles.content.getLeft.select.where = colPos=1
  

• Seitenstrukturen und Hierarchien
  die Hierarchien ausgehend von dem TYPO3-Root beachten (siehe TYPO3-Symbol); eine gute Planung (Strukturierung) der Website ist wichtig, kann bei einem CMS aber flexible geändert werden (im Gegensatz zu statischen Websites!)
  Seitenbaum erstellt und Inhaltselemente erstellt (Text, Text und Bilder, Tabellen); einzelne Seiten müssen immer aktiviert (sichbar gemacht) werden ; jede Seite ist durch eine eindeute Seiten-ID (page id) gekennzeichnet und diese wird beim Aufruf der Seite genutzt: ./index.php?id=6
  Tipp: mit Modul Web - Funktionen lassen sich auch mehrere Seiten/Objekte in einem Schwung erstellen
  Hauptseite der Seitenbaumstruktur als "Anfang der Website" auszeichnen - dadurch wird die Hauptseite unterhalb der TYPO3-Wurzel zur Erdkugel
• Spaltenpositionen (colPos) - Übersicht:
  

  colPos	englisch	deutsch	CSS_STYLED_CONTENT
  0	normal	Normal	< styles.content.get
  1	left	Links	< styles.content.getLeft
  2	right	Rechts	< styles.content.getRight
  3	border	Rand	< styles.content.getBorder

• Backend-Layouts
  mittels Web -> Liste auf Ebene Seiten-Root einen neuen Datensatz vom Typ "Backend-Layout" erstellt und dann später über die Seiteneigenschaften im Register "Erscheinungsbild" als BE-Layout für die aktuelle Seite (und für die Unterseiten) festlegen
• Erweiterungs Templates (+ext)
  nicht verwechseln mit den nötigen TS-Templates für Erweiterungen! Sondern hier sind Verschachtelungen / Erweiterungen / Anpassungen von TypoScript-Templates in der Seitenbaumstruktur gemeint, mit denen man Einstellungen überschreiben kann oder auf mehrere Templates in der Seitenstruktur verteilen kann
  Übung: meta-Tags überschreiben, Inhalte von TS-Objekten (TEXT - value) überschrieben
• Inhaltselemente (Content Elements - CE)
  Übungen: Text, Text und Bilder (Übungen mit großen Bildern mit Speichern der Bilder im fileadmin-Ordner user_upload),
  Tipp für Tabellen: Tabellen-CE erst erstellen und dann wieder zum Bearbeiten öffnen, dann steht auch der Assistent zum Erstellen von Tabellen zur Verfügung; es lassen sich auch diverse CSV-Textformate einfach einfügen/reinkopieren
• Constants (erste Gehversuche)
  über das statische Template css_styled_content stehen jetzt über Web -> Template im Konstanten-Editor Einstellungen zum Handling vieler TYPO3-Standardausgaben (Link, Bilder, ...) zur Verfügung
  Übung: Anpassung von Pixel-Breiten für Bilder bzw. "Bilder im Text"
• Ausblick auf Morgen: "Modern Template Buildung (MTB)" - wir nutzen HTML-Vorlagen mit Platzhaltern (Marker und Subparts) und lassen diese mittels TypoScript ersetzen.

• CE Tabelle
• Template Building
• Statische Templates
• Modul Funktionen
• Technikanforderungen
• Backend Layouts

Mi, 10.06.15

Mittwoch, 10.06.2015, 08.30 - 16.00 Uhr

• Rekapitulation, TN-Fragen
  Erinnerung: Bücher (Bibliothek für TYPO3), Prüfungsinteresse (Termin geklärt)
• Übersicht der möglichen Techniken zum Ausliefern von Seiten mit TYPO3
  TYPO3 soll "Webseiten herausgeben" (Varianten ohne Anspruch auf Vollständigkeit ;-)
  1) alles per TypoScript kodieren (siehe Mo/Di - geht so, ist aber nicht "schön")
  2) Template Building (früher MTB - Modern Template Buildung) : Nutzen von HTML/CSS-Vorlagen in Kombination mit Markern (marks - Markierungsstellen) und Subparts (subparts - Markierungsklammerungen), diese Marker/Subparts werden dann per TS ersetzt
  3) Automaketemplate (Erweiterung - Autor: Kasper Skårhøj) - automatisiert das Nutzen der HTML-Seite unter Zuhilfenahme der benutzen Klassen/IDs von HTML-Tags (DIVs) und nutzt diese Bereiche als "Markierungen" zum Ersetzen
  4) Templavoilá (Erweiterung) - komplett andere Herangehensweise mit anderem TS; hier können TV-Seiten dann für die BE-Nutzer das Design der Seite abbilden und können so die Eingabe von Datensätzen erleichtern; Nachteil: sehr aufwendige Implementierung / hoher Aufwand; lässt sich heute mit Backend-Layouts und einfachen Erweiterungen (z.B. gridelements) besser und mit TYPO3-onboard-Techniken lösen
  5) Fluidtemplate - moderne Erweiterungen fluid (und extbase); wurden im Rahmen der TYPO3 Version 5 (Phoenix und Flow) entwickelt und eingeführt; wurden auch auf Version 4.5 zurückportiert
• HTML / CSS / JS - Vorlage (wieder mal ein Template ;-)
  Bereitstellung eines freien "HTML / CSS / JS"-Templates basierend auf Bootstrap-Technik: mPurpose (MIT-License)
  Auswahl einer Blog-Darstellung (mit linker oder rechter Navigationsleiste) für die Hauptdarstellung unserer TYPO3-Site
  Einbau von "Platzhaltern" zum späteren Ersetzen von Inhalten durch TYPO-TypoScript wurde durch den Trainer vorbereitet - da müsste man eben auch ordentliche HTML-Kenntnisse anwenden
  Tipp: nutzen von Code-Inspektoren (FF, Chrome mit Umschalten + Strg + I; IE mit F12) oder gerne auch Firebug unter Firefox
• Marker / Subparts
  der Einbau der Platzhaltertechniken:
  Marker (marks) der Form ###INHALT###
  Subparts (subparts) der <!-- ###NAVIBEREICH###  ...  ###NAVIBEREICH### -->
  Beispielhafte Nutzuung: page.10.marks.INHALT < styles.content.get
  bzw. page.10.subparts.NAVIBEREICH < temp.navigation
  
  
• cobject TEMPLATE nutzen:
  die eigentliche TYPO3-Seite ist komplett in page.10 = TEMPLATE untergebracht!
  

  # Default PAGE object:
  page = PAGE
  page.config.doctype = html5
  page.meta.DESCRIPTION = Eine Testseite im BU TYPO3 an der VHS Braunschweig
  page.meta.author = Joe Brandes
  
  # Laden von zwei CSS-Dateien
  page.includeCSS {
    file1 = fileadmin/mpurpose/css/main.css
    file1.title = display
    file1.media = screen
    file2 = fileadmin/mpurpose/css/bootstrap.min.css
    file2.title = display
    file2.media = screen
  }
  
  # das eigentliche Seitenelement
  page.10 = TEMPLATE
  page.10 {
    template = FILE
    template.file = fileadmin/mpurpose/vorlage-blog-left.html
    workOnSubpart = DOCUMENT
  
  # hier jetzt die Marker ersetzen - ein paar Beispiele:
    
  # Das Logo mit Bild ersetzen
    marks.LOGO = IMAGE
    marks.LOGO {
      file = fileadmin/mpurpose/img/mPurpose-logo.png
      # file.height = 200
    }
  
  # Hier den Seitennamen einfügen
    marks.SEITENNAME = TEXT
    marks.SEITENNAME.field = subtitle // title
  
  # hier den Inhalt aus Seiten / Seiteninhaltselementen einfügen
    marks.INHALT < styles.content.get
  }
  

  
  
  
• Erste Grundkonfiguration des Systems:
  die "nullte" Sprache und Umgebung auf "Deutsch" einstellen, damit man die Sprach-/Länderspezifischen Ausgaben nutzen kann
  

  # Erste Grundkonfiguration des System
  config {
    sys_language_uid = 0
    language = de
    locale_all = de_DE
  }
  

  
  
  
• Datum und Begrüßung ausgeben
  mit "deutschen Inhalten" und auch Konditionen - also Bedingungen (hier werden die Uhrzeiten genutzt für unterschiedliche Texte)
  Tipp: für die Datumskonfiguration "... date: ..." einfach eine Google-Suche nach "php date" eingeben, die führt zur PHP-Hilfeseite zur Funktion date() und liefert eine Tabelle mit den möglichen Ausgaben
  Anm.: cObjects von TYPO3 mit Zusatz _INT liefern die Bereiche immer ohne TYPO3-Caching aus!
  

  ...
  # Hier das Datum und Begrüßung einfügen - bitte an page.10. denken
    marks.DATUM = COA_INT
    marks.DATUM {
      10 = TEXT
      10 {
      value = Good Morning
      lang.de = Guten Morgen
      wrap =  | , heute ist der 
      }
      20 = TEXT
      20.data = date:d.m.y H:i
    }
  ...
  # Konditionales (d.h. mit Bedingungen)
  [hour = > 10]
    page.10.marks.DATUM.10.value = Good Afternoon
    page.10.marks.DATUM.10.lang.de = Guten Tag
  [hour = > 14]
    page.10.marks.DATUM.10.value = Good Evening
    page.10.marks.DATUM.10.lang.de = Guten Abend
  [global]
  
  

  
  
  
• Spezialseiten mit Menü (Marker oben rechts)
  Bereitstellung eines speziellen Ordners für spezielle Seiten und Links: Impressum, Kontakte, Suche
  immer wieder: bei bereitgestelltem TS-Setup-Code müssen immer die richtigen Page-IDs zugewiesen werden
  

  # das TOP-Menü oben rechts ersetzen
    marks.MENU_TOP_EXTRAS = HMENU
    marks.MENU_TOP_EXTRAS {
      special = directory
      special.value = 10
      wrap = <ul class="meineKlasse"> | </ul>
      # hier nur eine Ebene
      1 = TMENU
      1.NO.wrapItemAndSub = <li> | </li>  
    }
  

  
  cObject HMENU stellt Herarchisches Menü bereit; es soll ein spezielles "Verzeichnis (Directory)" ausgegeben werden und hier kommt der special.value ins Spiel: das muss die Page ID (pid) des Ordners "Spezialseiten" Ihrer Struktur sein
  die Objekteigenschaft NO bezeichnet den "Normal"-Zustand unsere ersten Menülinks (später auch z.B. ACT für aktive Links)
  Anm.: der besondere Wrapper (wrapItemAndSub) wird später bei mehreren Ebenen besonders wichtig!
• Menüs mit cObjects HMENU, TMENU, GMENU
  für TYPO3-Seite mit Template Building mit subparts/marks
  Einbinden der 2. Ebene, wrapItemAndSub statt einfachem linkWrap für das Wrappen ganzer li-Tags inklusive der Unterlisten (ul mit li),
  Zustände NO, CUR, ACT; Navigationen aufklappen mit expAll; intelligentes Kopieren von Teilobjekten  2.CUR < .2.NO; ausnehmen von Seiten mit excludeUidList, mit ATagParams werden Anchors (Anker Tags a) Klassen hinzugefügt
• Interne Notiz
  Datensatz für die Darstellung von Notizen für die Seitenansichten im BE
  Tipp: nutzen Sie die Ansicht "Liste" - da sind die meisten Aktionen gut erreichbar
• Rundgang durch die Module
  das Backend (BE) erkundet von oben nach unten
• Modul Datei -> Dateiliste
  Übungen mit dem fileadmin, neue Ordner angelegt und Dateien hochgeladen; BE unterstützt modernes Drag & Drop
  sauberes Anlegen von Ordnerstrukturen für Bilder, PDFs (mit Unterordnern), Nutzen der bereitgestellten Bilder in CE (Content Elements - Inhaltselementen) "Text und Bilder": jetzt kann man auch bei den Bildern die Referenzen einsehen, wo die Bilder eingesetzt werden

• H1 Headings
• Extension Template
• Modul Zugriff
• Interne Notiz
• Drag & Drop
• Firebug Analyse

Do, 11.06.15

Donnerstag, 11.06.2015, 08.30 - 16.00 Uhr

• Rekapitulation, TN-Fragen
• Verknüpfung (Seitenbaum-Objekt)
  ermöglicht Unterseite (unter Start) mit Verweis auf die Oberste Seite ("Start"), sodass diese auch in unseren Menüs, Linkstrukturen und Navigationspfaden (Breadcrumbs) auftaucht
• Website-Benutzer (FE-User)
  bitte unbedingt Unterschied zu Backend-Benutzern erkennen: FE-User können nur die Seite nutzen, haben aber keinerlei Bearbeitungsmöglichkeiten; Arbeiten im/am System können nur BE-User!
  Erstellen eines neuen Ordners "FE-Benutzer" und Einstellung (Register Verhalten) als Container für Website-Benutzer; dadurch verändert sich das Logo des Ordners in ein "User-Icon"
  über Web -> Liste die neuen Datensätze für Website-Benutzergruppe (Kunden) und danach für einen Website-Benutzer (maxmustermann) anlegen
• Anmeldung an Website (FE Login - Erweiterung felogin)
  auf Seite "Anmeldung" ein Inhaltselement Formulare - Anmeldeformular integrieren und konfigurieren (Unbeding konfigurieren: Speicherort Benutzer auf unseren FE-Benutzer Ordner)
  Test der Anmeldung/Abmeldung mittels anderen Browsers! Meldugen der Erweiterung "felogin"
  Übung: Nutzen der FE-Benutzer über die Eigenschaften "Zugriff" auf Inhaltselemente-Ebene
  Hinweis: dermaßen geschützte Seiten und Inhaltselemente sind entsprechend gekennzeichnet
• Mehrsprachigkeit
  nach TYPO3-Verständnis hat eine Grundinstallation (also quasi ein leeres TYPO3) bereits eine (erste/nullte) Sprache 0, die als STANDARD (default) bezeichnet wird; mit Setup-TS (config) stellt man dann die gewünschten Sprachkonfigurationen (config.language, config.locale_all, ...) ein.
  Wichtig:  config.sys_language_uid = 0  (das ist die ID der Sprache STANDARD)
  Weitere Website Sprache über das TYPO3-Dachelement (Web - Liste) über Neuen Datensatz hinzufügen
  Dann lassen sich alle Seiten und Elemente auch in dieser Sprache erstellen (z.B. über Web -> Info -> Übersetzungsübersicht)
  und danach die Inhaltselemente in der neuen Sprache für diese erzeugen
  Konditionales Setup-TS einfügen, damit für die neue Sprache (normalerweise sys_language_uid = 1) und den Sprach-URL-Schalter "L" jetzt auch diese anderen Datensätze aus der T3-DB geholt werden; siehe auch config.linkVars = L in der Grundkonfiguration
  URLs: index.php?id=85&L=0  vs. index.php?id=85&L=1
  Setup-TS:
  

  # Grundkonfiguration des System
  config {
    linkVars = L
    sys_language_uid = 0
    language = de
    locale_all = de_DE
    ...
  }
  ...
  
  # Konditionales (d.h. mit Bedingungen)
  [globalVar = GP:L=1]
    config.sys_language_uid = 1
    config.language = en
    config.locale_all = en_UK
    # Navigationspfad in englisch
    page.10.marks.NAVIPFAD.wrap = <br />You are here:&nbsp; |
  [global]
  
  

  
  
  
• TS "überall" - eine kurze Orientierungshilfe
  Setup-TS (die Grundkonfiguration - siehe Modul Template)
  Constant-TS (Festlegungen / Konstanten - siehe Modul Template)
  Page-TS (Konfigurationen für Seite/Page - siehe Eigenschaften Seite - Register Ressourcen - Seiten-TSconfig)
  User-TS (Konfiguration für Benutzer - siehe Modul Backend-Benutzer - Eigenschaften - Register Optionen
  Übung: User-TS für das Einschalten der IDs im Seitenbaum konfiguriert (options.pageTree.showPageIdWithTitle = 1)
• indexed_search (Extension für indizierte, erweiterte Suche)
  die Erweiterung kann nicht nur die Datensätze (TYPO3-DB) sondern auch externe Dokumente von PowerPoint-Folien bis hin zu PDFs durchsuchen und die Ergebnisse aufbereiten (config.index_externals = 1); siehe auch Konfiguration im Erweiterungsmanager (Anm.: index_externals macht auf einem Windows-Server keinen Sinn)
   die Erweiterung indexed_search befindet sich bereits im System und kann direkt aktiviert werden; neues Modul Adminwerkzeuge -> Indexierung (Aktualisierung Sprache / Übersetzungen nicht vergessen); Aktivierung der Indizierung mittels TS: config.index_enable = 1; Erstellung einer Page Suche mit dem Plug-In Indexsuche (Achtung: nicht das Suchformular als Inhaltselement sondern Allgemeines Plug-In und dann Indexsuche auswählen);
  Spezial: Bereitstellung Suchbox-TS für unseren Marker "SUCHE" - im form-Tag muss beim form-Tag action="..." die richtige pid für die Suchseite (siehe Allgemeines Plug-In vom Typ Indexsuche) erhalten
• TypoScript für unsere Seminarseite komplettiert
  TS bereitgestellt, um alle fehlenden Marker und  und Techniken der Website zu komplettieren
  Techniken:
  - beispielhafte Organisation von TS in temp./lib. Objekten
  - Sprachwechsler für Marker SPRACHE mit Flaggen
  - zentrales Menü für Marker MENU_OBEN
  - Headerbilder (Marker TRAILER) mittels cObject GIFBUILDER mit der zusätzlichen Möglichkeit für individuelle Bilder je Seite (siehe Register Ressourcen einer Seite) inkl. eines Farbverlaufs und der Seitentitel
  - Brotkrumenpfad (Marker NAVIPFAD) konfiguriert (Tipp/Anpassung: special.range = 0 | -1)
  

  # Vereinbarung für komplette Routinen in
  # Form von sogenannten temp-Objekten
  # alternativ: den Scriptcode auslagern in Dateien:
  # <INCLUDE_TYPOSCRIPT: source="FILE:fileadmin/ts-code/menus.ts">
  
  temp.menuGrafic = HMENU
  temp.menuGrafic {
          special = directory
          special.value = 1
  ...
  temp.menuTexte = HMENU
  temp.menuTexte {
           special = directory
           special.value = 1
  ...
  lib.search = COA_INT
  lib.search {
    10 = TEXT
    10 {
      typolink.parameter = "test"
      typolink.returnLast = url
      value = <form action="index.php?id=10&L=0&tx_indexedsearch[sword]" method="post" id="indexedsearch">
    }
  ...
  # Den Sprachwechsler darstellen
    marks.SPRACHE = HMENU
    marks.SPRACHE {
      special = language
      special.value = 0,1
          
      1 = GMENU
  ...
  # Den Trailer per Image und Gifbuilder erstellen
    marks.TRAILER = IMAGE
    marks.TRAILER.file = GIFBUILDER
    marks.TRAILER.file {
      XY = 750,75
      backColor = white
      # Das Hintergrundbild einlesen
      10 = IMAGE
      10 {
        file {
          import = 1
          import.data = levelmedia:-1, slide
          import.listNum = 0
          treatIdAsReference = 1
          width = 750
        }
        offset = 0,-180
      }
      # Den Verlauf einarbeiten
      20 = IMAGE
  ...
  # Den Breadcrumb / Brotkrumen / Navigationspfad einfügen
    marks.NAVIPFAD  = HMENU
    marks.NAVIPFAD {
        special = rootline
        special.range = 0 | –1
        wrap = <br />Sie sind hier:&nbsp; |
        1 = TMENU
  ...
  

  
  Die Teilnehmer haben den kompletten TS erhalten und wir werden diesen morgen noch einmal nacharbeiten.
  Übung: TS auf den eigenen TYPO3-Seitenbaum (PIDs) anpassen und Funktion erstellen
• TYPO3 Ordner und Dateien (eine kurze Übersicht)
  Hautptordner Dateien: sind von den TYPO3-Sources/Quellen (TYPO3-Core/Kern)
      index.php (die eigentlichen TYPO3-Site),
      _.htaccess (Beispieldatei für .htaccess - Steuerungsdatei für den Apache Webserver),
       diverse Readme/Info-Dateien
  ./typo3 - der eigentliche TYPO3-Kern (früher noch zusätzlicher Ordner ./t3lib)
  ./typo3temp - temporäre Ablagen (z.B. die Sprachdateien-Downloads, Unterordner ./typo3temp/GB für GIFBUILDER)
  ./fileadmin - der Dateibaum (Datei -> Dateiliste) der TYPO3-Site
  ./ uploads - die Verwaltung für "hochgeladenen" Dateien (Empfehlung: immer über fileadmin arbeiten)
  ./typo3conf - die Konfiguraiton unserer Site; Speicherort für ENABLE_INSTALL_TOOL für Zugriff auf Install-Tool,
      Ordner ./typo3conf/ext für die installierten Extensions,
      Ordner ./typo3conf/l10n für die Sprachaktualisierungen der Extensions der Site (l10n: l ocalizatio n);
      Datei LocalConfiguration.php enthält die Konfiguration der Site
          wird normalerweise mittels Install-Tool bearbeitet
          nur in Ausnahmefällen manuell: siehe DB-Zugangsdaten)
      Datei: PackageStates.php enthält den Status der installierten Pakete/TYPO3-Extensions
• Passwort Trick (ein Problemchen eines TN mal zwischendurch)
  Zugang zum BE oder gar zum Install-Tool verloren? Einfach Install-Tool aufrufen (Datei ENABLE_INSTALL_TOOL nötig/erstellen) und Passwort eingeben
  Falls das Install-Tool den Zugriff verweigert: : es zeigt den MD5-verschlüsselten (und gesalzenen) HASH-Wert an - diesen Wert dann einfach in der ./typo3conf/LocalConfiguration.php manuell ersetzen (seltener Fall für die manuelle Bearbeitung dieser Datei)
  Nach Zugriff auf das Install-Tool kann man einfach über die Kategorie Important Actions einen neuen Admin-Account erstellen.
  Tipp: beispielhafte Video-Anleitung (hier jweiland.de) für die Unterstützung und Hilfestellung im Web zu diversen solcher Problemchen.

• Sprachschalter
• LocalConfiguration.php
• Verweis
• FE-Benutzer
• Website-Sprache
• Modul Info

Fr, 12.06.15

Freitag, 12.06.2015, 08.30 - 16.00 Uhr

• Rekapitulation, TN-Fragen
  To-Do-List: das Komplett-TS diskutieren/erläutern; TS organisieren / auslagern; Musterprüfung -> ausgelagertes TS zeigen; filemetadata;  news - Georg Ringer (früher: tt_news);  TypoScript-Object Browser und TS-Analyzer; BE-Benutzer; VHosts; Backup TYPO3
• Komplett-TypoScript für "typo3-seminar"-Website
  diskutiert und erläutert; Speziell: Mehrsprachige Texte ausliefern und Probleme lösen bei verschachteltem TS (siehe COA_INT - Content Object Array ohne Caching)
  das fertige Setup-TS (bzw. die Entstehung über die Seminarwoche) wurde den Teilnehmern als *.ts Dateien bereit gestellt.
  
• TypoScript organisieren
  1) temp.menuTexte oder lib.search Objekte vordefinieren und dann zuweisen: marks.SUCHE < lib.search
  2) TS in Systemordnern unterbringen / organisieren: Template hierarchisch bauen und ineinander integrieren bis rauf in das Root-Template der Startseite (wird in der Musterprüfung angewendet)
  3) TS komplett in Dateien auslagen: <INCLUDE_TYPOSCRIPT: source="FILE:fileadmin/ts-code/menus.ts">
  Beispiel für Auslagerung/Organisationen in TS-Dateien auch bei Musterprojektseite JWeiland gezeigt
  
• cObject GIFBUILDER
  erstellen dynamischer Headerbilder (siehe Marker TRAILER): Bilder erzeugen und kombinieren inklusive Einbettung von Schriften (Tipp: Google Fonts für freie und attraktive Schriftarten), Nutzung der Bilderressourcen von Seiten für den Hintergrund der Headerbilder
  Hinweis: TypoScipt Reference (online docs.typo3.org)
• Extensions / Erweiterungsmanager
  Aktualisierung von Erweiterungen;  Importieren und Installieren der gewünschten Erweiterungen (Keys)
  Infoportal / TYPO3 Extensions Repository (TER): http://typo3.org/extensions/repository/
  Entscheidungskriterien: Aktualität, Downloadzahlen, Online-/Offline-Dokumentation(en), Entwickler (Team), Abhängigkeiten (Dependencies), unterstützte TYPO3-Versionen, Bereitstellungen als *.zip oder als *.t3x Dateien
  Erweiterungen müssen erst BE aktualisiert werden (TER-Info-Download)
  Installierte Erweiterungen bieten teilweise eigene Konfigurationen und Statische Templates; die Extensions können im BE heruntergeladen werden (ZIP für Extensions, Dump für DB-Tabellen der Extension)
  die Infos über die Erweiterngen werden aktuell in der DB abgelegt (Tabelle: tx_extensionmanager_domain_model_extension - ca.23,5 MB); dadurch ist unsere TYPO3-DB schnell ca. 30 MB groß!
  Hinweis: vorkonfigurierte Distributionen (z.B. Introduction Package - leider aktuell keine vollfunktionsfähiger Install auf Windows-XAMPP)
• Übungen mit Erweiterungen:
  Systemerweiterung: filemetadata (Dokumente / Bilder / PDFs sauber mit Informationen auf fileadmin versehen)
  Bild/Lightbox Erweiterung: jh_magnificpopup (Autor J. Heilmann - TER-Link) - die Erweiterung benötigt passendes JavaScript (jquery - passt durch unsere mpurpose-Vorlage) und wir müssen daran denken, dass das Statische Template "Magnific Popoup" in unser TS-Root-Template integriert wird (siehe Statisches Template css_styled_content); Anleitungen (Videos) auf JWeiland-Portal (Link)
  Tipp: nach dem Import und Install einer Extension bitte die Sprache(n) aktualisieren und checken, ob die Extension ein - oder mehrere - Statische Templates mitbringt
• Musterprüfung TYPO3 für den CMSOD 2.0
  Bereitstellung eines ZIP-Archivs Mustermann-Max_musterpruefungen_typo3_20150502.zip
  im Ordner C:\xampp-cmsod\__backups
  Kurzanleitung für Installation der Musterprüfung: (siehe auch Erklärungen auf der .\htdocs\cmsod-overview Website)
  - das Zip mit der Maus auf das Restore-Skript ziehen (hier: restore-cmsod-basisversion.bat)
  1) Eingabe:  musterpruefungen  (Return)
  2) Eingabe:  typo3  (Return)
  3) Eingabe:  (Return - leeres Kennwort für die Datenbank)
  man erhält Projektordner .\htdocs\musterpruefungen\typo3 und die zugehörige Datenbank muster_typo3
  Anm.: für das Zip mit dem Ergebnis der Musterprüfung müssen Sie bei der 2. Eingabe  typo3-ergebnis  eingeben!
  Kurze Einweisung in die Musterprüfung-Website - Hinweis auf die besondere TS-Organisation in Ordnern
  Übungen: ein paar Theoriefragen durchgegangen und Bearbeitung und Vorgehensweisen empfohlen
  Praxis: BE-User / FE-User  Aufgaben 8 ff
• TypoScript-Object-Browser (wie ist unser TS aufgebaut!)
  Nachschlagen der TS-Einstellungen und Zuweisungen unseres Sytems - eine hierarische, baumartige Struktur, die sich per Mausklicks erkunden lässt;
  Übungsvorschlag: die Überschrift - Layout Typen finden Si im Pfad: lib - stdHeader - 10 (CASE) - Objekte 1 bis 5 mit den passenden dataWRAPs; man könnte jetzt die entsprechenden TS-Zeilen mit eigenem TS überschreiben, um nicht immer bei Überschriften den H1-Tag ausgeliefert zu bekommen (Aber: Ihre Website sollte natürlich einen H1-Tag xfür Ihre oberste Dokumentebene haben!)
• Template Analyse
  Über Web - Template oben auf Template Analyse schalten, Konstruktion/Nutzung der Templates / Erweiterungstemplates / Statische Template ersichtich; über Klick dann Anzeige von Konstanten und Setup TS; bei Statischem Template css_styled_content wird im Setup TS dann auch die Nutzung von styles.content.get Varianten deutlich)
• Virtual Hosts (siehe auch Erläuterungen in der .\htdocs\cmsod-overview Website - im Seminar nur durch Trainer gezeigt)
  Ziel: Adresse www.typo3-62-seminar.local auf XAMPP möglich machen
  technisch.: sauberer Fully Qualified Domain Name FQDN als BaseURL ohne Schrägstriche!)
  Server-Pfad für unsere Seminarseite "typo3-seminar":  C:\xampp\htdocs\typo3\typo3-seminar
  (Apache Datei: httpd.conf) Webserver: Apache; Konfigurationsdatei: c:\xampp\apache\conf\httpd.conf
  mit includierten (eingefügten) Zusatz-Konfigurationsdateien im Unterordner .\conf\extra
  Hier: httpd-vhosts.conf  bearbeiten; Aktivieren und Eintragen der namensbasierten Virtual Hosts
  Änderungen werden durch Restart (Reload) des Webservers gültig, fehlende Ordnerstrukturen führen zu Meldungen des Servers
  Anm.: für diese Daten von "typo3-seminar" findet sich bereits ein fertiger Eintrag im XAMPP-CMSOD
  (Windows Datei: hosts) Windows-Client: Namensauflösung über hosts-Datei eintragen (muss mit Admin-Rechten geschehen!)
  Datei: c:\Windows\system32\drivers\etc\hosts 
  mit Eintrag für typo3-62-seminar.local und Alias  auf Adresse 127.0.0.1
  127.0.0.1      typo3-62-seminar.local      www.typo3-62-seminar.local   
• TYPO3-System - Backup (eine kurze Darstellung)
  TYPO3 besteht aus
  0) TYPO3-Sources (Quellen / T3-Kern): muss (eigentlich) nicht gesichert werden: ./typo3, Dateien: index.php, ...
  1) TYPO3-Projekt-Dateien: Ordner ./typo3conf, ./uploads, ./fileadmin (, ./typo3temp)
  2) TYPO3-Datenbank: Eportieren und Importieren mittels PhpMyAdmin (MySQL-Dumps; Formate: sql, zip. gz, bz2)
  Tolle Anleitungen für die Hosting-Umgebungen (Achtugn: Linux/Unix Betriebssystem) finden sich wieder bei JWeiland (z.B. Projekt kopieren)
  bei Serverumzug natürlich Anpassung der Zugangsdaten zur Datenbank (mittels Install-Tool) oder manuelles Bearbeiten der ./typo3conf/LocalConfiguration.php
  Anm./Tipp: (haben wir leider am Freitag nicht mehr geschaftt!)
  Eigenes Archivformat von T3:  .t3d-Dateien - lassen sich über die Seitenelement-Kontextmenüs mittels Exportieren / Importieren nutzen (Anm.: nicht das komplette T3-Projekt, sondern hauptsächlich die Seitenbaumstruktur!)
• Was wir nicht mehr geschaftt haben...
  - Extension news (Autor G. Ringer - TER-Link - Video Anleitungen JWeiland); in Musterprüfung eingebaut
  - Konstanten-TypoScript (Constants) - bitte Beispiel in der Musterprüfung nachvollziehen
  

  # im Konstanten-TS: (auf Root-Seite "Willkommen zur Musterprüfung")
  # =================
  # cat=cmsod; type=boolean; label= AdminPanel enable: eine Checkbox for AdminPanel
  cmsod.adminpanel = 1
  
  # im Setup-TS: (organisiert in: TS-Templates - Page - page.config)
  # ============
  # Allgemeine Konfigurationen
  config {
    linkVars = L
    sys_language_uid = 0
    # sys_language_mode = content_fallback
    sys_language_mode = strict
    sys_language_overlay = hideNonTranslated
    language = de
    locale_all = de_DE
    spamProtectEmailAddresses = 1
    spamProtectEmailAddresses_atSubst = at
    # die Konstante cmsod.adminpanel nutzen
    admPanel = {$cmsod.adminpanel}
  }
  

  
  
  
• Dokumente und Unterlagen für TN bereit gestellt
• Feedbackbögen (Anregung: TN-Skript/Herdt-Skript), TN-Bescheinigungen, letzte Fragen

• Musterprüfung
• Erweiterungen
• ext:filemetadata
• TER
• Import - Install
• Erweiterung