[TASK] Documentation for FluidStyledContent and CSSStyledContent changes
[Packages/TYPO3.CMS.git] / typo3 / sysext / core / Documentation / Changelog / 8.6 / Breaking-79622-TypoScriptStandardHeaderHasBeenRemovedFromFluidStyledContent.rst
1 .. include:: ../../Includes.txt
2
3 ========================================================================================
4 Breaking: #79622 - TypoScript Standard Header has been removed from Fluid Styled Content
5 ========================================================================================
6
7 See :issue:`79622`
8
9 Description
10 ===========
11
12 The TypoScript standard header rendering definition `lib.stdHeader` has been
13 introduced in CSS Styled Content to reference it across multiple content
14 elements to simplify maintenance.
15
16 For Fluid Styled Content a workaround for compatibility with CMS 7 has been introduced
17 to simplify migration. However, it only renders the header and misses all frames,
18 and additional are options necessary to generate a streamlined rendering
19 output if the content element layout was not implemented correctly.
20
21
22 Example
23 -------
24
25
26 TypoScript Configuration
27 ^^^^^^^^^^^^^^^^^^^^^^^^
28
29 .. code-block:: typoscript
30
31 tt_content.simple_content = COA
32 tt_content.simple_content {
33 10 < lib.stdHeader
34 20 = TEXT
35 20.field = bodytext
36 }
37
38
39 Generated Output
40 ^^^^^^^^^^^^^^^^
41
42 .. code-block:: html
43
44 <header>
45 <h1>Nunc vel libero dignissim</h1>
46 </header>
47 <p>
48 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed cursus
49 vel lectus vel placerat. Suspendisse non metus sed lorem sagittis
50 consequat non vel nulla.
51 </p>
52
53
54 Expected Output
55 ^^^^^^^^^^^^^^^
56
57 .. code-block:: html
58
59 <div id="c53" class="frame frame-default frame-type-header frame-layout-0">
60 <a id="c62"></a>
61 <header>
62 <h1>Nunc vel libero dignissim</h1>
63 </header>
64 <p>
65 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed cursus
66 vel lectus vel placerat. Suspendisse non metus sed lorem sagittis
67 consequat non vel nulla.
68 </p>
69 <p>
70 <a href="#top">Top</a>
71 </p>
72 </div>
73
74
75 Impact
76 ======
77
78 Content elements using lib.stdHeader will miss the header in the frontend output.
79
80
81 Affected Installations
82 ======================
83
84 All installations that have content elements relying on lib.stdHeader and use
85 Fluid Styled Content as content rendering definition.
86
87
88 Migration
89 =========
90
91 To fully embrace support for Fluid Styled Content the setup needs to be changed.
92 This is a very simple example, it is highly recommended to migrate content
93 elements and plugins to only use fluid. The default fluid layout has all
94 information necessary to render the header, frame and everything else
95 correctly. That means that you do not need to care about streamlined rendering.
96
97
98 Example for Content Element with TypoScript Rendering
99 -----------------------------------------------------
100
101 If you need TypoScript to process the rendering of your content element the
102 recommended way is to use a variable to pass the rendering to fluid.
103
104
105 TypoScript Setup
106 ^^^^^^^^^^^^^^^^
107
108 .. code-block:: typoscript
109
110 tt_content.simple_content =< lib.fluidContent
111 tt_content.simple_content {
112 templateName = SimpleContent
113 templateRootPaths.12022017 = EXT:my_simple_content/Resources/Private/Templates/
114 variables.content = COA
115 variables.content {
116 10 = TEXT
117 10.field = bodytext
118 }
119 }
120
121
122 Fluid Template
123 ^^^^^^^^^^^^^^
124
125 .. code-block:: html
126
127 <html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
128 <f:layout name="Default" />
129 <f:section name="Main">
130 <f:format.raw>{content}</f:format.raw>
131 </f:section>
132 </html>
133
134
135 Recommended Content Element Rendering
136 -------------------------------------
137
138 It's highly recommended to migrate content elements to embrace fluid and
139 streamline the rendering definitions.
140
141
142 TypoScript Setup
143 ^^^^^^^^^^^^^^^^
144
145 .. code-block:: typoscript
146
147 tt_content.simple_content =< lib.fluidContent
148 tt_content.simple_content {
149 templateName = SimpleContent
150 templateRootPaths.12022017 = EXT:my_simple_content/Resources/Private/Templates/
151 }
152
153
154 Fluid Template
155 ^^^^^^^^^^^^^^
156
157 .. code-block:: html
158
159 <html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
160 <f:layout name="Default" />
161 <f:section name="Main">
162 <f:format.html>{data.bodytext}</f:format.html>
163 </f:section>
164 </html>
165
166
167 Customize header rendering
168 --------------------------
169
170 Section in the default layout are optional and have fallbacks. To change
171 for example the header rendering, place a `Header` section in a template
172 and place your adjustments. For unsetting the header simply place an empty `Header`
173 section.
174
175 .. code-block:: html
176
177 <html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
178 <f:layout name="Default" />
179 <f:section name="Header">
180 <h1>{data.header}</h1>
181 </f:section>
182 <f:section name="Main">
183 <f:format.html>{data.bodytext}</f:format.html>
184 </f:section>
185 </html>
186
187
188 .. index:: Frontend, TypoScript