こんにちは、みてみて(@look_mam_look)です。
ブログ一周年を記念して、当ブログはsimplicityからcocoonに移行しました！
どちらのテーマも製作者はわいひらさん(@Mryhira)なので、simplicityからcocoonへ移行する人も多いんじゃないでしょうか？
今回は備忘録を兼ねて、「文系主婦が自力でテーマ移行」するにあたってやったことをまとめまておきます。
先に言っておきますが、cocoon最高です！！
cocoonとは
cocoonはwordpressの無料テーマで、同じく無料テーマの中でも根強い人気を誇るsimplicityと同じ、わいひらさん(@Mryhira)によってつくられました！
ブログを始めた当初はお小遣いもない専業主婦だったわたし。wordpressで開設することを決めてからいろいろなテーマを見たのですが、無料で評価も高いと聞いて以来simplicityを使っていました！
（まぁ通向けだったということもあり最初はCSSに大苦戦・・・その時の経験は今では貴重なスキルとなりました）
simplicityの”後釜”!? cocoonのすごいところ！
以前公開したSimplicityの後継となるテーマです（※後釜ということで完全な互換性はないです）。
新しくテーマを作成したのは、Simplicity自体元々、個人用に作成したものを公開したテーマだったので、機能を増設するにつれて、多少の無理も出てきて、動作確認が大変になってきたからです。
また、Simplicityは、約4年前に公開したものなんですが、「当時のWEB状況」と「最近のWEB状況」に乖離もでてきました。ですので、一度現在の状況に合わせて作り直しておきたかったからです。
ということで、最近のトレンドを押さえるべく
- ページ高速化設定
- モバイルファースト・フレンドリー
- AMP対応
- 吹き出し機能
- 文章装飾機能（アンダーライン完備）
- カラムわけ機能
- 目次完備
- アピールエリア完備
など、「無料テーマとしては十分だけど、やっぱり有料テーマはかゆいところに手が届く設計だなぁ・・・」と感じていたところがすべてカバーされた感じなんです！
特に吹き出しと目次に関しては、今ブログを書く上で欠かせない機能にもかかわらず、多くの人はプラグインで設定していますよね？
なので、これらがテーマに標準搭載されたcocoonを使うことでその分プラグインも減らせて高速化にもつながるんです！
わたしがcocoonに移行した理由
⚠️注意喚起⚠️
大手ブログで解説があるけど、Xサーバーの方は高速化プラグインの「W3 total cache」はインストールしないように注意です！
有効化して設定終わりと同時にWPが真っ白。復旧めっちゃめんどくさくて高速化どころじゃありません！ちなみにまだ直らない。
— みてみて (@look_mam_look) 2017年9月8日
ブログ仲間の方にサイトの表示が重いねって言われて以来けっこう気にしていたサイトスピード。
自分なりにいろいろ調べてやったんですがキャッシュ系プラグインはビギナーには扱いが難しいとのことで、なかなか手が付けられずにいたんです。
ところがcocoonではサイトの高速化がチェックボックスへのクリック一つで出来ると聞き、これがテーマ移行を決めた大きなポイントになりました!
調整途中ですが移行しただけでモバイルは91を叩きだしてるので大満足です！！
simplicity
cocoon移行後
一応まだ正式リリースではないとのことで、ダウンロードにはメルアド登録が必要ですが、初期エラーへの対応はあらかた終わったとのことなので思い切って移行してみてよかったです！
▼ cocoonサイトをのぞいてみる ▼
cocoonに移行してやったこと
はじめてのテーマ移行。戸惑いも多かったですが、cocoon公式サイトでの解説も豊富なので、スムーズにインストール＆設定ができました！
- アナリティクス・サーチコンソール設定
- ヘッダー画像・ファビコンの再設定
- メニュー（グローバルナビ）設定
など、テーマ移行にあたってやるべきことはこちらのサイトを参考にさせていただきました。
フッターの文言もいろんなバリエーションからクリック一つで選べるのうれしい。
その他、simplicityで使っていたCSSをcocoonのstyleシートにコピペ。
アンダーラインも吹き出しもCSSでやるメリットはこれだなと痛感しました。テーマ移行時もお引越しラクラク（ショートコードが充実してるテーマだと張り替えが大変そうなので・・・）
あとは全体のカラーを整えるのにcolor-hexを参考にcocoon設定やCSSの色彩を調整。たまたまわたしのアイコンカラーを使ったパレットがあったのでそのまま使わせてもらいましたｗ
デザインって難しいけど、半分くらいは配色（色相）の問題な気もします。なのでこういうサイトを参考に見出しや背景色を設定するだけで簡単に見栄えよくカスタマイズできるのでおすすめです！
cocoon移行で不要になったプラグインを削除
テーマの機能として目次が標準搭載されているのでTable of contents plusを削除しました。
その他、吹き出し機能も完備されているのでそれまでプラグインでやってた方は張り替え作業をすればプラグインを減らすことができますよ。
CSSで吹き出しを使っていたかたは、張り替えでCSSの省略も可能です！
simplicity⇒cocoon移行でもやらなくていいこと
simplicityとの互換性はないとのことですが、設定などは引き継げるので特に作業はないかなと思いました！
cocoonはURLを貼るだけでブログカードになるよう設定されていますが、simplicityの<a href=”URL”>URL</a>形式もそのまま使えるので、リンクの張り替え作業は不要です！
さて、これでＯＫ！と思っていたらそのあとちょこちょこトラブルがあったので、今後誰かの参考になればとまとめておきますね！
cocoonに移行後に苦戦したトラブルと対処法
h3のCSSが重複する
simplicityの時から使っているCSSをそのまま使おうとコピペしたところ、デフォルトのh3装飾と二重に表示されてしまいました。
（デフォルトの装飾の上にCSSで指定した矢印のアンダーラインが被っている状態）
いろいろ調べてみたところ、h3のCSSでアンダーラインを指定していても、全体の装飾が上書きされているわけではない状態のようで、一度h3の装飾を打ち消す記述を加えるといいのだとか。
ということで、
border:0;
border-left:0px solid #fff;
border-right:0px solid #fff;
border-top:0px solid #fff;
}
と書いたあと、矢印アンダーラインのCSSを記述すると上手くいきました！
アナリティクスの重複
テーマ移行後のアナリティクスがこんな状態に・・・！
直帰率０％とかあり得ないから！
こうなってしまったのもアナリティクスのトラッキングIDが重複してしまっていたから。
- simplicity時代に使っていたAll in one SEO
- cocoonのテーマ
この両方にコードが入っていたためアナリティクスの数字が跳ね上がってしまっていました。なので、All in one SEOの方のトラッキングIDを削除すると正常値に戻りました。
とはいえ、一度集計されてしまったものは修正ができないみたいです
まとめ：cocoonは最強の無料テーマである！
限りなくローコストでブログを運営するため、使用テーマは無料にこだわってきました。
その中でも根強いユーザー人気のあったsimplicityはネット上にカスタム情報も多く、ブログ初心者のわたしでも楽しく利用させてもらっていました。
とはいえ有料テーマが羨ましく思えたことは一度ではありません。
今回新しくリリースされたcocoonでは「これがあればいいのに・・・！」という点が幅広くカバーされているし、CSSのコピペの必要もなく吹きだしやアンダーラインがつかえるので、wordpress初心者でもすぐにブログを書ける環境が整っているなと感じました！
ブログは続けることが何よりも大事。新しいテーマと心機一転またブログを楽しみたいと思います！
コメント