Typolink inside section menu COA - typo3

I have a custom section menu where I need a specific part of the menu item to be linked instead of the whole thing.
At the moment the typolink part doesn't do anything:
tt_content.menu.20.101 < tt_content.menu.20.3
tt_content.menu.20.101 {
1.NO {
doNotLinkIt = 1
stdWrap.htmlSpecialChars = 0
stdWrap.cObject = CONTENT
stdWrap.cObject {
table = tt_content
select {
pidInList.field = uid
}
renderObj = COA
renderObj {
10 = TEXT
10.field = header
10.typolink {
section.cObject = TEXT
section.cObject.field = uid
section.cObject.wrap = c|
}
20 = TEXT
20.field = rowDescription
20.wrap = <h6>|</h6>
}
}
}
}
So the output I want from the example above would be something like:
<ul>
<li>Element HeaderElement Description etc..</li>
</ul>

in the documentation you will find two possibilies:
insert the complete anchor (with hash) into parameter
use .section in combination with a page id for parameter (assuming the anchor is on another page)
that gives two solutions:
typolink {
paramter.cObject = TEXT
paramter.cObject {
field = uid
wrap = #c|
}
}
or
typolink {
parameter.field = pid
section.cObject = TEXT
section.cObject.field = uid
section.cObject.wrap = c|
}

Related

HMENU: How to wrap page content into my menu?

