Typo3 HMENU in Partials not showing - typo3

i am trying to create an header in my partials folder, but actually it doesn't showed up if i am trying to insert it into my template.
My setup.ts file looks as follow:
page = PAGE
page {
200 = FLUIDTEMPLATE
200 {
file = fileadmin/private/templates/home/template.html
partialRootPath = fileadmin/private/partials
layoutRootPath = fileadmin/private/layouts/home
....
In my Layout.html file i am try to include the Header partial with the section "test" as follows:
<div>
<f:render partial='Header' section='test' />
</div>
The Header partial file is written as below:
<f:section name="test">
<ul class="flexnav" data-breakpoint="800">
<f:cObject typoscriptObjectPath="lib.navbar" />
</ul>
The "lib.navbar" is declared in my object.ts file:
lib.navbar = HMENU
lib.navbar {
entryLevel = 1
1 = TMENU
1 {
wrap = <ul class="test1"> | </ul>
NO = 1
expAll = 1
NO {
wrapItemAndSub = <li> | </li>
stdWrap.htmlSpecialChars = 1
ATagTitle.field = title
}
ACT <.NO
ACT {
wrapItemAndSub = <li class="active"> | </li>
}
}
2 = TMENU
2 {
expAll = 1
wrap = <ul> | </ul>
NO {
wrapItemAndSub = <li> | </li>
}
}
My problem is now, that i cannot use the variable lib.navbar in my templates. It is always empty. Does anyone know what i am doing wrong here?

You can either use partial or section attribute in <f:render />.
Try to use: <f:render partial="Header" /> and remove the section in your partial.

You need to use f:section like below.
<f:render section="test" />
<f:section name="test">
<ul class="flexnav" data-breakpoint="800">
<f:cObject typoscriptObjectPath="lib.navbar" />
</ul>
</f:section>

I tried your example TYPO3 Developer and i the the following exception:
In the browser:
In the log file: Oops, an error occurred! Code: 20170824201947e83f7738
Thu, 24 Aug 2017 20:19:25 +0200 [ALERT] request="d6a9827573124" component="TYPO3.CMS.Frontend.ContentObject.Exception.ProductionExceptionHandler": Oops, an error occurred! Code: 20170824201925a92fa27d - {"exception":"TYPO3Fluid\Fluid\View\Exception\InvalidSectionException: Section \"test\" does not exist. in /opt/lampp/htdocs/typo3/vendor/typo3fluid/fluid/src/View/AbstractTemplateView.php:253
I tried also to copy/paste the section in the layout file but it also hasn't work.

Related

Is possible to make a site multilanguage in TYPO3 when your menu is static?

I want to include a nav-item in my static menu from where i can change the site language.
Here is an example how to create DataProcessor and how to handle it in Fluid templates.
TypoScript:
page.10 = FLUIDTEMPLATE
page.10 {
layoutRootPath = EXT:your_sitepackage/Resources/Private/Layouts/Page/
partialRootPath = EXT:your_sitepackage/Resources/Private/Partials/Page/
file = EXT:your_sitepackage/Resources/Private/Templates/Page/Default.html
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\MenuProcessor
10 {
entryLevel = 0
levels = 2
expandAll = 1
as = mainNav
}
20 = TYPO3\CMS\Frontend\DataProcessing\MenuProcessor
20 {
special = directory
# This number is the sysfolder holding the header navigation pages
special.value = 11
as = headerNav
}
30 = TYPO3\CMS\Frontend\DataProcessing\LanguageMenuProcessor
30 {
languages = auto
as = languageNav
}
40 = TYPO3\CMS\Frontend\DataProcessing\MenuProcessor
40 {
special = directory
# This number is the sysfolder holding the footer navigation pages
special.value = 13
as = footerNav
}
}
}
In Fluid you get an array with all pages fetched by the different DataProcessors:
<f:if condition="{mainNav}">
<ul class="nav-main">
<f:for each="{mainNav}" as="item">
<li class="nav-main__item{f:if(condition: '{item.active}', then: ' nav-main__item-active')}">
<a href="{item.link}">
{item.title}
</a>
</li>
</f:for>
</ul>
</f:if>
Or the language menu:
<f:for each="{languageNav}" as="item">
<li class="language__item">
<f:if condition="{item.active}">
<f:then>
<span>{item.navigationTitle}</span>
</f:then>
<f:else>
{item.navigationTitle}
</f:else>
</f:if>
</li>
</f:for>
Of course you can choose your own classes and structure, but this possibility gives you a much easier integration.
Hope, it helps

Typo3 Fluid renders html in the frontend instead of including the html to the homepage

i am trying to use Typo3 Fluid with Backendlayouts. But instead of rendering the Content Elements it renders the Html of the Content elements. For example i have a simple Text-Element in the Backend with "some text". It will show <p>some text</p> in the Frontend not "some text" as expected. The html of the homepage looks like this:
<p>
<p>test</p>
</p>
The viewhelper i used to render the content looks like this:
<div class="col-md-4">
<f:cObject typoscriptObjectPath="lib.dynamicContent" data="{pageUid: '{data.uid}', colPos: '11'}" />
</div>
As you can see there is no <p></p> tag at all in my Default.html.
I know that the Text element itself uses the <p> </p> Tags in the backend but i am surprised they get rendered as text and also included in the html. I just want the html of the Contentelement to be included in the html of the homepage
I guess the mistake could be in this typoscript for the lib.dynamicContent in my custom theme extension:
lib.dynamicContent = COA
lib.dynamicContent {
10 = LOAD_REGISTER
10 {
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
}
contentFromPid.cObject = TEXT
contentFromPid.cObject {
data = DB:pages:{register:pageUid}:content_from_pid
data.insertData = 1
}
wrap.cObject = TEXT
wrap.cObject {
field = wrap
}
}
20 = CONTENT
20 {
table = tt_content
select {
includeRecordsWithoutDefaultTranslation = 1
orderBy = sorting
where = {#colPos}={register:colPos}
where.insertData = 1
pidInList.data = register:pageUid
pidInList.override.data = register:contentFromPid
}
stdWrap {
dataWrap = {register:wrap}
required = 1
}
}
30 = RESTORE_REGISTER
}
This is the Default.html
<f:layout name="Default" />
<f:section name="Main">
<main role="main">
<div class="container">
<div class="row">
<div class="col-md-4">
<f:cObject typoscriptObjectPath="lib.dynamicContent" data="pageUid: '{data.uid}', {colPos: '11'}" />
</div>
<div class="col-md-4">
<f:cObject typoscriptObjectPath="lib.dynamicContent" data="pageUid: '{data.uid}', {colPos: '12'}" />
</div>
<div class="col-md-4">
<f:cObject typoscriptObjectPath="lib.dynamicContent" data="pageUid: '{data.uid}', {colPos: '13'}" />
</div>
</div>
</div>
</main>
</f:section>
Thank you for your time and please comment if you need more information to be able to help me.
Daniel
I found the mistake and it was a basic one i guess. I did not include the Fluid Content Elements Css - only the Fluid Content Elements. Thanks for your input. If you have this problem include it in your typoscript or in your root-template in the backend. It should appear in "includes"
Probably missing a <f:format.raw> around your Content fluid will htmlescape by default

Using the Dataprocessor from TYPO3 8

I try to use the dataprocessor from TYPO3 8 to make my menu.
I have this code in my TypoScript script:
page = PAGE
page{
10 = FLUIDTEMPLATE
10 {
file = fileadmin/abis/templates/BootstrapTmpl.html
partialRootPath = fileadmin/abis/Partials/
layoutRootPath = fileadmin/abis/Layouts/
}
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\MenuProcessor
10 {
entryLevel= 0
excludeUidList = 27,30,31
levels = 5
#includeSpacer = 1
titleField = nav_title // title
as = huhu
}
}
...
}
And this one in a section:
<f:section name="myMenu" >
<f:debug title="title">{huhu}</f:debug>
<f:cObject typoscriptObjectPath="obj.logo" />
<ul class="nav navbar-nav navbar-left">
<f:for each="{huhu}" as="menuItem">
<li>
{menuItem.text}
<f:if condition="menuItem.subItems">
<f:render section="myMenu" arguments="{myMenu: menuItem.subItems}" />
</f:if>
</li>
</f:for>
</ul>
</f:section>
My HTML output is empty. The variable {huhu} is empty. And I don't know why. Does anybody have an idea?
Try to put your dataProcessing into page.10:
page = PAGE
page {
10 = FLUIDTEMPLATE
10 {
file = fileadmin/abis/templates/BootstrapTmpl.html
partialRootPath = fileadmin/abis/Partials/
layoutRootPath = fileadmin/abis/Layouts/
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\MenuProcessor
10 {
entryLevel= 0
excludeUidList = 27,30,31
levels = 5
#includeSpacer = 1
titleField = nav_title // title
as = huhu
}
}
}
}
First, the "dataProcessing" has to be done inside page.10. And second you have to give your arguments over to your section in the "f:render" tag. Don't know if you do that, because that part is missing in your example code.
I had a similar problem and my typoscript code was correct. However, I forgot to add
arguments="{_all}"
when calling
<f:render partial="header" arguments="{_all}" />
in my layout.
You can also use <f:debug>{huhu}</f:debug> in your Partial, if huhu is null you might have forgotten about the arguments="{_all}".

How to have Frontend Layout determine columns and backend layout?

Is there a way to have the Frontend layout determine the Backend layout, template file and columns?
At the moment I have the following code that allows you to set the Backend layout and it uses the appropriate template file. But this gets very messy when there are different column positions for each layout.
page.10 = FLUIDTEMPLATE
page.10 {
#format = html
file= fileadmin/templates/example/partials/example_home.html
partialRootPath = fileadmin/templates/example/partials/
layoutRootPath = fileadmin/templates/example/layouts/
variables {
# Assign the Columns
main < styles.content.get
main.select.where = colPos = 0
news < styles.content.get
news.select.where = colPos = 1
}
}
}
# Assign the Template files with the Fluid Backend-Template
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
# Set the default Template
default = TEXT
default.value = fileadmin/templates/example/partials/example_home.html
# Set a second Template
23 = TEXT
23.value = fileadmin/templates/example/partials/example_internal.html
}
Not messy at all, here's a real world example:
page.10 = FLUIDTEMPLATE
page.10 {
file.stdWrap.cObject = CASE
file.stdWrap.cObject {
key.data = pagelayout
default = TEXT
default.value = {$customPagesTemplatePath}/Standard.html
1 = TEXT
1.value = {$customPagesTemplatePath}/Home.html
2 = TEXT
2.value = {$customPagesTemplatePath}/Landing.html
10 = TEXT
10.value = {$customPagesTemplatePath}/NewsDetail.html
11 = TEXT
11.value = {$customPagesTemplatePath}/LandingMini.html
12 = TEXT
12.value = {$customPagesTemplatePath}/FullWidth.html
}
layoutRootPath = {$customPagesLayoutPath}
partialRootPath = {$customPagesPartialPath}
}
Think about it like this:
As you say, forget about frontend layout. That's legacy; be layout serves for BE and FE.
If a page was a city, the colPos would be the street. Or rather, imagine the Backend is a map you're drawing, and the frontend is a LEGO City you build according tho that map :-)) If it's OK, I'll stick with that metaphor.
ColPos is a determined part of a page where a record lives. If you can, take a look at the tt_content table in the database: you'll see that colPos is just a column with a number. So in the city "Page 1", there's a street called "colPos 7", and it contains some records (those would be houses). With the be_layout wizard in TYPO3 you'll create an administrative map of that city: how the editor should see these streets.
In the FLUIDTEMPLATE you call depending on the selected be_layout, you will create the city itself; the rendered frontend.
Here's another real world example for such a fluid template (Home.html):
<f:render partial="Mobilenav" />
<f:render partial="Header"/>
<div class="row">
<f:cObject typoscriptObjectPath="lib.home-teaser" />
</div>
<aside>
<div class="row">
<div class="columns">
<div class="row">
<div class="fp-teaser-outer small-48 medium-24 large-12 columns">
<div class="fp-teaser-box-wrapper">
<f:cObject typoscriptObjectPath="lib.home-something" />
</div>
</div>
<div class="fp-teaser-outer small-48 medium-24 large-12 columns">
<div class="fp-teaser-box-wrapper">
<f:cObject typoscriptObjectPath="lib.home-somethingelse" />
</div>
</div>
<div class="fp-teaser-outer small-48 medium-24 large-12 columns">
<div class="fp-teaser-box-wrapper">
<div class="fp-teaser-box">
<f:cObject typoscriptObjectPath="lib.home-news-plugin-title" />
<div class="fp-teaser-hr"></div>
<div class="fp-teaser-content">
<f:cObject typoscriptObjectPath="lib.home-news" />
</div>
</div>
</div>
</div>
<div class="fp-teaser-outer small-48 medium-24 large-12 columns">
<div class="fp-teaser-box-wrapper">
<div class="fp-teaser-box">
<f:cObject typoscriptObjectPath="lib.home-blog-plugin-title" />
<div class="fp-teaser-hr"></div>
<div class="fp-teaser-content">
<f:cObject typoscriptObjectPath="lib.home-blog" />
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</aside>
<f:render partial="Footer"/>
... well, but where's the correlation with the colPos?
Nowhere yet! I (while being positive that there are other approaches) do this in TypoScript:
lib.home-something < styles.content.get
lib.home-something {
select.where = colPos = 7
}
So by this we prepare content for the fluid template: get all content of that page's column 7 (using the extension fluid_styled_content) and put it into a "lib" content object.
That's then inserted into the page via the f:cObject viewhelper:
<f:cObject typoscriptObjectPath="lib.home-something" />
Like this, all houses in 7th street are put into the city in exactly this location – and thus rendered in your page.
Programmatically,
$backendLayout=$GLOBALS['TSFE']->cObj->getData('pageLayout');
If None was selected in the backend [-1], it will output 'none'.
If nothing was selected it will output 'default'. Otherwise it will output the correct backend layout prefixed with your extension, taking into account subpage layouts up the page ancestry chain.

