簡體   English   中英

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 常量

最初的問題是為 gridelement 中的每一列設置不同的 maxW,這也不適用於流體內容。 所以我試圖把它分解成最簡單的 maxW 設置,即使這樣也行不通。

如果我采用文本和圖像內容元素,它會按預期工作,所以我假設系統運行正常,但出於任何原因,流體圖像忽略了設置?!

是不是我做錯了什么,或者是否缺少為 f:image 設置 maxW 的東西? 我不能直接在 f:image 中設置 maxW,因為它可能位於不同大小的不同列中,所以我必須將它設置在 f:image 標簽之外。

更新:主要目標是能夠使用 gridelements 作為 gridengine 並使用 dce 創建內容元素,而元素應該知道列寬,它們位於正確縮放圖像的位置。

在 Mikel Wohlschlegel 的幫助下,我得到了缺失的提示,以解決我的問題。

簡答:

圖像視圖助手不會自動應用常量中定義的任何尺寸。 f:image 是 ext:fluid 的一部分,您設置的常量是 ext:fluid_styled_content 的一部分。 如果你想設置一個,圖像視圖助手總是需要一個寬度或一個 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}" />

最終在typ3/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}" />

解決方案:

網格元素配置

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

訪問該寄存器值。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM