How to include Header.html partial in TYPO3 ver 9 - typo3

I want to change the Layout of my Headers in TYPO3. There is a post about this but this but I cant get it to work and that post is 2 years old. With TYPO3 most stuff is outdated quite quickly. This is the post.
Additionally I looked at this article. I know it is in German, maybe it helps anyways.
So I copied the Header.html from the TYPO3 system files, put it in a directory under fileadmin and tried to link to that directory.
fileadmin/.../Partials/Header/Header.html
In the Template setup i added the partialRootPath.
page = PAGE
page {
shortcutIcon = fileadmin/sitedesign/Resources/Private/Templates/Vave/img/Favicon.ico
10 = FLUIDTEMPLATE
10.file = fileadmin/sitedesign/Resources/Private/Templates/Vave/Contact/index.html
10.partialRootPath {
20 = fileadmin/Resources/Private/Partials
}
includeCSS {
contactFile1 = fileadmin/sitedesign/Resources/Private/Templates/Vave/Contact/css/Contact.css
}
}
In Header.html I created an additional case to check if it was working.
<f:case value="7">
<p class="{positionClass}">
<f:link.typolink parameter="{link}">{header}</f:link.typolink>
</p>
</f:case>
I then added that new case in the Page Resources to the TSConfig.
TCEFORM.tt_content.header_layout {
addItems.7 = Name1
}
Changing the content of the Header.html file in the TYPO3 system files works the way I expected it to, so I am quite sure that I understand the basic functionality. The TSConfig part works as well, because I can select "Name1" in the Header Layout Type field.
But no matter what part in the fileadmin Header.html version I change, nothing happens. I checked the path to that Partials folder and the spelling of everything a million times, so I do not think that is the issue either.
Of course I could just change the system file Header.html but that seems wrong on a lot of levels.
Thank you for any help.

Don't mix different usages of fluid!
You want to change the header partial of your content elements.
But you add the new partial to the fluid of page rendering.
if you use FSC (Fluid Styled Content) your additional partial path should go here:
lib.contentElement {
partialRootPaths {
10 = fileadmin/Resources/Private/Partials
}
}
breaking change: lib.contentElementinstead of lib.fluidContent
Additional advices:
be carefull with the names: aside from partialRootPaths there sometimes exist partialRootPath (without s in the end), which is not an object array. That enables you to set only one path (not the usual path list with priority) and which has priority over settings in partialRootPaths if both exist.
separate the different fluid usages!
Give them different paths. There are multiple ways. I prefer:
each extension gets it's own three folders in a folder named for the extension.
And also separate the page rendering and CEs (Content Elements). Your own CEs might be considered as part of the extension 'FSC'.
use a site extension.
All configuration goes into that extension: typoscript, templates, viewhelpers, TCA, ...
That is the basic configuration for that site, but also the additional configuration/ adaption for the used extensions.

May this code will help you!!
page = PAGE
page {
shortcutIcon = fileadmin/sitedesign/Resources/Private/Templates/Vave/img/Favicon.ico
10 = FLUIDTEMPLATE
10 {
templateName = TEXT
templateName {
cObject = TEXT
cObject {
data = levelfield:-2,backend_layout_next_level,slide
override.field = backend_layout
required = 1
case = uppercamelcase
split {
token = pagets__
cObjNum = 1
1.current = 1
}
}
ifEmpty = Innenseite
}
#templateName=TEXT
# templateName.value=index
layoutRootPaths {
20 = your layoutRootPaths
}
partialRootPaths {
20 = your partialRootPath
}
templateRootPaths {
20 = your templateRootPath
}
}
includeCSS {
contactFile1 = fileadmin/sitedesign/Resources/Private/Templates/Vave/Contact/css/Contact.css
}
}
Make sure header included properly in main template

Related

Override a Fluid Template from another extension

I'm working on a TYPO3 webpage for a magazine. Therefore I'm using the extension "news" or "tx_news".
Everything works fine, except that I'm confused how and where to override the given fluidtemplates from the news extension. For the webpage I'm using an own extension to keep all the backend layouts and fluid templates stored, I would like to include an own fluidtemplate for the News as well inside my extension, so the changes I make won't get overriden when I update the news extension of course.
I've tried just copy pasting the fluid templates from the news into my extension with the hope that they get overriden, since my extension has the highest priority in the backend. Also I found on the documentation that I should add the following lines into my TS setup:
plugin.tx_news {
view {
templateRootPaths >
templateRootPaths {
0 = EXT:news/Resources/Private/Templates/
1 = fileadmin/templates/ext/news/Templates/
}
partialRootPaths >
partialRootPaths {
0 = EXT:news/Resources/Private/Partials/
1 = fileadmin/templates/ext/news/Partials/
}
layoutRootPaths >
layoutRootPaths {
0 = EXT:news/Resources/Private/Layouts/
1 = fileadmin/templates/ext/news/Layouts/
}
}
}
I have added those lines at the bottom in the setup.txt of my own extension with customized paths of course and it didn't work either.
I appreciate all the help.
You missed to declare the pathes to your version of the templates.
you have two ways:
use the constants ext:news provides you and inserts automatically in the TS setup
add some lines direct to the plugin configuration.
As you use an page extension for all configuration you would avoid the TS constant editor or use it only to identify the names of the constants.
// Path constants from ext:news:
plugin.tx_news {
view {
layoutRootPath = EXT:yourextension/Resources/Private/News/Layouts/
partialRootPath = EXT:yourextension/Resources/Private/News/Partials/
templateRootPath = EXT:yourextension/Resources/Private/News/Templates/
}
}
Anyway you should end up with a TS like this (inspect with TSOB):
plugin.tx_news {
view {
templateRootPaths {
0 = EXT:news/Resources/Private/Templates/
1 = EXT:yourextension/Resources/Private/News/Templates/
}
partialRootPaths {
0 = EXT:news/Resources/Private/Partials/
1 = EXT:yourextension/Resources/Private/News/Partials/
}
layoutRootPaths {
0 = EXT:news/Resources/Private/Layouts/
1 = EXT:yourextension/Resources/Private/News/Layouts/
}
}
}
If you use method 2 you could use higher values to give your templates higher priority - in case multiple extensions and template replacements are active.
This configures the pathes for the layouts, partials and templates you are overriding:
Resources
+- Private
+- News
+- Layouts
+- Partials
+- Templates
in your extension.
Don't use the TS from your question (even if it comes from the original manual.)
It deletes the predefined pathes. (Lines 3,8,13). This might fail after an update where the internal pathes have changed.
Copy only templates from EXT:news in your extension which you
want to change. Your example TypoScript works as fallback and templates missed in 1 are searched in 0.
Overwrite only TypoScript that you want to change.
Then use TypoScript Object Browser and check the TypoScript setup for
plugin.tx_news.view...
If you don't see right paths the order of TypoScript loading must be
changed.

Include javascript (or css) as inline in HEAD with Typoscript in TYPO3 7.6

I have a little javascript file that I need to run before my site loads (it contains some modernizr code and some more).
Usually I add it using includeJS but for performance issues I need it inline. As workaround I am including it using headerData in this way:
headerData {
10 = TEXT
10.value (
<script>
// Here goes my javascript code
<script>
)
}
It works but it is ugly and difficult to update. Is there a way to say something like
headerData {
10 = TEXT
10.value < include(../path/to/my/file.js)
}
I don't see how this is an performance improvement over page.includeJs but you can just render a template here:
headerData {
10 = FLUIDTEMPLATE
10.file = EXT:my_ext/Resources/Private/Templates/MyTemplate
}

TYPO3 tx_news extension not using override template