TYPO3 - Custom page types not showing in menu

in my TYPO3 7.5 project I have created some custom page types by registering them in ext_tables.php as described further here
I can select those page types in the backend, no errors, all good. Also checking for a certain page-type via statements in the frontend works fine.
Now I want to create a menu of those (sub-)page trees. The TypoScript solution looks like this and works fine:
lib.tourTeasers = HMENU
lib.tourTeasers {
special = directory
wrap = <section class="row">|</section>
1 = TMENU
1 {
wrap = <div class="col-sm-12">|</div>
expAll = 1
NO {
doNotLinkIt = 1
linkWrap = <h2 style="text-align:right">Kategorie: |</h2>
}
}
2 = TMENU
2{
expAll = 1
NO{
doNotLinkIt = 1
linkWrap = <h3>Tourtyp: |</h3>
}
}
3 = TMENU
3{
NO{
doNotLinkIt = 1
linkWrap = <h4>|</h4>
after.cObject = COA
after.cObject {
stdWrap.dataWrap = <div class="row teaser">|</div>
10 = FILES
10 {
references {
table = pages
fieldName = media
}
renderObj=IMAGE
renderObj{
file{
width=300c
height=150c
#maxW=257c
#maxH=150c
import.data= file:current:publicUrl
}
altText.data = file:current:title
#altText.field=abstract
#titleText.field=nav_title
#stdWrap.dataWrap = |</a>
stdWrap.dataWrap(
<a href="index.php?id={field:uid}" title="Tour {field:title} ansehen">
<div class="col-sm-4 teaser__image">|</div>
</a>
)
params = class="img-responsive"
}
}
30 = TEXT
30.field = abstract // bodytext
30.crop = 250
30.wrap = <div class="col-sm-8 teaser__description"><p>|</p>
40 = TEXT
40.value = Ansehen
40.typolink.parameter.field = uid
40.typolink.ATagParams = class="btn"
40.wrap = <div class="button teaser__cta">|</div></div>
}
}
}
}
My problem is:
If I use the very Fluid Viewhelper that is intended to render exacly the same
<v:page.menu.directory pages="{page_uid}" as="tours" expandAll="true">
<f:for each="{tours}" as="tour">
<div class="row">
<div class="col-sm-3">
<v:page.resources.fal table="pages" field="media" uid="{tour.uid}" as="images">
<f:for each="{images}" as="image">
<f:image src="{image.url}" alt="{image.alternative} {image.name}" title="{image.title}" class="img-responsive"/>
</f:for>
</v:page.resources.fal>
</div>
<div class="col-sm-9">
<h3>{tour.title}</h3>
{tour.abstract}
</div>
</div>
</f:for>
</v:page.menu.directory>
{page_uid} being the parent page, nothing is displayed.
If I change some of the sub-pages' doktype back to "default" they are displayed in the rendered menu.
any idea as to why this is? Am i missing a certain argument in the viewhelper? i also tried to set the allowed doktypes in the viewhelper but that doesn't change anything.
thanks for the reponses, indeed it had to do with the doktype, is I didn't include the "new" ones for both the parent pages AND their sub-pages. Works now, solved. Fluid really rocks