German Talk at the TYPO3 Usergroup Meetup (October 2016) about adding a simple custom content element based on fluid_styled_content. - What's necessary to add my content element to the New Content Element Wizard - How can I define Fields/Properties of my content element - How can I add a fluid backend preview of my content element - How can I add my fluid template of my content element This talk was first presented at http://tuga.at/typo3-usergroup-austria-treffen-56-sup7even-digital-edition/ You find the code snippets at https://github.com/jousch/TYPO3talk-custom-contentelements-with-fluid_styled_content If you have any questions regarding my talk don't hesitate to contact me in typo3.slack.com @jousch or Twitter @jouschcom

1. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
1
Simple Content Elements
Auf Basis von fluid_styled_content

2. 2
Josef Glatz
@jouschcom auf Twitter
ich mag TYPO3
und arbeite bei Sup7even Digital
TYPO3BLOG.AT
PRODUCTIVENESS.JOSEFGLATZ.AT

3. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
3
„Kennt wer eine einfache Gallery,
die gut mit Bootstrap zusammen arbeitet ?“
WarumEin Talk über fluid_styled_content?
Oliver K.

4. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
3
„Kennt wer eine einfache Gallery,
die gut mit Bootstrap zusammen arbeitet ?“
WarumEin Talk über fluid_styled_content?
Oliver K.
generic_gallery
EXT fs_media_gallery
EXT layerslider
EXT
koning_bootstrap_carousel
EXT
fluid_styled_content?

5. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
4
Wer verwendet Fluid Styled Content?
Jetzt mal ehrlich?

6. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
4
Jetzt mal ehrlich?
Wer baut Custom Content Elements
mit Fluid Styled Content?

7. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
4
Jetzt mal ehrlich?
Wer verwendet KEIN
Fluid/Css Styled Content?

8. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
5
Fluid vs. TypoScript
Fluid verfügbar seit TYPO3 4.3

9. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
6
Ein neues CE anlegenAls Redakteur lege ich ein neues Content Element an

10. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
6
Ein neues CE anlegenAls Redakteur lege ich ein neues Content Element an
New Content
Element Wizard

11. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
6
Ein neues CE anlegenAls Redakteur lege ich ein neues Content Element an
New Content
Element Wizard
Bearbeitungsmaske

12. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
6
Ein neues CE anlegenAls Redakteur lege ich ein neues Content Element an
New Content
Element Wizard
Bearbeitungsmaske Backend Vorschau
im Seite Modul

13. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
6
Ein neues CE anlegenAls Redakteur lege ich ein neues Content Element an
New Content
Element Wizard
Bearbeitungsmaske Backend Vorschau
im Seite Modul
Im Frontend
begutachten

14. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
7
Die Bestandteileum ein neues Content Element anzulegen
New Content
Element Wizard
Bearbeitungsmaske Backend Vorschau
im Seite Modul
Im Frontend
begutachten

15. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
7
Die Bestandteileum ein neues Content Element anzulegen
New Content
Element Wizard
Bearbeitungsmaske Backend Vorschau
im Seite Modul
Im Frontend
begutachten
PageTSConfig
Element in gewünschter
Gruppe einfügen

16. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
7
Die Bestandteileum ein neues Content Element anzulegen
New Content
Element Wizard
Bearbeitungsmaske Backend Vorschau
im Seite Modul
Im Frontend
begutachten
TCA
PageTSConfig
Element in gewünschter
Gruppe einfügen
Typ & TCA hinzufügen

17. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
7
Die Bestandteileum ein neues Content Element anzulegen
New Content
Element Wizard
Bearbeitungsmaske Backend Vorschau
im Seite Modul
Im Frontend
begutachten
TCA
PageTSConfig
Fluid
Element in gewünschter
Gruppe einfügen
Typ & TCA hinzufügen
HTML-Markup für
TYPO3 Backend

18. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
7
Die Bestandteileum ein neues Content Element anzulegen
New Content
Element Wizard
Bearbeitungsmaske Backend Vorschau
im Seite Modul
Im Frontend
begutachten
TCA
PageTSConfig PageTSConfig
Fluid
Element in gewünschter
Gruppe einfügen
Typ & TCA hinzufügen
HTML-Markup für
TYPO3 Backend
CType mit Fluid Template
verknüpfen

19. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
7
Die Bestandteileum ein neues Content Element anzulegen
New Content
Element Wizard
Bearbeitungsmaske Backend Vorschau
im Seite Modul
Im Frontend
begutachten
TCA
PageTSConfig PageTSConfig
Fluid
Element in gewünschter
Gruppe einfügen
Typ & TCA hinzufügen
HTML-Markup für
TYPO3 Backend
CType mit Fluid Template
verknüpfen

20. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
7
Die Bestandteileum ein neues Content Element anzulegen
New Content
Element Wizard
Bearbeitungsmaske Backend Vorschau
im Seite Modul
Im Frontend
begutachten
TCA
PageTSConfig PageTSConfig TypoScript
Fluid
Element in gewünschter
Gruppe einfügen
Typ & TCA hinzufügen
HTML-Markup für
TYPO3 Backend
CType mit Fluid Template
verknüpfen
mind. 2 Zeilen

21. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
7
Die Bestandteileum ein neues Content Element anzulegen
New Content
Element Wizard
Bearbeitungsmaske Backend Vorschau
im Seite Modul
Im Frontend
begutachten
TCA
PageTSConfig PageTSConfig TypoScript
FluidFluid
Element in gewünschter
Gruppe einfügen
Typ & TCA hinzufügen
HTML-Markup für
TYPO3 Backend
CType mit Fluid Template
verknüpfen
HTML-Markup für
Frontend
mind. 2 Zeilen

22. 8
Demo Time

23. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
9
VorbereitungenDemo-Time
- TYPO3 8.4.0-dev
- Caches auf NullBackend gesetzt
- ext:fluid_styled_content aktiviert
- ext:css_styled_content deaktiviert
- eigene Theme-Extension aktiviert
Laufende TYPO3 Umgebung
- Seitenbaum angelegt
- Frontend über Fluid für Rahmenlayout
- Standard FSC Content Elemente
werden ausgegeben
Funktionierendes Frontend
- jegliches TSConfig, TypoScript, TCA (PHP) und
Fluid steht zur Verfügung
- Inkludiert ext:fluid_styled_content TypoScript
- fluid_styled_content Fluid-Pfade-Overrides
gesetzt
Theme-Extension

24. TYPO3BLOG.AT
2016 Josef Glatz jouschcom
10
Weiter geht's im
PhpStorm

25. 11
Fragen?

26. 12
Danke
Code Snippets vom Live-Coding unter
https://github.com/jousch/TYPO3talk-custom-contentelements-with-fluid_styled_content
Dieser Talk wurde im Rahmen des
TYPO3 Usergroup Austria Meetups im Oktober 2016 vorgetragen
http://tuga.at/typo3-usergroup-austria-treffen-56-sup7even-digital-edition/