RedactorからCKEditorにコンバートしてみた
アップデートがあります
えっ!?
CKEditorってなんやろか
本家P&Tの公式プラグインだそう。
それなら今後はこちらで全然大丈夫そうですね。
なんと!コンバータがあるようです。
やってみましょう
デフォルトでやっても分からなそうなので
シンプルな例ですがこのカスタム定義でやってみます。
{
"buttons": [
"formatting",
"bold",
"underline",
"unorderedlist",
"link"
],
"minHeight": "300px",
"formatting" :["p","h2", "h3", "h4", "h5"],
"linkNewTab": true,
"toolbarFixed": true
}
インストール
環境はlocalに展開しているddevのCraft4です。
そう言えばCraft5になってからSuperTableってどう差別化されるのかなぁ...。
CLIでLet's コンバート
コマンドはこちら
ホスト側で実行してエラー起こして????になってた、ちゃんとコンテナに入りましょう。
#コンテナに接続
@shin_develop ddev ssh
@craft php craft ckeditor/convert
こういう感じで対話形式で進めていくみたい。
Xdebug: [Step Debug] Could not connect to debugging client. Tried: host.docker.internal:9003 (fallback through xdebug.client_host/xdebug.client_port).
→ Looking for Redactor fields in the project config … ✓
5 Redactor fields found:
- matrixBlockTypes.7ba9d65a-75c6-40db-bb96-7ac805c244cb.fields.d5691967-3482-42b8-94ab-95f3f8045718 (child_text)
- matrixBlockTypes.06849e64-bc29-4c0e-a2e5-9ede91f35808.fields.a388a71b-8b64-44b6-9409-d5c2fb96d1c4 (child_text)
- superTableBlockTypes.0aebc583-58bc-4373-a5b4-c026cf0f049b.fields.912415eb-f90e-427b-8fc2-7346bb91194b (item)
- superTableBlockTypes.8f59c768-1db0-4de5-a91a-52bf99c37b04.fields.0db9a590-8b0d-43a6-ada1-b655a58a1647 (item)
- superTableBlockTypes.bf8335d0-3d2d-4d8b-8b75-1a93324fc911.fields.7636eee9-6205-4a4a-b6ee-f75d7d716374 (item)
→ Converting matrixBlockTypes.7ba9d65a-75c6-40db-bb96-7ac805c244cb.fields.d5691967-3482-42b8-94ab-95f3f8045718 (child_text) …
Do you already have a CKEditor config that should be used in place of the blog Redactor config? (yes|no) [no]:
別フィールドの話(blog.json)っぽいが
CKEditor用のconfigファイルはあるのかい?ってことで
ひとまず no を突きつけてみる。
→ Generating Blog CKEditor config …
️ The following Redactor config items aren’t supported by CKEditor:
- formatting:
- div
- linkNewTab: true
Continue anyway? (yes|no) [yes]:
この定義方法はCKには対応してませんって話らしいのでそれでもいいよって感じで yes。
ていうかformatting:div
ってそもそもRedactorでも対応してたっけな。
topicsフィールドも同様にCKEditorのconfigは無いので no
Do you already have a CKEditor config that should be used in place of the topics Redactor config? (yes|no) [no]:
同じくサポートしてない設定云々。
新しいタブで開くやつ。
The following Redactor config items aren’t supported by CKEditor:
- linkNewTab: true
これちょうどtinybeansさんが記事にしてたのでこちらを参照いただけると。
変換完了
新たにproject/ckeditor/configs/*.yaml
が生成されてた。
Redactorで言うところのconfig/redactor/*.json
に対応してる...のか?
直接定義をイジる必要はなくなってて、管理画面で編集出来るようになってる模様。
headingLevels:
- 2
- 3
- 4
- 5
name: Topics
options:
code:
indentSequence: ' '
toolbar:
- heading
- '|'
- bold
- underline
- bulletedList
- link
pタグの定義消えてるけどまぁええか
管理画面確認
フィールド定義
CKEditorに変わってる〜
CKEditor Config??
は、ここで指定されていると思われる。
(pタグの定義消えたって書いたがデフォルトがparagraphなんで問題なさそうだった)
前述のproject構成ファイルはここで作られるようなので、原始的にjsonを編集する必要はないみたい。
入力画面
UIに微妙な変化はあるものの機能的には問題なし
いけるやん!
とは言え複雑にカスタムしてる場合についてはもう少し検証の余地がありそう。
おわり
Discussion