無料テーマCocoonからAFFINGER5(アフィンガー5)に移行しようか迷ってるけど、
移行するメリットはあるのかな？
今ある記事のデザインが崩れたりするらしいけど、どうなってしまうんだろう。
移行する手順から設定方法、デザインが崩れた時の対処法など、具合的に何をすればいいのかも教えてほしいな。
こんな悩みを解決します。
本記事の内容
- 辛い作業あるけど、、CocoonからAFFINGER5（アフィンがー5）に移行してよかった話
- CocoonからAFFINGER5（アフィンガー5）へ移行する具体的手順
- まとめ：CocoonからAFFINGER5（アフィンガー5）へ移行したいなら早めのほうがいい
この記事を書いている僕は先日、半年ほど愛用したCocoonからAFFINGER5へ移行しました。
テーマ移行すると、デザインが崩れるという情話を聞いたことがあり、
すでに100記事あって月5万PV&月10万ほど発生していたため、移行してPVや収益が落ちたらどうしようと悩みました。
そんな中、移行に踏み切りましたが、テーマ移行直後にどういう状態になったかというと、
- トップページや記事の構成が崩れる
- デザインが崩れてるのにPV&収益は増える
- ブログのデザイン修正やレイアウトが崩れた100記事の修正に56時間
こんな感じです。
テーマ移行直後は、デザインは崩れたものの、Googleの評価は少し上がるといった感じ。
そして怒涛の記事修正祭りです。
本記事では、辛い作業がありましたが、AFFINGER5(アフィンガー5)に変えてよかったことを紹介しつつ、テーマ移行からデザインの修正まで、今まで通りブログを運営するために必要な作業を具体的に解説します。
この記事を読めば、CocoonからAFFINGER5(アフィンガー5)へスムーズに移行できると思いますので、是非じっくりご覧ください。
辛い作業あるけど、、CocoonからAFFINGER5（アフィンガー5）に移行してよかった話
結論を言うと、テーマ移行&修正は鬼だるいですが(100記事あったので)、テーマ変更して大満足しています。
CocoonからAFFINGER5（アフィンガー 5）に変えた理由
テーマを変更した理由は、トップページをおしゃれにしたかったからです。
Cocoonに限らずWordpressブログのトップページは、デフォルトの状態だと新着記事がずらーっと並びますよね。
でもおしゃれなブログって、カテゴリーごとにまとめられていたりしてかっこいいなーって思ってたんです。
Cocoonでもやれないことはないんですが、テキストエディタでコードを外部サイトから引っ張ってきて、ペタペタ貼り付けるというくそだるい作業が発生します。
正直HTMLやCSSの知識が皆無だった僕には苦行でしたね。。しかも完成したけどなんかいまいち、、。
そこで、おしゃれなブログを徘徊して使用しているテーマを探っていると、AFFINGER5というテーマを使っているブログが多い事に気づきました。
僕もAFFINGER5に変えてトップページをおしゃれにしたいなぁと思い、テーマ変更に踏み切りました。
テーマ変更にかかった時間
さきほど、移行後の修正に56時間かかったと説明しましたが、内訳はこんな感じです。
- テーマ購入・有効化 30分
- テーマ初期設定 1時間
- トップページ・ブログデザイン修正 25時間
- 記事修正(100記事) 30時間
トップページ・ブログデザイン修正に25時間かかったのは、テーマ導入後に何から手を付けていいのかわからなくて、いろいろ調べていたからです。
実際、必要なカスタマイズの情報が手元にあれば、3時間ほどでできると思います。
その時に必要だったカスタマイズ方法等、テーマ移行後に何をすべきかという事は後ほど紹介していきます。
一番だるかったのは記事修正です。あとで具体的な作業内容は書きますが、1記事で30分ほどかかりました。
僕は並行作業ができない人間なので一気に終わらせましたが、
実際は稼いでる記事だけ早急に修正すれば、あとはブログを更新しつつ、ゆっくり記事修正してもいいかなと思います。
AFFINNGER5(アフィンガー 5)はトップページのカスタマイズがめちゃくちゃ簡単
僕のトップページは最低限のカスタマイズしかしてないですが、Cocoonの時より見栄えが良くなったと感じています。
記事スライドや、カテゴリー名に背景画像を入れることができます。
他にも様々な素材がそろっており、ワンクリックで作成が可能です。
AFFINGER5に変更した直後からPVが爆上がり
テーマ移行後にこんなツイートをしました。
PVがぐんぐん伸びてきました。ツイートにもある通り、バグかと思いましたが順位も相対的に上がっていました。
TwitterでもPVが上がったという人はけっこう見かけるので、AFFINGER5はSEOに強いと言われている理由がわかりました。
CocoonからAFFINGER5（アフィンガー5）へ移行する具体的な手順
それでは、CocoonからAFFINGER5に移行する手順を紹介します。
テーマ移行の手順
- 手順1：AFFINGER5を購入
- 手順2：初期設定
- 手順3：トップページのカスタマイズ
- 手順4：記事の修正
- 手順5：完了
手順1：AFFINGER5を購入
まずは、公式サイトよりAFFINGER5を購入し、有効化します。
AFFINGER5公式サイトはこちら▶︎Cocoonのテーマは特に触らなくても、AFFINGER5を有効化すればCocoonは無効になります。
テーマ有効化の方法がよくわからない方は、別記事で詳しく説明していますので、ご覧ください。
（最後の章で画像付きで解説してます。）
-
-
【初心者でも簡単】お洒落なブログへ大変身！AFFINGER5(アフィンガー5)の評判と体験談を紹介
続きを見る
有効化した瞬間にブログのデザインが崩れますが、直し方も解説していきますので焦らなくても大丈夫です。
手順2：初期設定
有効化した後は、初期設定をします。
- パーマリンクの設定
- Googleとの連携
- 最低限必要なプラグインの導入
これらの初期設定の具体的な方法については、こちらの記事をご参照ください。1時間程度で終わります。
-
-
【初心者でも簡単】AFFINGER5(アフィンガー 5)の初期設定
続きを見る
手順3：トップページのカスタマイズ
初期設定によって、内部的な修正は終わりです。
しかし、表面的なブログのデザインは崩れたままなので、カスタマイズしていきます。
具体的にどんな崩れ方をするのかというと、元のブログデザインによっても少し違ってきます。
元のブログトップページは特にいじっていないという人
新着記事がずらーっと並ぶタイプの人です。そういった方はダメージが少ないはず。
- ブログ全体の色が変わる。
- サイドバー、ヘッダー、フッターの雰囲気が変わる
おそらく、これくらいかなと思います。
元のブログトップページをサイト型にしていた人
サイト型とは、カテゴリーごとに記事を並べたり、おすすめ記事や新着記事などの構成にしていた人です。
そういった方は、トップページのHTMLが効かずにがそのまま表示されます。
こんな感じでして、結構様変わりします。
修復するには、トップページを新たに作成し、元のトップページと入れ替えなければなりません。
カスタマイズ方法
先ほど紹介したように、デザインが崩れてしまったものは、修正しなければなりません。
一つずつ順番にカスタマイズしていけば治りますので、ご安心ください。
カスタマイズ方法をここで紹介するとかなり長くなるので、別記事を用意しています。
こちらの記事を参考に、順番通り進めれば崩れたデザインは治せます。是非参考にしてみてください。
-
-
【初心者でも簡単】AFFINGER5(アフィンガー 5)カスタマイズ方法
続きを見る
デザイン済みテンプレートを使いたい人
もし、自分でカスタマイズせずにデザイン済みテンプレートを使用したい人は、インストールすればデザインを上書きできます。
こちらも詳しい方法を別記事で紹介してますので参考にしてみてください。
-
-
【実体験レビュー】AFFINGER5(アフィンガー5)デザイン済データの落とし穴
続きを見る
手順4：記事の修正
テーマ移行するとブログデザインが崩れるだけでなく、記事の中身も装飾が消えたりして、すごく違和感のある記事になっていると思います。
- 吹き出し→バグる
- 囲み系デザイン（枠）→枠が消える
- ブログカード→バグる
こんな感じでして、崩れた箇所はひとつずつ直していかなければなりません。
直し方は単純で、例えば吹き出しを直す場合、
- バグった吹き出しの下に、AFFINGER用の吹き出しを新しく作る
- 新しい吹き出しの中に、バグった吹き出しの中に書いた文章をコピペ
- バグった吹き出しを削除
こんな感じで、地道に作業していきます。使っている装飾の種類にもよりますが、1記事10分～30分で修正できます。
記事の修正をするためには、AFFINGER5の基本的な使い方や、記事装飾の方法を覚えていないと苦戦します。
クラシックエディタを使っている方も、ブロックエディタ（Gutenberg）を使っている方も基本的な操作方法はCocoonと変わりません。
最初はわかりづらかったり、吹き出しはどうやって設定するの？みたいな疑問が出るかと思いますので、
使い方や記事の装飾方法については別記事を用意しました。そちらをご覧ください。
-
-
AFFINGER5(アフィンガー 5)の使い方【記事装飾を使いこなそう！】
続きを見る
この内容を参考に、自分の記事を全て修正していきましょう。
手順5：完了
お疲れ様です。これで今まで通り運営できるはずです。
最初は記事装飾が多すぎて、リストはどこのボタンだっけ？みたいに迷うことがありますが、
すぐに慣れますのでガンガン記事を書きましょう。
まとめ：CocoonからAFFINGER5（アフィンガー5）へ移行したいなら早めのほうがいい
いかがでしたでしょうか。CocoonからAFFINGER5(アフィンガー5)に移行するした実際の手順を一通り紹介しました。
もう一度おさらいしましょう。
まとめ
- 手順1：AFFINGER5を購入
- 手順2：初期設定
- 手順3：トップページのカスタマイズ
- 手順4：記事の修正
この手順でやれば、だれでも簡単にテーマ移行ができると思います。
一つアドバイスをしておくと、テーマ変更するなら、早めのほうが良いです。
僕は、収益がある程度出たら有料テーマにする！と決めて100記事積み上げてから移行しましたが、
後悔しまくりました。正直、記事修正に費やした50時間は、ブログやめたくなるくらいマジでつらかったです。
AFFINGER5に限らず、有料テーマに変更しようか悩んでいる方は早めに行動しましょう。
有料テーマ費用の１、２万くらいなら誰でもすぐに稼げるようになります。
AFFINGER5のレビューはこちらで紹介しています。まだよく知らないって方は参考になると思いますので是非ご覧ください。
-
-
【初心者でも簡単】お洒落なブログへ大変身！AFFINGER5(アフィンガー5)の評判と体験談を紹介
続きを見る