コクーンユーザーならいつか必ず頭をよぎるのが、有料テーマへの移行。
数ある有料テーマの中でも、コクーン開発者のわいひらさんがお勧めしている「SWELL」はやはり人気で、CocoonとSWELLは業務提携しています。
この記事では、コクーンからSWELLに移行しようかな?でもどうすればいい?移行作業は大変なのかな?という方への参考に、無邪気にテーマを移行した結果を紹介します。
修正とリライトがすぐに必要なポイントが見えてきました。
ゆまこのもう一つのサイト「簡単開運で丁寧に暮らす」をCocoon→SWELLにテーマ変更しました。
実際にSWELL→Cocoonにテーマ移行をする方の手順はこちらの記事を参考にしてください。
![](https://yumako428.com/cocoon/wp-content/uploads/cocoon-resources/blog-card-cache/5dc03a959c7ebe551b3f48f411e3ad4d.png)
テーマ以降の前にしたこと
① テーマの購入
まずはテーマを購入します。
![](http://image.moshimo.com/af-img/3130/000000053838.jpg)
② 移行サポートプラグインのインストール
CocoonからSWELLに乗り換えるためのプラグイン(公式ページ)トップページの移行前(Cocoon)移行後(SWELL)比較
トップページから比較していきましょう。
テーマ移行前のCocoonトップページ
テーマ移行前のCocoonサイトです。
全体にテーマカラーを付けていて上から
・グローバルメニュー
・アピールエリア
・ボックスメニュー
・本文エリアは、インデックスで全体の新着記事とカテゴリ別の新着記事
・サイドバーは検索、プロフィール、人気記事、おすすめアイテムリンク
にしていました。
![サイト移行前Cocoon](https://yumako428.com/wp-content/uploads/2022/03/cocoon-11.png)
テーマ移行後のSWELLトップページ
移行すると、びっくりするくらい見たことのないサイトになっていました。
「これぞSWELL!」という感じです。
上半分。
大きいヘッダー画像に 『さぁ。始めよう。』が目につきます。
グローバルメニューはアイコン(Font Awaresome)が認識されていません。
ヘッダーの下には、Cocoonでいう「カルーセル」が登場しています。
Cocoonでしていたサイトカラーは設定がなくなっています。
![SWELL移行後](https://yumako428.com/wp-content/uploads/2022/03/swell-1.png)
下半分。
サイドバーは検索だけ残ってあとはなくなりました。
新着記事は、カテゴリ別のがなくなって、全体のが10記事表示されています。
![SWELL移行後](https://yumako428.com/wp-content/uploads/2022/03/swell-2.png)
記事ページの移行前(Cocoon)移行後(SWELL)比較
タイトル・目次・吹き出し
まず、記事タイトル、目次、吹き出しを比べていきます。
移行前(Cocoon)
![移行前Cocoon](https://yumako428.com/wp-content/uploads/2022/03/cocoon-12.png)
移行後(SWELL)
![移行後SWELL](https://yumako428.com/wp-content/uploads/2022/03/swell-12.png)
ここは大きな崩れなく、ブロックが表示されています。
・記事タイトルの前に大きな日付が表示されている
・タイトル下に、カテゴリと投稿日・更新日が表示されている
・見出しはSWELL初期設定になっている
ので、後々カスタマイズが必要です。
SWELLに移行した後の吹き出しを触ると、このような表示が出ました。
![SWELL移行吹き出し](https://yumako428.com/wp-content/uploads/2022/03/swell-8-500x252.png)
Cocoon機能で作った吹き出しは、「HTML」で保存されているので、SWELLのふきだし機能に移行されたということではないようです。
タイムラインブロック
移行前(Cocoon)
![移行前Cocoon](https://yumako428.com/wp-content/uploads/2022/03/cocoon-13.png)
移行後(SWELL)
![移行後SWELL](https://yumako428.com/wp-content/uploads/2022/03/swell-13.png)
タイムラインボックスは大きな崩れもなく表示されています。
ただしタイムラインブロックも、吹き出しと同じように「HTML」で保存されているので、SWELL昨日でのタイムラインボックスに置き換えることが必要です。
Cocoon機能のカラムを使った場合も同じく「HTML」で保存されていました。
![SWELL移行後HTML](https://yumako428.com/wp-content/uploads/2022/03/swell-11-500x451.png)
ボックス、スペーサー、ボタン
ボックスは色が変わってしまうけど、カスタマイズは崩れていません。
ボックスとボックスの間にあるスペーサーも大丈夫。
問題は「ボタン」です。
ボタンは、移行後には表示されなくなっているので、急いで修正が必要です。
移行前(Cocoon)
![移行前Cocoon](https://yumako428.com/wp-content/uploads/2022/03/cocoon-14.png)
移行後(SWELL)
![移行後SWELL](https://yumako428.com/wp-content/uploads/2022/03/swell-14.png)
SEO(タイトル、メタディスクリプション、キーワード)
記事の最後に書いていたSEO(タイトル、メタディスクリプション、キーワード)。
これは移行されませんでした。
Cocoonは、Cocoono標準機能でSEO対策できていましたが、SWELLはプラグインで対応するため、情報の引継ぎが出来ません。
移行前(Cocoon)
![SEO設定](https://yumako428.com/wp-content/uploads/2022/03/cocoon-6.png)
移行後(SWELL)
移行されない
まとめ
この記事では、コクーンからSWELLに移行しようかな?でもどうすればいい?移行作業は大変なのかな?という方への参考に、ゆまこのもう一つのサイト「簡単開運で丁寧に暮らす」をCocoon→SWELLにテーマを移行した結果を紹介しました。
そして、修正とリライトがすぐに必要なポイントが見えてきました。
すぐに修正とリライトが必要なアイテム
トップページ、ボタン、SEO、サイドバー
まずはリライトは必要ないアイテム(移行プラグインでHTMLで表示を保持のもの含む)
目次、見出し(SWELL色ではあるけれど)、吹き出し、タイムラインブロック、カラム、ボックス、スペーサー
Cocoon→SWELLに移管するポイントを知りたい方はこちらの記事をどうぞ
![](https://yumako428.com/cocoon/wp-content/uploads/cocoon-resources/blog-card-cache/5dc03a959c7ebe551b3f48f411e3ad4d.png)