Typo3 Fluid 忽略打字稿中设置的最大图像尺寸
Typo3 Fluid ignoring max image sizes set in typoscript
我在常量中设置了
styles.content.textmedia.maxW = 400
styles.content.textmedia.maxWInText = 400
styles.content.imgtext.maxW = 800
并尝试了一个简单的
<f:image src="..."></f:image>
在没有任何参数的情况下,在前端,图像仍然以其原始宽度呈现,忽略了我的 maxW 常量
最初的问题是为网格元素中的每一列设置不同的 maxW,这对流体含量也不起作用。所以我试图将其分解为最简单的 maxW 设置,但即使那样也不起作用。
如果我使用 Text & Image contentelement,它会按预期工作,所以我假设系统运行正常但出于任何原因流体图像忽略了设置?!
我有什么地方做错了,或者缺少什么设置了 f:image 的 maxW?我不能直接在 f:image 中设置 maxW,因为它可能位于不同大小的不同列中,所以我必须将它设置在 f:image 标签之外。
更新:
主要目标是能够使用 gridelements 作为 gridengine 并使用 dce 创建内容元素,而元素应该知道列宽,它们位于正确缩放图像中。
在 Mikel Wohlschlegel 的帮助下,我得到了缺失的提示,以解决我的问题。
简答:
图像查看助手不会自动应用常量中定义的任何尺寸。 f:image 是 ext:fluid 的一部分,您设置的常量是 ext:fluid_styled_content 的一部分。如果你想设置一个图像 viewhelper 总是需要一个宽度或一个 maxWidth 参数。您需要将常量传递给前端。
长答案:
你可以看到,它是如何在流体中完成的_styled_content:
查看:typo3/sysext/fluid_styled_content/Configuration/TypoScript/ContentElement/Image.typoscript
DataProcessor 将此常量传递给 GalleryProcessor
tt_content.image {
templateName = Image
dataProcessing {
20 = TYPO3\CMS\Frontend\DataProcessing\GalleryProcessor
20 {
maxGalleryWidth = {$styles.content.textmedia.maxW}
maxGalleryWidthInText = {$styles.content.textmedia.maxWInText}
}
}
并作为 {column.dimensions} 传递到前端
参见 typo3/sysext/fluid_styled_content/Resources/Private/Partials/Media/Gallery。html
<f:render partial="Media/Type" arguments="{file: column.media, dimensions: column.dimensions, data: data, settings: settings}" />
to 最终在 typo3/sysext/fluid_styled_content/Resources/Private/Partials/Media/Rendering/Image.html
中用作宽度参数
<f:media class="image-embed-item" file="{file}" width="{dimensions.width}" height="{dimensions.height}" alt="{file.alternative}" title="{file.title}" />
解法:
gridelements 配置
tt_content.gridelements_pi1.20.10.setup {
default < lib.gridelements.defaultGridSetup
default {
columns {
default {
renderObj = COA
renderObj {
10 = LOAD_REGISTER
10.padding1.cObject = TEXT
10.padding1.cObject.data = field:parentgrid_flexform_padding1
10.padding2.cObject = TEXT
10.padding2.cObject.data = field:parentgrid_flexform_padding2
10.padding3.cObject = TEXT
10.padding3.cObject.data = field:parentgrid_flexform_padding3
10.colMaxWidth.cObject = CASE
10.colMaxWidth.cObject {
key.data = field:parentgrid_flexform_grid
default = TEXT
default.value = 1224
default.prioriCalc = 1
}
20.image.dataProcessing.20.maxGalleryWidth.data = register:colWidth
20.image.dataProcessing.20.maxGalleryWidthInText.data = register:colWidth
30 = RESTORE_REGISTER
}
}
}
}
3 < .default
3 {
cObject = FLUIDTEMPLATE
cObject {
file = templates/gridelements/html/3columns.html
}
columns {
default.renderObj.10.colMaxWidth.cObject {
default.value = 1224/100*33
grid-20 = TEXT
grid-20.value = 1224/100*20
grid-20.prioriCalc = 1
grid-25 = TEXT
grid-25.value = 1224/100*25
grid-25.prioriCalc = 1
grid-32 = TEXT
grid-32.value = 1224/100*32
grid-32.prioriCalc = 1
}
0 < .default
0.renderObj.10.colWidth.cObject = TEXT
0.renderObj.10.colWidth.cObject {
data = register:colMaxWidth
stdWrap.dataWrap = | - {register:padding1} - {register:padding1}
prioriCalc = 1
}
1 < .default
1.renderObj.10.colWidth.cObject = TEXT
1.renderObj.10.colWidth.cObject {
data = register:colMaxWidth
stdWrap.dataWrap = | - {register:padding2} - {register:padding2}
prioriCalc = 1
}
2 < .default
2.renderObj.10.colWidth.cObject = TEXT
2.renderObj.10.colWidth.cObject {
data = register:colMaxWidth
stdWrap.dataWrap = | - {register:padding3} - {register:padding3}
prioriCalc = 1
}
}
}
dce 流体比我可以使用
{namespace vhs=FluidTYPO3\Vhs\ViewHelpers}
{vhs:variable.register.get(name: 'colWidth')}
访问此寄存器值。
我在常量中设置了
styles.content.textmedia.maxW = 400
styles.content.textmedia.maxWInText = 400
styles.content.imgtext.maxW = 800
并尝试了一个简单的
<f:image src="..."></f:image>
在没有任何参数的情况下,在前端,图像仍然以其原始宽度呈现,忽略了我的 maxW 常量
最初的问题是为网格元素中的每一列设置不同的 maxW,这对流体含量也不起作用。所以我试图将其分解为最简单的 maxW 设置,但即使那样也不起作用。
如果我使用 Text & Image contentelement,它会按预期工作,所以我假设系统运行正常但出于任何原因流体图像忽略了设置?!
我有什么地方做错了,或者缺少什么设置了 f:image 的 maxW?我不能直接在 f:image 中设置 maxW,因为它可能位于不同大小的不同列中,所以我必须将它设置在 f:image 标签之外。
更新: 主要目标是能够使用 gridelements 作为 gridengine 并使用 dce 创建内容元素,而元素应该知道列宽,它们位于正确缩放图像中。
在 Mikel Wohlschlegel 的帮助下,我得到了缺失的提示,以解决我的问题。
简答:
图像查看助手不会自动应用常量中定义的任何尺寸。 f:image 是 ext:fluid 的一部分,您设置的常量是 ext:fluid_styled_content 的一部分。如果你想设置一个图像 viewhelper 总是需要一个宽度或一个 maxWidth 参数。您需要将常量传递给前端。
长答案:
你可以看到,它是如何在流体中完成的_styled_content:
查看:typo3/sysext/fluid_styled_content/Configuration/TypoScript/ContentElement/Image.typoscript DataProcessor 将此常量传递给 GalleryProcessor
tt_content.image {
templateName = Image
dataProcessing {
20 = TYPO3\CMS\Frontend\DataProcessing\GalleryProcessor
20 {
maxGalleryWidth = {$styles.content.textmedia.maxW}
maxGalleryWidthInText = {$styles.content.textmedia.maxWInText}
}
}
并作为 {column.dimensions} 传递到前端 参见 typo3/sysext/fluid_styled_content/Resources/Private/Partials/Media/Gallery。html
<f:render partial="Media/Type" arguments="{file: column.media, dimensions: column.dimensions, data: data, settings: settings}" />
to 最终在 typo3/sysext/fluid_styled_content/Resources/Private/Partials/Media/Rendering/Image.html
中用作宽度参数<f:media class="image-embed-item" file="{file}" width="{dimensions.width}" height="{dimensions.height}" alt="{file.alternative}" title="{file.title}" />
解法:
gridelements 配置
tt_content.gridelements_pi1.20.10.setup {
default < lib.gridelements.defaultGridSetup
default {
columns {
default {
renderObj = COA
renderObj {
10 = LOAD_REGISTER
10.padding1.cObject = TEXT
10.padding1.cObject.data = field:parentgrid_flexform_padding1
10.padding2.cObject = TEXT
10.padding2.cObject.data = field:parentgrid_flexform_padding2
10.padding3.cObject = TEXT
10.padding3.cObject.data = field:parentgrid_flexform_padding3
10.colMaxWidth.cObject = CASE
10.colMaxWidth.cObject {
key.data = field:parentgrid_flexform_grid
default = TEXT
default.value = 1224
default.prioriCalc = 1
}
20.image.dataProcessing.20.maxGalleryWidth.data = register:colWidth
20.image.dataProcessing.20.maxGalleryWidthInText.data = register:colWidth
30 = RESTORE_REGISTER
}
}
}
}
3 < .default
3 {
cObject = FLUIDTEMPLATE
cObject {
file = templates/gridelements/html/3columns.html
}
columns {
default.renderObj.10.colMaxWidth.cObject {
default.value = 1224/100*33
grid-20 = TEXT
grid-20.value = 1224/100*20
grid-20.prioriCalc = 1
grid-25 = TEXT
grid-25.value = 1224/100*25
grid-25.prioriCalc = 1
grid-32 = TEXT
grid-32.value = 1224/100*32
grid-32.prioriCalc = 1
}
0 < .default
0.renderObj.10.colWidth.cObject = TEXT
0.renderObj.10.colWidth.cObject {
data = register:colMaxWidth
stdWrap.dataWrap = | - {register:padding1} - {register:padding1}
prioriCalc = 1
}
1 < .default
1.renderObj.10.colWidth.cObject = TEXT
1.renderObj.10.colWidth.cObject {
data = register:colMaxWidth
stdWrap.dataWrap = | - {register:padding2} - {register:padding2}
prioriCalc = 1
}
2 < .default
2.renderObj.10.colWidth.cObject = TEXT
2.renderObj.10.colWidth.cObject {
data = register:colMaxWidth
stdWrap.dataWrap = | - {register:padding3} - {register:padding3}
prioriCalc = 1
}
}
}
dce 流体比我可以使用
{namespace vhs=FluidTYPO3\Vhs\ViewHelpers}
{vhs:variable.register.get(name: 'colWidth')}
访问此寄存器值。