WordPressを使っていると、途中で別のテーマへ変更したくなることがあります。
最初はCocoonを使っていたけれど、もっとシンプルなテーマへ変えたい。デザインを変えたい。自分に合ったテーマを使いたい。
そんなとき気になるのが、
「テーマを変えたら記事が崩れない？」
という問題です。
テーマを変更するだけなら、WordPressの投稿そのものが全部消えるわけではありません。しかし、今まで使っていたテーマ独自の機能やブロックまで、そのまま新しいテーマで使えるとは限りません。
AIちいちゃんクローゼットでも、TakeログをCocoonからAIちいちゃんテーマへ実際に移行してみました。
そこで分かったのは、テーマ変更で本当に怖いのは、記事本文そのものよりも**「そのテーマだけで使える機能」**でした。
今回は、実際にCocoonからテーマ変更して分かった注意点を紹介します。
WordPressテーマを変えても記事本文は基本的に残る
テーマ変更と聞くと、
「記事が全部消えるのでは？」
と心配になるかもしれません。
WordPressの投稿本文や画像などは、基本的にテーマとは別に保存されています。
そのためテーマを切り替えたからといって、通常の文章や画像まで全部なくなるわけではありません。
たとえば、
普通の文章。
H2やH3などの見出し。
画像。
通常のリンク。
一般的な箇条書き。
こうしたWordPress標準に近い内容は、テーマを変更しても比較的そのまま残りやすいです。
問題になるのは、その先です。
テーマ独自のブロックは注意が必要
Cocoonには、記事を作りやすくするための独自機能がたくさんあります。
Takeログでも、
吹き出し。
Q&A。
ボタン。
アコーディオン。
商品リンク。
などを使っていました。
Cocoonを使っている間は普通に表示されています。
ところが別テーマへ変更すると、新しいテーマ側は、
「これはCocoon専用のブロックです」
ということまでは分かっても、そのデザインや機能を再現できない場合があります。
その結果、
見た目が崩れる。
普通のリンクになる。
画像と文章が分かれる。
開閉機能がなくなる。
といったことが起こります。
実際に吹き出しが崩れた
Takeログでは、会話形式の記事をたくさん使っています。
キャラクター画像。
名前。
吹き出し本文。
この3つがセットになっている記事です。
Cocoonでは自然に表示されていましたが、新しいテーマへ変更するだけでは、そのまま同じ吹き出しとして使えるわけではありませんでした。
そこでCocoonの吹き出しを、AIちいちゃん側の共通吹き出しへ変換する仕組みを作りました。
さらにPCでは正常に見えていても、スマホで確認したところ、吹き出しが横に切れる問題も見つかりました。
ここも修正しています。
この経験から分かったのは、
テーマ変更はPCだけ確認して終わりにしない方がいい
ということです。
必ずスマホでも確認した方が安心です。
アコーディオンもテーマ依存になることがある
Takeログでは、長い文章を折りたたむためにアコーディオンも使っていました。
たとえば、
「全文なが〜いので隠しました。クリックすると開きます」
というような開閉部分です。
これも単なる文章ではなく、開閉するための仕組みを持っています。
新しいテーマ側に同じ機能がなければ、
開かない。
常に本文が表示される。
タイトルだけ残る。
といった問題が起こる可能性があります。
そのため、アコーディオンもAIちいちゃん側で使える共通パーツへ変換する対象にしました。
Amazon・楽天の商品リンクは特に注意したい
見た目が少し崩れるだけなら、あとから直すこともできます。
でもアフィリエイトブログでは、商品リンクが壊れる方が困ります。
Cocoonの商品リンクでは、
商品画像。
商品名。
Amazon。
楽天市場。
Yahoo!ショッピング。
などをひとつの商品カードとして表示できます。
これがテーマ変更によって正常に表示できなくなると、デザインだけではなく収益にも関係します。
そのため、テーマ変更前には、
アフィリエイト商品リンクが正常に残るか
も確認しておいた方がいいです。
ブログカードやFAQなども確認したい
テーマ独自機能は、吹き出しや商品リンクだけではありません。
使っているテーマによっては、
ブログカード。
FAQ。
タブ。
アイコンリスト。
アコーディオン。
ランキング。
新着記事。
人気記事。
なども独自機能として提供されています。
今のテーマで普通に使えていると、
「WordPressの標準機能なんだろう」
と思ってしまうことがあります。
でも実際には、テーマを変えて初めて、
「これ、前のテーマの機能だったんだ」
と気づくことがあります。
テーマ変更を考えているなら、見た目だけではなく、普段の記事で使っているパーツを確認しておくと安心です。
Cocoonからの一括変換機能を作った
Takeログでは記事数が多いため、ひとつずつ手作業で直す方法は現実的ではありませんでした。
そこで、
Cocoon専用パーツを検出
↓
AIちいちゃん共通記事パーツへ変換
↓
複数記事をまとめて処理
できる一括変換機能を作りました。
最初は少数の記事でテストし、問題がないことを確認してから一括変換できるようにしています。
テーマ変更で記事が崩れる問題を、
「新テーマ側でCocoonを無理やり再現する」
のではなく、
「テーマに依存しない共通パーツへ変換してしまう」
という考え方です。
新しいテーマへCocoonのCSSを全部持っていけばいい？
一見すると、
「Cocoonのデザインを新しいテーマでも読み込めばいいんじゃない？」
と思うかもしれません。
でも、それを続けると新しいテーマの中へ古いテーマの仕組みを大量に抱えることになります。
せっかくテーマを変えたのに、記事側ではずっとCocoonへ依存したままです。
そこでAIちいちゃん側では、
Cocoon専用パーツ
↓
AIちいちゃん共通記事パーツ
へ変換する方針にしました。
一度共通化できれば、今後テーマを変更するときにも扱いやすくなります。
テーマ変更前に確認したいこと
テーマを変更するときは、いきなり本番サイトで切り替えるより、まず何を使っているのか確認しておくと安心です。
特に確認したいのは、
- 吹き出し
- 商品リンク
- FAQ
- ボタン
- アコーディオン
- ブログカード
- テーマ独自の装飾ブロック
などです。
そしてテーマを変更したら、代表的な記事だけでも、
PC
スマホ
の両方で確認する。
記事数が多いサイトほど、この確認が大切になります。
テーマ変更そのものより「テーマ依存」が怖い
今回、Takeログを実際に移行してみて分かったのは、
テーマを変更することそのものが怖いわけではない
ということでした。
本当に確認した方がいいのは、
今までの記事が、どこまで現在のテーマへ依存しているか
です。
普通の文章や画像だけなら比較的移行しやすい。
でもテーマ独自の吹き出しや商品カードをたくさん使っているなら、先に対応方法を考えておいた方がいい。
ここが分かっていれば、テーマ変更の怖さはかなり減ります。
Cocoonからテーマ変更するなら、先に記事を確認しよう
Cocoonは無料でも多くの機能が使える便利なテーマです。
だからこそ、知らないうちにCocoon独自の機能をたくさん使っていることがあります。
別テーマへ移るときは、
「テーマを変えられるか」
だけではなく、
「記事の中に何が入っているか」
を先に確認する。
そして必要なら、テーマに依存しない形へ変換してから移行する。
Takeログでも、この方法でCocoonからAIちいちゃんテーマへの移行を進めました。
テーマを変えたいけれど記事が崩れるのが怖い。
そんな人は、まず現在の記事で使っているテーマ独自機能を確認するところから始めてみてください。
アンリミテッドアフィリエイトはAI時代でも通用する？ChatGPTを使って実践して分かったこと
便利ツール完全ガイド
ブログのネタ探しから記事作成、
WordPress下書き、LP、ステップメールまで。
初心者でも迷わないAIツール活用ガイドを
無料でプレゼントしています。
メルマガ登録後、すぐにご覧いただけます。