お問い合わせ

Cocoon⇒SWELLにテーマ乗り換え トラブル事例・対処方法を解説

かなり前にCocoonで作って放置していたサイトがあり、ついに重い腰を上げてCocoon⇒SWELLにテーマを変更することにしました。

CocoonからSWELLに乗り換えた理由は、『運営サイトのほとんどがSWELLになっている』こと、さらに、『Cocoonの将来性に限界を感じている』からです。

Cocoonは無料テーマで個人開発です。今後、積極的に機能を追加する理由も無く、開発者任せになってるのが現状で、テーマの将来性を危惧したためです。

そういう点からも個人開発の無料テーマは本気で使うのは止めた方が良いです。

この記事の内容

CocoonからSWELLへのテーマ変更に気が進まないワケ

今回テーマ変更するサイトは、Cocoonがクラシックエディタのころに作ったサイトです。

全ての記事をブロックエディタに変更しようとすれば、一度記事を開いて、クラシックブロックからブロックに変換を実行して保存し直す必要があります。

記事の数が多いとそれだけで憂鬱になります。

蛍光ペンの部分など自分で作ったショートコードも結構あって、そこもケアする必要があります。

それが残っていてもいいけど、SWELLの機能に置き換えたい。でも、どこにあるのか探すのも面倒だし、手動で置き換えるのも現実的じゃない。

CocoonからSWELLへの乗り換えプラグインは便利

CocoonからSWELLに乗り換えた時に表示が崩れないように、SWELLの正規購入者向けにCocoonからSWELLへの乗り換えプラグインが用意されています。

購入者にのみダウンロードできるプラグインですので、SWELLを非正規ルートで入手している場合、入手しようと検索しても出てこないともいます。

乗り換えプラグインは大層なことをしていそうですが、内容的には『表示が崩れそうな部分を一時的に置換してCocoonのCSSを読み込んでいる』だけです。

このプラグインを導入しても、内容を書き換えてくれるわけではなく一時的に置き換えて表示しているだけですので、プラグインを消すと元に戻ってしまいます。

また、このプラグインを導入するデメリットとして、プラグインがあるから表示できているのか、無くても表示できているのかわからなくなるので、修正を手作業で行っていくときに混乱します。

このプラグインが行っている作業を、DBレベルで置換するようなスクリプトを組んでしまうのが一番賢いのかもしれません。

一括処理するには正規表現でDB内部を置換する必要があります

記事の内容を置換する場合、DB内部の置換になります。

さらに、DB内部を正規表現で置換できるものを探す必要があります。

無料のプラグインでDB内部を正規表現で置換できるプラグインは、Search regexぐらいしかありません。しかし、まともに動かない問題があります。

公式:https://wordpress.org/plugins/search-regex/

wp cliのsearch-replaceコマンドは正規表現で置換できるのでそちらを使えるように環境構築する方が乗り換え作業は簡単に進みます。

CocoonからSWELLへの乗り換え全工程

STEP

classicエディタをブロックエディタ型式で保存する

classicエディタをブロックエディタ型式で保存するにはチマチマやるよりプラグインを使うのが簡単です。

STEP

Classicエディタブロックからブロックに変換すると吹き出しの画像が巨大になる

Cocoonの吹き出しをブロックに変換すると画像が巨大になる問題があります。これは結構有名な話です。

その部分はSWELLの吹き出しに逐一置き換えていく必要があります。

私の場合は、あまり吹き出しを使っていなかったので影響は少なかったのですが、文章中にシコタマ吹き出しを使っている場合は、手作業で置き換えていくのは相当大変な作業になりますから、Classicブロックのままの方がいいかもしれませんね。

STEP

ショートコードの置き換え

自分で作ったショートコードをwp cli search-replaceで置き換えます。

wp search-replace '\[keikou\](.+?)\[\/keikou\]' '<span class="swl-marker mark_orange">\1</span>' --regex --precise  wpqd_posts  --include-columns=post_content  --log=./temp.log --regex-delimiter='|'
STEP

バッジの置き換え

Cocoonのバッジはspanタグのinline要素になっています。

SWELLにはバッジが無く置き換えられないので、wp cli search-replaceでspanタグを削除。

wp search-replace '<span class="badge(.+?)">(.+?)<\/span>' '\2' --regex --precise  wpqd_posts  --include-columns=post_content  --log=./temp.log --regex-delimiter='|'
wp search-replace '<span class="badge">(.+?)<\/span>' '\1' --regex --precise  wpqd_posts  --include-columns=post_content   --log=./temp.log --regex-delimiter='|'
STEP

マーカーの置き換え

Cocoonのマーカもwp cli search-replaceで置き換えます。

wp search-replace '<span class="marker-under-red">(.+?)<\/span>' '<span class="swl-marker mark_orange">\1</span>' --regex --precise  wpqd_posts  --include-columns=post_content  --log=./temp.log --regex-delimiter='|'
wp search-replace '<span class="marker[_\-a-z]+">(.+?)<\/span>' '<span class="swl-marker mark_orange">\1</span>' --regex --precise  wpqd_posts  --include-columns=post_content  --dry-run --log=./temp.log --regex-delimiter='|'
wp search-replace '<span class="marker.*">(.+?)<\/span>' '<span class="swl-marker mark_orange">\1</span>' --regex --precise  wpqd_posts  --include-columns=post_content   --log=./temp.log --regex-delimiter='|'

まとめ

CocoonからSWELLにテーマを乗り換える時に乗り換えプラグインを使って、クラシックブロックのままにしておけば、ひとまず大きな問題は起きにくいです。

クラシックブロックをブロックに変換した時にいろいろな問題が出てきます。

チマチマ手作業で行うのが嫌になった時には、WP CLIを使うことを検討してみてください。

役に立ったら他の人にもシェア!
  • URLをコピーしました!
  • URLをコピーしました!
コメントを閉じる

コメント

コメントする

コメントは日本語で入力してください。(スパム対策)

この記事の内容