TYPO3:page.layout 自动换行 CASE
TYPO3: Automatic wrapping CASE by page.layout
我在页面顶部有一张大预告图片。作者可以 select 在后端确定预告片图像应该是静态的还是动画幻灯片。顺便说一句,我正在使用 bootstrap 作为幻灯片。
select离子出现在页面 > 编辑 > 外观
根页面 TSConfig:
TCEFORM.pages {
layout.altLabels.1 = Default (with Slideshow)
layout.altLabels.0 = Default
}
现在,它变得有点棘手。
要获得 Bootstrap 滑块 运行,您需要有一个外包装,并且每张幻灯片也要包装。这是我到目前为止所得到的:
page.10.variables {
teaser < styles.content.get
teaser.select.where = colPos = 0
teaser.stdWrap.required = 1
teaser.stdWrap.wrap {
cObject = CASE
cObject {
key.field = layout
default = TEXT
default.value = |
1 = TEXT
1.value = <div id="teaser" ...>|</div> ### shortened
}
}
teaser.renderObj.stdWrap.wrap {
cObject = CASE
cObject {
key.field = layout
default = TEXT
default.value = |
1 = TEXT
1.value = <div class="item">|</div>
}
}
}
第一个 teaser.stdWrap.wrap
很有魅力。选择前端布局相应地包装预告片。
但是 teaser.renderObj.stdWrap.wrap
不想工作。主要是因为我觉得CASE
的关键不在于Frontend Layout,而在于内容元素的布局。 如何更改?
第二个问题。这是包裹当前的样子(或者如果上面的 TS 能按预期工作,它们的样子):
<div class="item">
<div id="c14">
<div class="ce-textpic ce-right ce-intext">
<div class="ce-gallery" data-ce-columns="1" data-ce-images="1">
<div class="ce-row">
<div class="ce-column">
<div class="ce-media">
<img src="img.jpg" width="1150" height="632" alt="">
</div>
</div>
</div>
</div>
<div class="ce-bodytext"></div>
</div>
</div>
有没有办法让它看起来差不多像这样?
<div class="item">
<img class="slide" src="img.jpg">
</div>
客户不希望有任何标题或文字,因此可以忽略。
我是 运行 TYPO3 7.6.6 fluid_styled_content。
所以第一个问题的答案是:
您可以在 TypoScript 中使用 "getText" 数据类型。请参阅文档 here.
它有一个为当前页面记录预定义的变量。如此简单地更改第二个关键属性:
key.data = page:layout
但是如果你是运行系统fluid_styled_content,那么你可以简单的使用fluid来解决这个问题。 (在那里您可以使用 data.layout
访问布局)
回答第二个问题:
是的。有可能,您需要查看 fluid_styled_content 扩展名。在那里您可以找到很多关于模板、布局和元素的信息。你可以简单地用你的模板覆盖它们,你可以摆脱任何不需要的 div
inside.
为此,我可以向您推荐德语video。
我在页面顶部有一张大预告图片。作者可以 select 在后端确定预告片图像应该是静态的还是动画幻灯片。顺便说一句,我正在使用 bootstrap 作为幻灯片。
select离子出现在页面 > 编辑 > 外观
根页面 TSConfig:
TCEFORM.pages {
layout.altLabels.1 = Default (with Slideshow)
layout.altLabels.0 = Default
}
现在,它变得有点棘手。
要获得 Bootstrap 滑块 运行,您需要有一个外包装,并且每张幻灯片也要包装。这是我到目前为止所得到的:
page.10.variables {
teaser < styles.content.get
teaser.select.where = colPos = 0
teaser.stdWrap.required = 1
teaser.stdWrap.wrap {
cObject = CASE
cObject {
key.field = layout
default = TEXT
default.value = |
1 = TEXT
1.value = <div id="teaser" ...>|</div> ### shortened
}
}
teaser.renderObj.stdWrap.wrap {
cObject = CASE
cObject {
key.field = layout
default = TEXT
default.value = |
1 = TEXT
1.value = <div class="item">|</div>
}
}
}
第一个 teaser.stdWrap.wrap
很有魅力。选择前端布局相应地包装预告片。
但是 teaser.renderObj.stdWrap.wrap
不想工作。主要是因为我觉得CASE
的关键不在于Frontend Layout,而在于内容元素的布局。 如何更改?
第二个问题。这是包裹当前的样子(或者如果上面的 TS 能按预期工作,它们的样子):
<div class="item">
<div id="c14">
<div class="ce-textpic ce-right ce-intext">
<div class="ce-gallery" data-ce-columns="1" data-ce-images="1">
<div class="ce-row">
<div class="ce-column">
<div class="ce-media">
<img src="img.jpg" width="1150" height="632" alt="">
</div>
</div>
</div>
</div>
<div class="ce-bodytext"></div>
</div>
</div>
有没有办法让它看起来差不多像这样?
<div class="item">
<img class="slide" src="img.jpg">
</div>
客户不希望有任何标题或文字,因此可以忽略。
我是 运行 TYPO3 7.6.6 fluid_styled_content。
所以第一个问题的答案是:
您可以在 TypoScript 中使用 "getText" 数据类型。请参阅文档 here.
它有一个为当前页面记录预定义的变量。如此简单地更改第二个关键属性:
key.data = page:layout
但是如果你是运行系统fluid_styled_content,那么你可以简单的使用fluid来解决这个问题。 (在那里您可以使用 data.layout
访问布局)
回答第二个问题:
是的。有可能,您需要查看 fluid_styled_content 扩展名。在那里您可以找到很多关于模板、布局和元素的信息。你可以简单地用你的模板覆盖它们,你可以摆脱任何不需要的 div
inside.
为此,我可以向您推荐德语video。