TYPO3 CKEditor RTE配置

Question

我刚刚从 TYPO3 8.5.1 to TYPO3 8.7.7 更新了我的网站，看起来这个版本添加了一个名为 'CkEditor Rich Text Editor' 的新 RTE（扩展密钥 rte_ckeditor）。我需要配置编辑器以允许后端用户向那里的文本添加样式，例如添加带有类的段落或类似的东西。

我找到了这个教程，它解释了如何做到这一点：

https://typo3worx.eu/2017/02/configure-ckeditor-in-typo3/。

我首先尝试用这一行更改编辑器的默认预设： RTE.default.preset = full 在我的一个页面的 Page TS Config 上，但我没有看到任何差异。看来我的分机不想被配置。

然后，我尝试创建自己的预设以添加自己的类等... 据我了解，我有两个选择：

为此创建一个扩展程序
使用现有的扩展来插入我的 Yaml 文件

我尝试了第二个选项，但是当我在 Page TS Config...

中更改预设时，它仍然没有任何改变

有谁知道为什么会这样以及如何解决？

欢迎提出任何建议。

我正在使用 CKEditor 扩展 8.7.7.

Answer 1

首先想到的是缓存，我发现了这个问题及其解决方案：Adding a textstyle in the new RTE editor (TYPO3 8.7.1)

Answer 2

在您自己的分机中：

加入ext_localconf.php

$GLOBALS['TYPO3_CONF_VARS']['RTE']['Presets']['[your_ext_key]'] = 'EXT:[your_ext_key]/Configuration/Yaml/rte_ckeditor/Custom.yaml';

在此文件夹中添加一个文件：Custom.yaml

我们在Custom.yaml中有如下配置：

# Load default processing options
imports:
- { resource: "EXT:rte_ckeditor/Configuration/RTE/Processing.yaml" }
- { resource: "EXT:rte_ckeditor/Configuration/RTE/Editor/Base.yaml" }
- { resource: "EXT:rte_ckeditor/Configuration/RTE/Editor/Plugins.yaml" }

# Add configuration for the editor
# For complete documentation see http://docs.ckeditor.com/#!/api/CKEDITOR.config
editor:
  config:
    # enable spellchecker
    defaultContentLanguage: "de"
    defaultLanguage: "de"
    contentsLanguage: "de"
    language: "de"
    scayt_autoStartup: true
    scayt_sLang: "de_DE"
    wsc_lang: "de_DE"
    # can be "default", but a custom stylesSet can be defined here, which fits TYPO3 best.
    contentsCss: "EXT:[your_ext_key]/Resources/Public/Css/Extensions/rte_ckeditor/ckeditor.min.css"
    height: "500px"
    resize_enabled: true
    uiColor: "#EEEEEE"
    #toolbarCanCollapse: true
    # Samples for configuration
    stylesSet:
    # block level styles
    #- { name: "Beispiel H2", element: "h2", styles: { color: "orange", background: "blue" } }
    - { name: "Button (primary)", element: "a", attributes: { class: "btn btn-primary" } }
    - { name: "Link mit Pfeil", element: "a", attributes: { class: "linkpfeil" } }
    - { name: "PDF-Download", element: "a", attributes: { class: "download-pdf" } }

    # Inline styles
    #- { name: "Icon: Telefon", element: "span", styles: { color: "telefon" } }

    format_tags: "p;h1;h2;h3;h4;h5;pre"

    toolbarGroups:
      - { name: document,  groups: [ mode ] }
      - { name: clipboard, groups: [ clipboard, undo ] }
      - { name: editing,   groups: [ spellchecker ] }
      - { name: insert }
      - { name: tools }
      - { name: others }
      - "/"
      - { name: styles }
      - { name: basicstyles, groups: [ basicstyles, align, cleanup ] }
      - { name: paragraph,   groups: [ list, indent, align, blocks ] }
      - { name: links }

    justifyClasses:
      - align-left
      - align-center
      - align-right
      - align-justify

    extraPlugins:
      - justify

    removePlugins:
      - image

    removeButtons:
      - Anchor
      - Underline
      - JustifyBlock
      - Table

# Allow s and u tag
processing:
  allowTags:
    - s

在文件中： Configuration/TSConfig/Page/RTE.tsconfig

RTE.default.preset = [your_ext_key]

TYPO3 CKEditor RTE配置

TYPO3 CKEditor RTE configuration

php

yaml

typo3

ckeditor

typo3-extensions