I would like to build a full with dropdown menu based on page content defined into a folder.
The idea is to have:
MENU (folder)
- menu 1 (page)
- menu 2 (page)
My goal is to get the following output:
menu 1 content in menu 1 page
menu 2 content in menu 2 page
There is only one content bloc in the pages.
No problem to get the li with menu 1 / 2 but I cannotfind the way to get and wrap the page content.
My code looks like
menu.nav = HMENU
menu.nav {
special = directory
special.value = 214
entryLevel = 1
1 = TMENU
1.wrap = <ul>|</ul>
1.expAll = 1
1.NO = 1
1.NO.wrapItemAndSub.cObject = TEXT
1.NO.wrapItemAndSub.cObject.value = <li>|</ul></li>
1.NO.after.cObject = COA
1.NO.after.cObject {
10 = TEXT
10.value = <div class="dropdown">
20 = CONTENT
20 {
table = tt_content
select {
....
but I cannot figure out what is required here to get the content of the pages.
Does someone can help me with this issue?
Thanks in advance.
Regards
Joël
I'll try a solution here, hoping that I'm not simplifying too much your code,at least you could take it as a starting point:
menu.nav = HMENU
menu.nav {
special = directory
special.value = 214
1 = TMENU
1.wrap = <ul>|</ul>
1.NO {
wrapItemAndSub = <li>|</li>
after.cObject = CONTENT
after.cObject {
table = tt_content
select {
pidInList.field = uid
where = {#colPos} = 0
}
renderObj = < tt_content
wrap = <div class="dropdown">|</div>
}
}
}
I took this one as starting point.
I had a similar problem sometime ago, came upwith this code to make a menu containing database information.
It is not an answer, but it is a similar piece of code. Hopefully it gives you an idea.
It generates a list of links to pages which have "no_search" = 0 or another condition. There is also a database join made to get the pagepath or url of pages in the site.
Think you can do the same thing with your page content, output it as html.
lib.sitemap = CONTENT
lib.sitemap {
table = pages
select {
orderBy = pages.sorting
selectFields = pages.uid, pages.title, tx_realurl_pathcache.pagepath
join = tx_realurl_pathcache ON tx_realurl_pathcache.page_id=pages.uid
pidInList = 44
recursive = 7
where = (no_search="0") or (nav_hide=1 and no_search=0)
groupBy = tx_realurl_pathcache.page_id
}
renderObj = COA
renderObj.wrap = <li>|</li>
renderObj.10 = TEXT
renderObj.10 {
field = pagepath
wrap = <a href="|">
}
renderObj.20 = TEXT
renderObj.20.field = title
renderObj.30 = TEXT
renderObj.30.value = </a>
}
lib.sitemap.wrap = <ul> | </ul>
You have to do this
lib.navbar2 = COA
lib.navbar2.wrap = <nav>|</nav>
lib.navbar2 {
20 = HMENU
20.wrap = <ul>|</ul>
20 {
#entryLevel = 0
#excludeUidList = 11,12
1 = TMENU
1 {
wrap = |
expAll = 1
NO = 1
NO.allWrap >
NO.wrapItemAndSub = <li>|</li>
NO.after.cObject = COA
NO.after.cObject{
stdWrap.wrap = <div class="megamenu-wrapper">|</div>
20 = CONTENT
20 {
table = tt_content
select {
pidInList.field = uid
orderBy = sorting
where = colPos=4
languageField=sys_language_uid
}
}
20.wrap = |
}
ACT = 1
ACT < .NO
ACT.wrapItemAndSub = <li class="active">|</li>
CUR = 1
CUR < .NO
CUR.wrapItemAndSub = <li class="active">|</li>
}
}
}

TYPO3 loading object based on current front end language

I'm running a Typo3 v9.5.4 Onepager style Website. The content is loaded directly from the tt_content. The Website has two FE languages (German/English).
I have a CTA button which has an anchorlink. The button is create with typoscript. I created one button for the German version and one for the English verson bc they have another value and another ancorlink.
I'm not sure if I can access a tt_content field directly from a fluid viewhelper. This is my code i've tried
<f:if condition="{tt_content.sys_language_uid} == 1">
<f:then>
<f:format.raw>{buttonEn}</f:format.raw>
</f:then>
<f:else>
<f:format.raw>{buttonDe}</f:format.raw>
</f:else>
</f:if>
This is my Typoscript for the two button Objects
lib.buttonDe = TEXT
lib.buttonDe {
value = German Text
stdWrap.typolink.parameter = #anchorlinkDE
stdWrap.typolink.ATagParams = class="button"
}
lib.buttonEn = TEXT
lib.buttonEn {
value = English Text
stdWrap.typolink.parameter = #anchorlinkEN
stdWrap.typolink.ATagParams = class="button"
}
And this is the typoscript that loads the Content, the Languages Menu and the Fluidtemplate (the Onepager Content is loaded without a Fluidtemplate, it loads the content directly from tt_content):
//--------------------- One Pager Content
lib.sectionContent = HMENU
lib.sectionContent {
excludeUidList = 12,13,16,17,29
1 = TMENU
1 {
NO = 1
NO {
doNotLinkIt = 1
stdWrap >
stdWrap {
cObject = COA
cObject {
if.value = 4
if.equals.field = doktype
if.negate = 1
10 < temp.titleSectionId
10.wrap = <section id="|">
20 = CONTENT
20 {
table = tt_content
select {
pidInList.field = uid
orderBy = colPos,sorting
# Only selects Content where CE Layout is 0
where = (tt_content.layout = "0")
}
wrap = <div class="container">|</div>
renderObj < tt_content
}
30 = TEXT
30 {
wrap = </section>
}
}
}
}
}
}
//---------------------
// Language Selector
lib.langmenu = HMENU
lib.langmenu {
special = language
addQueryString = 1
special.value = {$config.language.uids}
1 = TMENU
1 {
wrap = <ul class="dg-langmenu row">|</ul>
NO = 1
NO {
stdWrap.current = 1
stdWrap.setCurrent = {$config.language.labels}
allWrap = <li class="col s6">|</li>
}
ACT < .NO
ACT.doNotLinkIt = 1
ACT.allWrap = <li class="act col s6">|</li>
}
}
page = PAGE
page{
10 = FLUIDTEMPLATE
10 {
templateName = TEXT
templateName.stdWrap{
cObject = TEXT
cObject{
data = levelfield:-2,backend_layout_next_level,slide
override.field = backend_layout
split {
token = pagets__
1.current = 1
1.wrap = |
}
}
ifEmpty = onePager
}
templateRootPaths {
10 = {$path.privat}Templates/
}
layoutRootPaths {
10 = {$path.privat}Layouts/
}
partialRootPaths {
10 = {$path.privat}Partials/
}
variables{
buttonDe < lib.buttonDe
buttonEnd< lib.buttonEn
}
}
So I'd like to load the buttonEn if the content has the sys_language_uid 1 (English) else I want it to load the buttonDe.
Do I need to create an Typoscript Object and then load this Object into the f:if viewhelper? If so how do I create this Typoscript Object.
Thanks for your help!
The easy way (pure typoscript)
lib.button = TEXT
lib.button {
value = English text
lang.de = Deutscher Text
stdWrap.typolink.parameter = #anchorlinkDE
stdWrap.typolink.ATagParams = class="button"
}
[siteLanguage("locale") == "en_EN.UTF-8"]
lib.buton.stdWrap.typolink.parameter = #anchorlinkEN
[global]
but the professional solution is configuring your labels in a language file (see answer from Thomas Löffler) and use:
lib.button = TEXT
lib.button {
lib.button.data = LLL:EXT:site_extension/Resources/Private/Language/locallang.xlf:button_label
stdWrap.typolink.parameter = #anchorlinkEN
stdWrap.typolink.ATagParams = class="button"
}
[siteLanguage("locale") == "de_DE.UTF-8"]
lib.buton.stdWrap.typolink.parameter = #anchorlinkDE
[global]
For language dependent constant data you might use typoscript conditions to redefine a value for your non default languages. (or define a fallback and conditions for each language.)
You should use a locallang file and refer to it in TypoScript.
Create a locallang file (copy an existing and remove all values) named locallang.xlf
Add your english label in there
Create a locallang file in the same folder with prepending de. in the filename (de.locallang.xlf) and add the german label
Refer to it in the TypoScript by using lib.button.data = LLL:EXT:your_ext/path/to/locallang/locallang.xlf:buttonLabel, see https://docs.typo3.org/typo3cms/TyposcriptReference/DataTypes/Index.html#lll
This TS getText function gets the label depending on the set language ID automatically and you only need one TS for the button.
Example: https://docs.typo3.org/typo3cms/TyposcriptIn45MinutesTutorial/UsingGetText/Index.html

TYPO3 Menu Double up

I have this custom menu setup based on the default section menu. When testing on one content element, it looks good... When I add a second content element to the page both get added to each menu item.
Anyone know what's going on here?
tt_content.menu.20.3.1.sectionIndex.useColPos = -1
tt_content.menu.20.101 < tt_content.menu.20.3
tt_content.menu.20.101 {
1.NO {
stdWrap.cObject = CONTENT
stdWrap.cObject {
table = tt_content
select {
pidInList.field = uid
}
renderObj = COA
renderObj {
10 = FILES
10 {
stdWrap.wrap = <div class="menu-img">|</div>
references {
table = tt_content
fieldName = image
}
renderObj = IMAGE
renderObj {
file {
import.data = file:current:uid
treatIdAsReference = 1
width = 100c
height = 100c
}
altText.data = file:current:alternative
titleText.data = file:current:title
stdWrap.typolink.parameter.data = file:current:link
}
maxItems = 1
}
20 = TEXT
20.field = header
30 = TEXT
30.field = rowDescription
}
}
}
}
This is currently outputting:
<ul>
<li><img/>Heading1Desc1<img2/>Heading2Desc2</li>
<li><img/>Heading1Desc1<img2/>Heading2Desc2</li>
<ul>
What it should be:
<ul>
<li><img/>Heading1Desc1</li>
<li><img2/>Heading2Desc2</li>
</ul>
It is about your CONTENT object.
your selection is strange:
select {
pidInList.field = uid
}
you select all tt_content elements which are in the page with the uid of the current content element.
And your rendering is executed for each record found.
Do you really need to select the contentelement with a cObject again? I think in the menu it should be the current context.
add on:
I would try something like this to render the image before the text (which should be available by default):
before just for the image instead of stdWrap with a full query of all CEs and with a COA for all fields.
have a look to the correct fieldname!
1.NO {
before.cObject = FILES
before.cObject {
stdWrap.wrap = <div class="pic">|</div>
references {
table = tt_content
uid.data = uid
// 'image' or 'media' or ... ???
fieldName = image
}
renderObj = IMAGE
renderObj {
stdWrap.wrap = <div class="pic">|</div>
file {
import.data = file:current:uid
treatIdAsReference = 1
width = 150c
height = 150c
}
altText.data = file:current:alternative
titleText.data = file:current:title
#params = class="menu-img"
// don't do a link inside a link =:-O
#stdWrap.typolink.parameter.data = file:current:link
}
maxItems = 1
}
}
I have tried this many different ways and cannot get it working with the image and fields. So instead I have simply patched my original code using by adding: tt_content.menu.20.101.maxItems = 1 and adding a wrap to the renderObj.
I know this is not how it should be done, but it works for now. But if anyone knows the correct way of doing it let me know!

How to set limit & Order in TYPO3 HMENU

In below TYPO3 script code get pages list from others menu item
I want to set order by latest pages with a limit parameter(limit=5)
special directory include submenu entries and display it at home page
[page|uid = 1]
lib.content_6.stdWrap.preCObject = HMENU
lib.content_6.stdWrap.preCObject {
1 = TMENU
wrap = <div class="wpContentElement wpReferenceList"><ul>|</ul></div>
special = directory
special.value = 94,95,97,378,445
includeNotInMenu = 1
special.range = 1|-2
1 {
NO.wrapItemAndSub = <li class="col-xs-12 col-sm-6 col-lg-3 col-xl-3">|</li>
NO.stdWrap.cObject = COA
NO.stdWrap.cObject {
10 = TEXT
10 {
field = title
wrap = <div>|</div>
}
20 = FILES
20 {
references {
table = pages
uid.field = uid
fieldName = tx_mask_referenceimage
}
renderObj = IMAGE
renderObj {
file.import.data = file:current:uid
file.treatIdAsReference = 1
file.height = 850c
file.width = 850c
}
}
}
}
}
[end]
Maximum can be done with maxItems, but there is no option for your own ordering. You might be able to abuse additionalWhere.
A cleaner solution would be to implement an own itemArrayProcFunc.
1 = TMENU
1 {
maxItems = 5
// additionalWhere = ORDER BY tstamp desc
itemArrayProcFunc = user_menuItemArrayProcFunc->process
}

Add image to menu/sitemap element in TYPO3

I am using TYPO3 4.7 (Upgrading is not an option). Can I customize the Menu/Sitemap element to include the first image on each linked page?
So In this case I'd be using:
tt_content.menu.20.1.1.NO
First of all you really should update the site as there are a lot security issues which can do harm to your/your customer's website.
Back to your question: Of course you can render any content inside a menu as well!
lib.menu = HMENU
lib.menu {
wrap = <ul>|</ul>
1 = TMENU
1.NO {
wrapItemAndSub = <li>|</li>
after.cObject = CONTENT
after.cObject {
table = tt_content
select {
pidInList.field = uid
}
renderObj = COA
renderObj {
10 = TEXT
10.field = header
10.htmlSpecialChars = 1
20 = TEXT
20 {
field = image
split {
token = ,
cObjNum = 1
1 {
10 = IMAGE
10 {
file {
import=uploads/pics/
import.current = 1
width = 170
height = 100
}
}
}
}
}
}
}
}
}
tt_content.menu.20.1.1.NO < lib.menu.1.NO
To be honest: the part with the image is untested as I don't have any non-FAL (since 6.0) installation anymore where I could test it.