TYPO3 v12.4 Fluid_styled_content 不设置内容元素的样式

Question

我用 ddev 安装了一个 TYPO3 v12.4 项目，并添加了 2 个没有太多逻辑的扩展。我创建了一个表单并将其显示在 FE 上。这就是我在这个项目中所做的大部分事情。

我写了一个简短的 TypoScript 来显示 FE 中的内容元素，并想添加我的 CSS 和 JS。

这是脚本：

# default page content
page = PAGE

page {
    includeCSS {
        pluginsCss = EXT:theme/Resources/Public/Css/plugins.css
        styleCss = EXT:theme/Resources/Public/Css/style.css
    }
    includeJS {
        customJs = EXT:theme/Resources/Public/JavaScript/custom.js
        jqueryJs = EXT:theme/Resources/Public/JavaScript/jquery.js
        pluginsJs = EXT:theme/Resources/Public/JavaScript/plugins.js
        plugins2Js = EXT:theme/Resources/Public/JavaScript/plugins2.js
    }
}

lib.dynamicContent = COA
lib.dynamicContent {
   10 = LOAD_REGISTER
   10.colPos.cObject = TEXT
   10.colPos.cObject {
      field = colPos
      ifEmpty.cObject = TEXT
      ifEmpty.cObject {
         value.current = 1
         ifEmpty = 0
      }
   }
   20 = CONTENT
   20 {
      table = tt_content
      select {
         orderBy = sorting
         where = {#colPos}={register:colPos}
         where.insertData = 1
      }
   }
   90 = RESTORE_REGISTER
}

# append content
page.10 = FLUIDTEMPLATE
page.10 {
    templateName = Default
    templateRootPaths {
        0 = EXT:theme/Resources/Private/Templates/Page/
    }
    partialRootPaths {
        0 = EXT:theme/Resources/Private/Partials/Page/
    }
    layoutRootPaths {
        0 = EXT:theme/Resources/Private/Layouts/Page/
    }

    dataProcessing {
        10 = TYPO3\CMS\Frontend\DataProcessing\DatabaseQueryProcessor
        10 {
            table = tt_content
            orderBy = sorting

            as = contentElements
        }
    }
}

我在后端根模板中包含了

EXT:fluid_styled_content

和

EXT:form

：

但是内容元素看起来像这样：

导入

EXT:fluid_styled_content

和

EXT:form

的TypoScript文件，但不使用CSS。

Answer 1

有一些挑战需要考虑，在您的回答中，您是否意识到这些挑战或意识到这些挑战的程度保持开放。

您的

theme

扩展的内部结构。

扩展需要一些强制性文件，基本上是：

• ext_emconf.php
• composer.json

虽然许多文件是可选的，但结构和命名仍然是预定义的。看到你的代码，你似乎已经正确认识到了这一点

• EXT：主题/资源/私人/
• EXT：主题/资源/公共/

关于您的 TypoScript，当然可以直接在根页面的后端 TypoScript 记录中记下它，否则您必须确保它在必须包含的文件

EXT:theme/Configuration/TypoScript/setup.typoscript

中记下。通常，这就像您在 TypoScript 记录中包含的其他文件一样完成，尽管可以以不同的方式包含它，但这总是没有选择的。

假设您将其设置为可选，就像推荐的那样，那么文件中所需的代码

EXT:theme/Configuration/TCA/Overrides/sys_template,php

必须是：

<?php

defined('TYPO3') || die();

call_user_func(function() {
    /**
     * Temporary variables
     */
    $extensionKey = 'theme';

    /**
     * Default TypoScript for Theme
     */
    \TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addStaticFile(
        $extensionKey,
        'Configuration/TypoScript',
        'Theme Setup'
    );
}

定义 TypoScript 并包含后，您需要在后端 TypoScript 记录中选择模板，就像您选择的其他设置一样。由于您可能会覆盖主题中的某些设置，因此请选择该主题作为列表中的最后一个包含项。
此外，您必须提供您在 TypoScript 中引用的所有定义的目录和文件。

此外，您还必须包含一个或多个后端布局，以便获得

colPos

的不同位置。

整个文件结构，包括更多文件，在文档中进行了解释，您可以在这里找到：TYPO3 扩展的文件结构，请注意，许多文件是可选的。

通过composer安装TYPO3扩展

假设您的扩展在公共存储库中不可用，我解释了如何将其引用为“本地存储库”，请注意，它应该使用 git （在 gihub、gitlab 等上）或其他版本管理来管理解决方案，但这并不是在 TYPO3 中运行所必需的。

在 TYPO3 的安装目录中创建一个子目录

packages

并将您的

theme

扩展移入其中。

那么结构如下：

[dir]  config
[dir]  packages
[dir]  packages/theme
[dir]  public
[dir]  var
[dir]  vendor
[file] composer.json
[file] composer.lock

在文件composer.json中，您必须使主题扩展的本地存储库可用，在json结构中添加以下行：

    "repositories": {
      "sitepackage": {
        "type": "path",
        "url": "packages/*"
      }
    },

在这里您可以找到作为存储库的路径的深入解释。

此外，在主题扩展中，composer.json 文件必须包含所需的

name

，其中由供应商和扩展名组成。它在 TYPO3 文档中进行了解释，我在上面的第一章末尾链接了有关扩展名内的所有文件的内容。

因此这个命令（用您的供应商名称替换 VENDOR）应该在 TYPO3 中安装主题：

composer require VENDOR/theme:"@dev" 安装扩展后，包含主题扩展的 TypoScript 的选项应该可用，否则清除缓存...

vendor/bin/typo3 cache:flush 然后再试一次。

有很多事情可能会被误解或出错，所以如果有任何问题不起作用（或者如果我完全错误地回答了你的问题😄），欢迎详细说明你的问题。