使用テーマをSimplicity2からCocoonへ乗り換えました
Cocoonの紹介
CocoonはSimplicityを公開している作者さんのわいひらさん@MrYhiraが作ったテーマです
後継テーマとして開発されていて
新しくテーマを作成したのは、Simplicity自体元々、個人用に作成したものを公開したテーマだったので、機能を増設するにつれて、多少の無理も出てきて、動作確認が大変になってきたからです。
また、Simplicityは、約4年前に公開したものなんですが、「当時のWEB状況」と「最近のWEB状況」に乖離もでてきました。ですので、一度現在の状況に合わせて作り直しておきたかったからです。
出典：寝ログ
との事、詳しいことはサイトで確認してみてください
移行前の準備
まずは移行前にカスタマイズしていた部分の確認と書き出しをしておきます
こうする事で見た目をそこまで違和感がない状態でスムーズに移行する事が出来ると思います
内容
- ヘッダや背景、カラーコードなど
- アナリティクスなどのIDなど
- 変更をした物のCSSファイルなど
- コンテンツの配置
こんな所でしょうか…FTPを使っている人はローカルにダウンロードしておくと良いと思います
以前のテーマを完全に削除をしてしまわなければ、確認する事が可能ですしね
Cocoonのダウンロードとインストール
現在はまだ一般公開されていないので、Cocoonサイトで登録をしてからダウンロードする形になります
登録自体は簡単でユーザー名を決めてメールアドレスを入れ登録をする感じです
詳しい事はサイトに説明がありますので、そちらを確認してくださいね
本体と子テーマをダウンロードしてきたらアップロードをします
ここはFTPからでもwordpressの外観 テーマ 新規追加でもお好みで
アップロード前にCSSファイルなどを以前の物から追加しておくと適用される部分が多いので
あとからの変更が少しだけ楽になると思いますよ
有効化後 Cocoonの設定
Cocoonの設定はSimplicityの時と違いテーマカスタマイザーは使いません
インストールし有効化するとメニューの中にCocoon設定というものが出来るので
そこから各種設定をしていきます
子カテゴリ…というのか分かりませんが、からは吹き出しやテンプレート、アフェリエイトタグなどの設定をします
サーバエラーになるので気をつけましょう！実際自分はやらかしました…
.htaccessに追加されるのでエラーを吐いた場合は追加された部分を削除しましょう
各種設定をして確認をしたら、適用されなかった部分や新たに修正をしたい部分の調整をしていきます
各種修正や調整など
設定が終わったらあとは各種調整をするだけです
一応同じ様にしたい人が居るかも知れないので、一部コードを貼っておきます
ウィジェット
サイドバーやその他ウィジェットは外観 ウィジェット で行います
一部消えていた物があったので新たに設置をしました
モバイル表示のスライドメニュー
自分は無料サーバーをお借りしてブログ運営をしているので、モバイル表示の時だけ下に広告がでます
そのためデフォルトのスライドメニュー表示だと広告に被ってしまいメニューが隠れていました
そこで以下のコードを子テーマのstyle.cssへ追加しました
レスポンシブデザイン用のメディアクエリ部分の各サイズへ追加です
.mobile-menu-buttons {
position: fixed;
top: 0;
opacity: 0.9;
width: 100%;
}これを追加することでスライドメニューが上部へ表示されるようになりました
記事一覧のサムネイルサイズ
記事によってサムネイルサイズが変わっていた為、一覧画像がバラバラになっていたのを
Regenerate Thumbnailsを使い直しました
枠自体は同じなのに、画像のせいでタイトルの位置がバラバラだったのはやっぱり気になりますしね
おわり
Simplicity2もCocoonもシンプルでカスタマイズ性の高いテーマで使いやすいですねー
自分の所ではSimplicity2でAMP(Accelerated Mobile Pages)を適用させると
デザインが崩れまくっちゃって諦めたのですが、Cocoonだと特に問題なく表示してくれました
完全互換という訳ではないので、まだ一部思い通りには出来てないですが一応こんな所かな…
ただテーマ変更後に速度テストした時はモバイルの所がかなり早くなったんですが
調整などの追加をしたら以前と変わらなくなったので、
どうも無駄があるみたいで調整が必要みたい…なかなか難しいですね
[share]
