Question

我的Typo3后端需要不同的前端布局。所以我在其中创建了新的html文件

template\Resources\Private\Layouts\Page

因此，在Default.html旁边，现在有Layout1.html和Layout2.html

之后，我尝试在setup.typoscript

中声明这些文件。

[globalVar = TSFE:page | layout=1]
page.10.template.file = FILE:EXT:template/Resources/Private/Layouts/Page/Layout1.html
[global]

[globalVar = TSFE:Page | layout=2]
page.10.template.file = FILE:EXT:template/Resources/Private/Layouts/Page/Layout2.html
[global]

当我将前端布局从默认切换到layout1或layout2时，前端中没有任何变化。

缺少什么，或者我做错了什么？

Answer 1

安全方式：

具有多个彼此相邻的Layout文件
使用后缀命名替代布局，例如MyLayoutSpecial.html替代MyLayout.html
分配一个模板变量，该变量包含要使用的Layout的“类型”，并且该变量不包含任何内容或不包含诸如Special的字符串
在模板中，使用<f:layout name="MyLayout{layoutType}" />来引用您的布局

如果您检查值始终与物理布局文件相对应，那么结果是对布局文件的安全解析。如果您未分配{layoutType}，则布局名称为MyLayout；如果分配的值为Special，则布局名称为MyLayoutSpecial。

请注意，同一模板中不能有多个f:layout，因为只能使用第一个模板。给出多个可能的布局选项的唯一方法是使name属性值动态化，例如，将简单变量作为名称的一部分。

第二个选项-模板包装和contentAs：

Fluid还允许您例如从部分模板渲染部分，但是传递一个变量，您可以使用f:render的标记内容来填充该变量。这将导致呈现的标签内容作为变量传递，然后可以包装。

将其与动态部分名称或动态部分名称结合使用（请参见上文以确保其安全性）意味着您可以引用任何类型的动态包装，而无需设置大量条件。例如：

<!-- In the template that renders the partial -->
<f:render partial="Wrap{specialWrap}" arguments="{_all}" contentAs="content">
    <div>The thing that needs to be wrapped with dynamic wrapping</div>
</f:render>

<!-- In the partial template, for example called `WrapDiv.html` -->
<div class="foo">
    <f:format.raw>{content}</f:format.raw>
</div>

Answer 2

您不应该以这种方式工作的多个方面：

更喜欢.templateName而不是.template.file
由于您可以有多个输出（.html，.xml，.json，...），因此更加灵活
layout字段默认是不继承的。
您需要为每个页面定义字段值
TS条件会导致拼写错误的多个缓存版本
后端不代表编辑者的前端布局

替代：

使用字段backend_layout和backend_layout_next_level像这样：

    templateName = TEXT
    templateName.cObject = CASE
    templateName.cObject {
        key.data = levelfield:-1, backend_layout_next_level, slide
        key.override.field = backend_layout

        #Default Template
        default = TEXT
        default.value = Default

        pagets__startpage = TEXT
        pagets__startpage.value = Startpage

        pagets__simple = TEXT
        pagets__simple.value = Simple

    }

或者您使用直接值：

templateName = TEXT
templateName {
    value = default
    override.cObject = TEXT
    override.cObject {
        data = levelfield:-1, backend_layout_next_level, slide
        override.field = backend_layout
    }
}

后端布局在页面TSconfig中定义（可从EXT:my_site_ext/Configuration/TSconfig/page.tsconfig部署）

## define backend-layouts
mod.web_layout.BackendLayouts {
    startpage {
        title = Startpage Layout
        config {
            backend_layout {
                colCount = 4
                rowCount = 4
                rows {
                     :
                }
            }
        }
    }
    simple {
        title = Simple Layout
        config {
            backend_layout {
                colCount = 2
                rowCount = 2
                rows {
                     :
                }
            }
        }
    }
    default {
        title = Default Layout
        config {
            backend_layout {
                colCount = 4
                rowCount = 3
                rows {
                     :
                }
            }
        }
    }
}

如果您希望layout字段适应通用前端模板，则需要将此信息转移到流体模板中：

variables {
    :
    layout = TEXT
    layout.field = layout
    :
}

然后，您可以考虑模板（或布局）文件中的布局：

<f:if condition="{layout} == 1">
    <then><f:render partial="header1" /></then>
    <else><f:if condition="{layout} == 2">
        <then><f:render partial="header2" /></then>
        <else><f:render partial="header0" /></else></fi>
    </else>
</fi>

，在这里您也可以立即使用该值（请确保所有部分都可用）：

<f:render partial="header{layout}" />

通常，您可以多种方式使用这两个字段，以下是一些其他用法：

打字稿：

page.10.template {
    templateName = Default

    variables {
        beLayout = TEXT
        beLayout.data = levelfield:-1, backend_layout_next_level, slide
        beLayout.override.field = backend_layout

        feLayout = TEXT
        feLayout.field = layout

        :
    }
}

1。

您使用静态模板，并且BE-和FE-layout字段是流体变量，它们决定了流体中的进一步渲染：

在Templates / Default.html中：

<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
  data-namespace-typo3-fluid="true">
<f:layout name="{beLayout}" />

<f:section name="Main">
    <f:if condition="{feLayout} == 1">
          <div class="col-visual">{content_visual->f:format.raw()}</div>
    </f:if>

    <div class="col-main">{content_main->f:format.raw()}</div>

    <f:if condition="{feLayout} == 2">
         <div class="col-infobox">{content_infobox->f:format.raw()}</div>
    </f:if>
</f:section>

2。

在Templates / Default.html中：

<f:render partial="{beLayout}" section="{feLayout}" arguments="{_all}" />

3。

在Templates / Default.html中：

Typo3 Fluid实现了不同的前端布局

2 个答案: