Typo3 Fluid忽略了打字稿中设置的最大图像尺寸

时间:2020-02-17 10:49:37

标签: image typo3 width fluid

我已经设置了常量

styles.content.textmedia.maxW = 400
styles.content.textmedia.maxWInText = 400
styles.content.imgtext.maxW = 800

并尝试了一个简单的

<f:image src="..."></f:image>

没有任何参数,并且在前端,图像仍然以其原始宽度呈现,而忽略了我的maxW常数

最初的问题是为网格元素中的每个列设置不同的maxW,这对于流体含量也不起作用。因此,我试图将其分解为最简单的maxW设置,甚至无法正常工作。

如果我采用“文本和图像”内容元素,则它可以按预期运行,因此我认为系统运行正常,但是由于任何原因,流畅的图像都忽略了该设置?!

是否有我做错的事情或缺少什么设置了f:image的maxW?我无法直接在f:image中设置maxW,因为它可能位于不同大小的不同列中,因此我必须将其设置在f:image标签之外。

更新: 主要目标是能够使用gridelements作为网格引擎,并使用dce创建内容元素,而这些元素应该知道列宽,它们位于适当的位置以按比例缩放图像。

在Mikel Wohlschlegel的帮助下,我得到了缺失的提示,以解决我的问题。

2 个答案:

答案 0 :(得分:0)

短响应:

图像viewhelper不会自动应用常量中定义的任何尺寸。 f:image是ext:fluid的一部分,您设置的常量是ext:fluid_styled_content的一部分。如果要设置图像viewhelper,则始终需要width或maxWidth参数。您需要将常量传递给前端。

详细答案:

您可以在Fluid_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}" />

答案 1 :(得分:0)

解决方案:

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')}

访问此寄存器值。

相关问题