Inside a custom content element, I use two fields: image and media
My setup.txt looks like this:
custom_ce {
templateName = CustomCe
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
10 {
references.fieldName = media
}
20 = Vendor\Ext\DataProcessing\CustomCeProcessor
}
}
Currently I managed to process only one field. Is it possible to pass both media and image fields to the filesProcessor ?
You can call a DataProcessor more than once and you can specify the varibale the files are available in your fluid template with the as key:
custom_ce {
templateName = CustomCe
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
10 {
references.fieldName = media
as = media
}
15 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
15 {
references.fieldName = image
as = image
}
20 = Vendor\Ext\DataProcessing\CustomCeProcessor
}
}
Related
I try to get the children to the actual page.
This is my best try:
10 {
dataProcessing {
100 = TYPO3\CMS\Frontend\DataProcessing\MenuProcessor
100 {
levels = 1
entryLevel = page:level
includeSpacer = 1
includeNotInMenu = 0
as = children
expandAll = 0
}
}
}
I tried to get the menu level of the current page, but I couldn't find something in the documentation that is helping.
Do you have an idea?
My goal is to create a menu for all subpages at the next level.
Thank you for your time :-)
Adjusted solution:
10 {
dataProcessing {
100 = TYPO3\CMS\Frontend\DataProcessing\MenuProcessor
100 {
as = children
special = directory
special.value.field = pages
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
10 {
references.fieldName = media
}
}
}
props #Thomas Löffler
Danke ;-)
there is a content element in TYPO3 named "menu of subpages" which is integrated in TypoScript as well.
What I got from the core (https://github.com/TYPO3/typo3/blob/main/typo3/sysext/fluid_styled_content/Configuration/TypoScript/ContentElement/MenuSubpages.typoscript):
tt_content.menu_subpages =< lib.contentElement
tt_content.menu_subpages {
templateName = MenuSubpages
dataProcessing {
10 = menu
10 {
special = directory
special.value.field = pages
dataProcessing {
10 = files
10 {
references.fieldName = media
}
}
}
}
}
If you don't want to display any images you can remove the files part.
Beware that the example is taken from latest version. There you can replace the dataprocessor class names.
I added an image selection to a content element in my main extension with a custom extension, this field should now be added in the dataProcessing that is performed in the main extension, but it should be added in the custom extension :
tt_content.t3bs_carousel < lib.contentElement
tt_content.t3bs_carousel {
templateName = Carousel
templateRootPaths {
9 = {$plugin.tx_t3bs_main.view.templateRootPath}Content/
8 = EXT:t3bs_main/Resources/Private/Templates/Content/
}
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
10 {
references.fieldName = assets
as = assets
}
// this 20 should be added by the custom extension
20 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
20 {
references.fieldName = tx_t3bs_portrait_image
as = portrait
}
90 >
}
}
if I safe this in the main extension it works, I cannot find a typoscript that makes me add it in my custom extension, I tried to insert the entire object (since my custom extension is loaded after the main), then also only the missing part that needs to be added:
tt_content.t3bs_carousel.dataProcessing {
20 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
20 {
references.fieldName = tx_t3bs_portrait_image
as = portrait
}
}
I've created a new fluid menu element and I need it to show an image for each page. The image is stored in the page resources.
When I debug the template, each menu item shows data.media => 1 but media cannot be expanded any further. How can I get the image to render in my template?
TS:
ext_menu_image < lib.contentElement
ext_menu_image {
templateName = MenuImage
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\MenuProcessor
10 {
special = directory
special.value.field = pages
levels = 1
as = menuItems
expandAll = 1
titleField = nav_title // title
}
}
}
Template:
<f:for each="{menuItems}" as="page">
{f:uri.image(image:page.data.media.???)}
</f:for>
By default the MenuProcessor just puts the data directly from the table into the array in Fluid. The media field in the pages table, just holds the number of relations. So you need another data processor so it is translated to a file. This should do it:
ext_menu_image < lib.contentElement
ext_menu_image {
templateName = MenuImage
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\MenuProcessor
10 {
special = directory
special.value.field = pages
levels = 1
as = menuItems
expandAll = 1
titleField = nav_title // title
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
10 {
references.fieldName = media
}
}
}
}
}
I want to reach the following:
I'm creating an new content element "text media", fill out title, text and perhaps select an image. I also created categories which I select under the tab "categories".
Now I want to integrate these selected categories in the fluid template to make it work as an javascript filter.
How can I achieve this task?
Thanks!
You can use a DataProcessor to get the category data. You need to extend the TypoScript for the textmedia element.
Category example: https://git.spooner.io/spooner/just_news/blob/master/Configuration/TypoScript/RenderingDefinitions/news_list.ts#L23
DataProcessor documentation: https://docs.typo3.org/typo3cms/TyposcriptReference/ContentObjects/Fluidtemplate/Index.html#dataprocessing
Here you can see the default textmedia TS, added object 30:
# Text & Media:
# Any number of media wrapped right around a regular text element.
#
# CType: textmedia
tt_content.textmedia =< lib.contentElement
tt_content.textmedia {
templateName = Textmedia
dataProcessing {
10 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
10 {
references.fieldName = assets
}
20 = TYPO3\CMS\Frontend\DataProcessing\GalleryProcessor
20 {
maxGalleryWidth = {$styles.content.textmedia.maxW}
maxGalleryWidthInText = {$styles.content.textmedia.maxWInText}
columnSpacing = {$styles.content.textmedia.columnSpacing}
borderWidth = {$styles.content.textmedia.borderWidth}
borderPadding = {$styles.content.textmedia.borderPadding}
}
# Get categories
30 = TYPO3\CMS\Frontend\DataProcession\DatabaseQueryProcessor
30 {
put the login in...
}
}
stdWrap {
editIcons = tt_content: header [header_layout], bodytext, assets [imageorient|imagewidth|imageheight], [imagecols|imageborder], image_zoom
editIcons {
iconTitle.data = LLL:EXT:fluid_styled_content/Resources/Private/Language/FrontendEditing.xlf:editIcon.textmedia
}
}
}
this is my first submission.
I want a specific image as Background in my Typo3 Template. I want to parse the needed Image from a reference in the Page. Below Code I copied from another website and it seems correct.
lib.headerimage = IMAGE
lib.headerimage {
file {
import.data = levelmedia:-1, slide
treatIdAsReference = 1
import.listNum = 0
}}
The Problem now is, I want the lib.headerimage.FILELINK to be in my following code and I can't figure out how to use lib.VARIABLES
In a later point I parse this:
page.headerData {
10 = TEXT
10.value = div#header { background-image: url('lib.headerimage.file.value');}
10.wrap = <style type="text/css">|</style>
}
With our without $ it doesn't parse anything. I just started using typoscript 3 days ago again. My last experiences were years back.
Please , there must be an easy way to do this. :/
It looks like you search a way to concat strings. Assumed the first part is correct (As I am not familiar with the IMAGE Object) you can concat the strings like this:
page.headerData {
10 = COA
10 {
10 = TEXT
10.value = <style type="text/css">div#header { background-image: url('
20 < lib.headerimage
30 = TEXT
30.value = ');}</style>
}
}
lib.headerImageText = COA
lib.headerImageText {
10 = IMG_RESOURCE
10.file.treatIdAsReference = 1
10.file.import {
cObject = TEXT
cObject.value = dummy.gif
cObject.override {
required = 1
data = levelmedia: -1, slide
listNum = 0
}
}
}
AND
page.headerData {
10 = COA
10 {
10 = TEXT
10.value = <style type="text/css">div#header { background-image: url('
20 < lib.headerImageText
30 = TEXT
30.value = ');}</style>
}
}
Fixed my problem ;) now the div#header has the correct background-url defined in the typo3 backend.