通过流体包裹内容元素

R. *_*udu 1 typo3 fluid fluid-layout

我正在试验TYPO3和Fluid,此刻我遇到了麻烦.这是backendlayout我在TYPO3中创建的.

它由两个内容区域组成:" 左列 "和" 右列 ".

通过流体将它们带到前端外观是没有问题的.但后来我在"左栏"中创建了四个内容元素(文本和图像).我想用引导程序包装器包装每个内容元素,例如文本"col-md-8"img "col-md-4".

不幸的是,我没有找到任何提示或文档如何做到这一点.也许有人可以帮我解决这个问题并告诉我如何自定义我的内容元素的包装器.是否有可能通过Fluid完成?

bie*_*ior 5

后端布局用于将列映射到模板,但它们不允许您决定如何显示每个列.有几种解决方案......但上次我最喜欢的是扩展网格元素.

它允许你创建子容器的内容元素,这样你就可以添加,引导的网格布局(即任意组合2 columns - 4-83 columns - 3-3-3等...),然后把它包白衣自举类.

提到的2 columns - 4-8网格元素记录的示例 :

标题: 2 columns: 4-8或任何你想要的;)

别名:( 2_columns_4_8必须是唯一的)

网格配置:

backend_layout {
    colCount = 2
    rowCount = 1
    rows {
        1 {
            columns {
                1 {
                    name = Left
                    colPos = 221
                }
                2 {
                    name = Right
                    colPos = 222
                }
            }
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

最后在你的TypoScript模板中添加渲染定义,如下所示:

tt_content.gridelements_pi1.20.10.setup {
    2_columns_4_8 < .default
    2_columns_4_8 {
        wrap = <div class="row">|</div>
        columns {
            221 < .default
            221.wrap = <div class="col-sm-4">|</div>

            222 < .default
            222.wrap = <div class="col-sm-8">|</div>
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

(在示例中观察TypoScript中稍后使用的别名colPos值的位置和方式)

提示:不要在开始时浪费时间创建任何可能的列组合,而是在需要时创建一个ad hoc,通常只需要少数几个.

PS TYPO3总是写成大写!