Question

我试图添加一个字段来为所有TYPO3 CE添加自定义类（即Bootstrap类）。

该字段显示在BE CE中，我能够写入f.e. col-md-6在这个领域。 DB有一个名为bootstrap_css的字段，其中存储了值。

但我不知道如何在FE中使用该自定义类来包装CE：

示例：在BE字段中添加col-md-6应该会产生如下内容：

<div class="col-md-6">
    <div class="csc-default">
        ....
    </div>
</div>

任何想法？

Answer 1

课程的免费输入通常被认为是不良做法（ - ＆gt;关注点分离）。

对于这种情况，我使用经典的＆＃39; header_layout＆＃39;方法，基于www.typo3wizard.com/en/snippets/cool-stuff-typoscript/using-the-layout-field-in-tt-content-and-pages.html

这非常有效，编辑可以选择您提供的任何价值。这是一种解决方法，但它已经使用了很长时间。 header_layout框已被使用，因为它在编辑器的方便位置。最初，它的设计目的是为元素选择一个布局。

页面TSConfig中的

：

TCEFORM.tt_content {
      // Layout-Selector
      header_layout.altLabels.0 = Normal
      header_layout.altLabels.1 = Kasten
      header_layout.altLabels.2 = Bilder 1/2
      header_layout.altLabels.3 = Bilder 1/3
      header_layout.altLabels.4 = Dokumente 1/2 (mit Rand)
      header_layout.altLabels.5 = Dokumente 1/3 (mit Rand)

       // everything higher than 5 goes here

       header_layout.addItems {
            // 6 =  Box für wichtige Daten
            // 7 =  Box für Kosten
            // 8 =  Box für Arbeiten / Literatur
       }

       //  Remove items if less than 5
       // 100 is "hidden"
       header_layout.removeItems = 100

    }

然后在第TS页：假设我们想要包装text和textpic元素：

tt_content.text.stdWrap.outerWrap.cObject=CASE
tt_content.text.stdWrap.outerWrap.cObject=CASE
tt_content.text.stdWrap.outerWrap.cObject{
    key.field = header_layout
    default=TEXT
    default.value=|
    1=TEXT
    1.value=<aside class="kasten halfimg clearfix">|</aside>
    2=TEXT
    2.value=<div class="halfimg clearfix">|</div>
    3=TEXT
    3.value=<div class="thirdimg clearfix">|</div>
    4=TEXT
    4.value=<div class="halfimg-border clearfix">|</div>
    5=TEXT
    5.value=<div class="thirdimg-border clearfix">|</div>
}   

tt_content.textpic.stdWrap.outerWrap.cObject=CASE
tt_content.textpic.stdWrap.outerWrap.cObject{
    key.field = header_layout
    default=TEXT
    default.value=|
    1=TEXT
    1.value=<aside class="kasten halfimg clearfix">|</aside>
    2=TEXT
    2.value=<div class="halfimg clearfix">|</div>
    3=TEXT
    3.value=<div class="thirdimg clearfix">|</div>
    4=TEXT
    4.value=<div class="halfimg-border clearfix">|</div>
    5=TEXT
    5.value=<div class="thirdimg-border clearfix">|</div>
}

基本上，你可以点击css_styled_content的渲染，并告诉它根据header_layout中设置的内容包装该内容元素。

在TYPO3 CE中为自定义类添加字段

1 个答案: