TYPO3 自定义元素颜色选择器

Question

我是 TYPO3（第一个项目）的新手，我对使用颜色选择器创建自定义元素有一些理解问题。在这个项目中，我已经创建了一些元素，但我只使用预先确定的字段作为后端输入。对于接下来需要的元素，我需要用户选择一种颜色。我还没有找到合适的现有元素。我的设置不起作用是在TCA/Overrides/tt_content.php 文件中，看起来像这样。

$GLOBALS['TCA']['tt_content']['item_0']=array();            
$GLOBALS['TCA']['tt_content']['item_0']['label']='Color';
$GLOBALS['TCA']['tt_content']['item_0']['config']=array();
$GLOBALS['TCA']['tt_content']['item_0']['config']['type']='input';
$GLOBALS['TCA']['tt_content']['item_0']['config']['renderType']='colorpicker';
$GLOBALS['TCA']['tt_content']['item_0']['config']['size']=10;

$GLOBALS['TCA']['tt_content']['types']['wo_mitem'] = array(
    'showitem' => '--palette--;LLL:EXT:cms/locallang_ttc.xlf:palette.general;general,
        header;Title,
        subheader;Background,
        header_link;Target,
        item_0;Color,
        bodytext;Text;;richtext:rte_transform[flag=rte_enabled|mode=ts_css]
        ');

item_0 试图创建一个颜色选择器，但它似乎不起作用。我需要在不同的文件中有不同的东西吗？我添加的前几行用于定义我的字段。有一个更好的方法吗？

我的自定义扩展中的所有其他文件都可以正常工作（因为所有其他自定义元素都可以正常工作）。如前所述，唯一的区别是需要一种在新颜色中选择颜色的方法。

只是为了更清楚地查看这里的其他文件

setup.txt：

lib.contentElement {
  templateRootPaths {
    100 = EXT:wostyle/Resources/Private/Template
  }
}
tt_content {
    wo_mitem < lib.contentElement
    wo_mitem {
        templateName = MItem
    }
}

tt_content.php

\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addPlugin(
   array(
      'WO_Item (ItemBox, Text only)',
      'wo_mitem',
      'content-image'
   ),
   'CType',
   'wostyle'
);

$GLOBALS['TCA']['tt_content']['item_0']=array();            
$GLOBALS['TCA']['tt_content']['item_0']['label']='Farbe';
$GLOBALS['TCA']['tt_content']['item_0']['config']=array();
$GLOBALS['TCA']['tt_content']['item_0']['config']['type']='input';
$GLOBALS['TCA']['tt_content']['item_0']['config']['renderType']='colorpicker';
$GLOBALS['TCA']['tt_content']['item_0']['config']['size']=10;

$GLOBALS['TCA']['tt_content']['types']['wo_mitem'] = array(
            'showitem' => '--palette--;LLL:EXT:cms/locallang_ttc.xlf:palette.general;general,
            header;Bezeichnung,
            subheader;Chemische Bezeichnung,
            header_link;Zielseite,
            item_0;Farbe,
            bodytext;Text;;richtext:rte_transform[flag=rte_enabled|mode=ts_css]
            ');

typo.ts

mod.wizards.newContentElement.wizardItems.wo_extra {
   header = WO Elemente
   after = common
  elements {
    wo_mitem {
         iconIdentifier = content-image
         title = WO_Item (ItemBox, Text only)
         description = Ein Produktfeld mit Text
         tt_content_defValues {
            CType = wo_mitem
         }
      }
   }
   show := addToList(wo_mitem)
}

MItem.html

<div class="item-text">
    <f:link.typolink parameter="{data.header_link}">
        <div class="item-front">
            <f:if condition="{data.subheader}!=''">
            <f:then>
            <div class="item-bg">
                <f:format.html>{data.subheader}</f:format.html>
            </div>
            </f:then>
            </f:if>
            <div class="item-title">
                <f:format.html>{data.header}</f:format.html>
            </div>
        </div>
        <div class="item-back">
            <f:format.html>{data.bodytext}</f:format.html>
        </div>
    </f:link.typolink>
</div>
<f:debug>{data}</f:debug>

编辑：我使用typo3 8.7.8

Answer 1

我没有检查你的整个代码，但我在一个字段上有一个工作的颜色选择器...... 你已经接近了，但马上弹出一个错误是你的项目应该放在 ['columns'] ...

$GLOBALS['TCA']['tt_content']['columns']['item_0']=array();

接下来您缺少对向导的引用！ （你应该采用带有方括号的注释，它显示了更多的结构）

这应该存储在Configuration/TCA/Overrides/tt_content.php：（当你覆盖现有字段时，否则你有一个专门的元素代码）

<?php

/***************
 * Modify the tt_content TCA
 */
$tca = [
    'columns' => [
        'item_0' => [
            'label' => 'Color',
            'config' => [
                'type' => 'input',
                'size' => 10,
                'eval' => 'trim',
                'default' => '#ffffff',
                'wizards' => [
                    'colorChoice' => [
                        'type' => 'colorbox',
                        'title' => 'LLL:EXT:lang/locallang_wizards:colorpicker_title',
                        'module' => [
                            'name' => 'wizard_colorpicker'
                        ],
                        'dim' => '20x20',
                        'JSopenParams' => 'height=600,width=380,status=0,menubar=0,scrollbars=1',
                    ],
                ],
            ],
        ],
    ],
];
$GLOBALS['TCA']['tt_content'] = array_replace_recursive($GLOBALS['TCA']['tt_content'], $tca);

Answer 2

借助 webMan 和一些互联网搜索，我可以稍微采用我的代码。 我添加了文件“ext_tables.sql”的内容

CREATE TABLE tt_content (
    item_0 varchar(10) DEFAULT '' NOT NULL,
);

并将 TCA/Overrides 中的 tt_content.php 更改为：

$temporaryColumns = Array(
    "item_0" => Array(
        'label' => 'Color',
        'config' => Array(
            'type' => 'input',
            'renderType' => 'colorpicker',
            'size' => 10
        )
    )
);
\TYPO3\CMS\Core\Utility\ExtensionManagementUtility::addTCAcolumns('tt_content',$temporaryColumns);

$GLOBALS['TCA']['tt_content']['types']['wo_mitem'] = array(
            'showitem' => '--palette--;LLL:EXT:cms/locallang_ttc.xlf:palette.general;general,
            header;Bezeichnung,
            subheader;Chemische Bezeichnung,
            header_link;Zielseite,
            item_0;Farbe,
            bodytext;Text;;richtext:rte_transform[flag=rte_enabled|mode=ts_css]
            ');

与 webMans 代码相比，仍然缺少一个视图，但至少这是我拥有的第一个工作版本，所以我想我会展示它，因为我的问题得到了回答:)。