I have two sites using the tx_news extension. As far as I can tell they are set up identically. On site A I have added a new List.html partial and it works as expected. On site B however it is completely ignoring my List override.
I have triple checked the file path to make sure the typoscript points to the right place but it still uses the default. What could be wrong here?
plugin.tx_news {
view {
templateRootPaths >
templateRootPaths {
0 = EXT:news/Resources/Private/Templates/
1 = fileadmin/templates/example/news/Templates/
}
partialRootPaths >
partialRootPaths {
0 = EXT:news/Resources/Private/Partials/
1 = fileadmin/templates/example/news/Partials/
}
layoutRootPaths >
layoutRootPaths {
0 = EXT:news/Resources/Private/Layouts/
1 = fileadmin/templates/example/news/Layouts/
}
}
}
To make it work as expected I would do the following:
1) Copy the three folders from ext/news/Resources/Private/Templates, Partials, Layouts to fileadmin/templates/example/news
(I believe you have already done that)
2) Then place this in to your template provider or page typoscript constants:
plugin.tx_news {
view {
templateRootPath = fileadmin/templates/example/news/Templates/
partialRootPath = fileadmin/templates/example/news/Partials/
layoutRootPath = fileadmin/templates/example/news/Layouts/
}
}
Now the news extension will use the Template files placed in fileadmin/
Next step would be to add some pageTSConfig inside your root pages properties in case you need more flexibility. For example like this:
tx_news.templateLayouts {
1 = Special List Item
2 = Special Detail Layout
}
That allows you to select one of these template layouts in your news plugin and to use conditions in your template file:
<f:if condition="{settings.templateLayout} == 1">
<f:then>
<!-- markup for a special list item -->
</f:then>
<f:else>
<!-- markup for another list item -->
</f:else>
</f:if>
Your script looks good. When something like this happens in TYPO3 there is an option to check whatever your TypoScript valid or this changes are really added into the right place.
Go into the BE, select the Template module and with the TypoScript Object Browser you can see if in your Setup every changes are there or not. (Or if you may have a syntax error)

Append extension output to main content via typoscript

It might be a simple solution to that but I am not able to figure it out.
I implement a typo3 6.2.12 website using the bootstrap_package extension. There I have a page with child pages within the page tree. On each child page a comment function should be attached at the end of the main page content. For the comment functionality I use the pw_comments extension, as it is very flexible.
The pw_comments manual shows a possible the integration as follows:
lib.content = COA
lib.content {
10 < styles.content.get
# List comments
20 < lib.pwCommentsIndex
# Write new comment
30 < lib.pwCommentsNew
}
Actually very simple and straightforward.
The bootstrap package extension handles the content as follows (inside base.ts):
lib.dynamicContent = COA
lib.dynamicContent {
5 = LOAD_REGISTER
5 {
colPos.cObject = TEXT
colPos.cObject {
field = colPos
ifEmpty.cObject = TEXT
ifEmpty.cObject {
value.current = 1
ifEmpty = 0
}
}
pageUid.cObject = TEXT
pageUid.cObject {
field = pageUid
ifEmpty.data = TSFE:id
}
}
20 < styles.content.get
20.select.where = colPos={register:colPos}
20.select.where.insertData = 1
20.select.pidInList.data = register:pageUid
90 = RESTORE_REGISTER
}
lib.dynamicContentSlide =< lib.dynamicContent
lib.dynamicContentSlide.20.slide = -1
And at that point I have no clue how to integrate pw_comments. In the setup of the plugin I tried this:
[PIDupinRootline = 54]
lib.dynamicContent = COA
lib.dynamicContent {
# List comments
30 < lib.pwCommentsIndex
# Write new comment
31 < lib.pwCommentsNew
}
[end]
The goal of the above is: Attach pw_comments to the main column output to each child page of parent page with uid 54.
Actually it is working but due to the inheritance with lib.dynamicContentSlide =< lib.dynamicContent the comments get also attached each of the 3 footer columns which is not desired behavior.
I could use the plugin extension which is available for pw_comments but that would mean that the editor has always to add that plugin to new child pages when creating them.
I could "hack" the fluid content template files and add a <f:cObject /> tag and call the plugin lib, but I think that solution is odd and .. well .. a hack.
So is there any way how I could attach that plugin to these child pages in a typo script way? I guess it is just a lack of syntax knowledge and yes, typo3 is not my every day job.
Hope anybody can give me a hand on this issue. Thanks so much in advance!
You simple need to replace the reference by a real copy before you add your TypoScript.
lib.dynamicContentSlide < lib.dynamicContent
# your TS goes here
Just repeat all lines with an reference to lib.dynamicContent with a copy operator instead, before you add your modifications to the actual content definition.

Adding the page content to a fluid template

I'm new to TYPO3 and Fluid and trying to display the page content using a Fluid template similar to the following one:
<div id="content">
<f:format.html>{content}</f:format.html>
</div>
The page data is entered via the backend using a two-column layout (colPos=0, colPos=1).
I am now trying to display the content of the first column (colPos=0) inside the div.
At the moment, my TYPO-Script looks like the following:
page = PAGE
page {
# ...
5 = FLUIDTEMPLATE
5 {
file = fileadmin/templates/default.html
# ...
variables {
pageTitle = TEXT
pageTitle.data = page:title
content = CONTENT
content {
table = tt_content
select {
where=colPos=0
}
renderObj = COA
renderObj {
10 = TEXT
10.field = bodytext
}
}
}
}
It works this way, but I cannot get rid of the feeling that my 5.variables.content is way too complicated.
I saw some solutions using content < styles.content.get as an alternative but using this causes my resulting div to be empty.
Are there any more elegant ways (i.e. shorter in this context) to achieve what I am doing?
On your question which approach is more elegant
(I don't use fluid, but I think it's general Typoscript):
If you want to use css_styled_content, but with more flexibility and transparence than the shortcuts "get", "getLeft" etc., use this:
content < styles.content.get
content.select.where = colPos = 0
No need to specify content = CONTENT in that case.
In the way you wrote it above, you would probably need to add:
10.parseFunc = < lib.parseFunc_RTE
to your renderObj, as else, automatically linked e-Mail addresses etc. won't be rendered in the content.
If you want full control over the markup, your original approach using the CONTENT object is superior to css_styled_content. But you will have to cover each field the editors are supposed to use.
I always use this article: http://www.typo3wizard.com/en/articles/explaining-the-content-object.html
With css_styled_content on the other hand, you get parsing for all fields for free - but also you get all the markup it will write for you.
It might be helpful to look at csc's static template in /typo3/sysext/css_styled_content/static/setup.txt to see what it does.
i dont use fluid, just plain TS for my projects, but i hope ill help.
In backend the cols are like this if u have not "touched" em:
| col1(Left) | col0(Normal) | col2(Right) | col3(Border) |
What i do is this for "normal" layout:
page.10 = TEMPLATE
page.10 {
subparts{
LEFT-CONTENT < styles.content.getLeft
CONTENT < styles.content.get
RIGHT-CONTENT < styles.content.getRight
}
marks {
DESCRIPTION < styles.content.getBorder
}
If u need something more u can use something like this to generate some content that is not on that page and can use it to display it on all pages.
subparts{
LEFT-CONTENT < styles.content.getLeft
LEFT-CONTENT {
select.pidInList = 50
select.where = colPos=0
select.orderBy = sorting
wrap = <div class="col100">|</div>
}
page.5.variables.content < styles.content.get
Of course you must have the CSS styled content extension installed (default) and the static template "CSS Styled content" included in your TypoScript Template (Tab: Includes).
Alternative solution: https://fluidtypo3.org/viewhelpers/vhs/development/Content/RenderViewHelper.html (along with get and random get/render counterparts).