[Simplicity2からCocoonへ]ワードプレスのテーマを変更する[WordPress]

Simplicity2カスタマイズ

以前、当方の趣味のブログは全てテーマ「Simplicity2」で作っていると書かせていただいた気がしますが、映画のブログは「はてな」からWordpressに移転した時点で「Cocoon」を選択しました。

これが使いやすくて素晴らしいので、今回、仕事関係のブログ(現Sinplicity)もCocoonに変更することにしました。

いずれはこのブログもCocoonに変えようと思っているので、とりあえず覚書き。

ちなみに2022年現在、当ブログはSWELL へテーマを変更しております。

あわせて読みたい
「SWELL」の評判デメリットレビューを斬る 評判が良いSWELLというWordpressテーマは本当に使いやすいのか。 SWELLという有料テーマはアフィリエイトに向いているのか。 SWELLは他のワードプレステーマと比べて使...
目次

ワードプレスのテーマをSimplicityからCocoonへ簡単に変える方法

そもそもなぜ映画のブログはCocoonにしようと考えたのか……というと、「はてな」で最後に使っていたテンプレート
Wordpressテーマの変更cocoon

↑と、なるべく近いデザインにしたかったというのが理由です。

Wordpressテーマの変更cocoon

 

それはSimplicityでも実現可能なのでしょうが、Cocoonの方が色々と考えなくても思った通りのTOPが作れそうだったので。

 

ちなみに、先日の記事、

あわせて読みたい
[WordPress]トップページに画像カード横並びのメニューを設置する方法[初心者OK] 画像を横並びにして額縁のようにトップページに飾り、それをメニューとしてリンクする……。 というレイアウトは何となく「カッコいい」と思う方が多いはず。 一昔前のHP...

この、画像カードを横に並べたデザインのTOPページというのも、こんな事しなくてもCocoonなら簡単に実現します。

Cocoon とは

「Cocoon」「Simplicity2」と同じく わいひら氏が作成されている無料テーマです。「Simplicity2」以上に自由度が高く、洗練されていて、高機能で、こんな凄いものを無料で使わせていただいているのがホントに信じられません。ありがとうございます。

 

その「高機能」の内容は「Cocoon」公式でも充分説明されているし、書かれている方もたくさんいらっしゃるので割愛し、ここでは「Simplicity2」→「Cocoon」の変更方法と注意点のみ書いていこうと思います。

SimplicityからCocoonへの移行手順

まずCocoonの公式へ行ってテーマファイルをダウンロードします。

Cocoon
テーマのダウンロード Wordpressテーマ「Cocoon」の親テーマと子テーマのダウンロードページです。
「ダウンロード」のボタンを押して、親テーマと子テーマを両方ともダウンロードします。
Wordpressテーマの変更Sinplicity→cocoon zipファイル
Sinplicityの方で何か気に入ったCSSを書いていた方は、テーマが変われば当然消えますのでバックアップしておいてください。

ダッシュボードに入る

1.テーマを変更するWordpressのダッシュボードに入り、「外観」→「テーマ」へ。

2.上「新規追加」をクリック。
Wordpressテーマの変更Sinplicity→cocoon インストール

3.上「テーマを追加」→ 「テーマのアップロード」をクリック。

4.「ファイルを選択」をクリックして、先ほどダウンロードしたzipファイル(cocoon-master)をインストール。

5.「有効化」したら、続けて同じ手順で子テーマzipファイル(cocoon-child-master)をインストールします。

6.子テーマを「有効化」します。
Wordpressテーマの変更Sinplicity→cocoon 有効化

 

最終的に「有効化」するのは親テーマではなくて子テーマの方です。

注:順番は「親テーマ」→「子テーマ」の順に有効化すること。

テーマの変更自体はこれで終了です。ここからカスタマイズしていきます。

Simplicity2からCocoonへ変更したらやった方がいいこと

1.投稿設定を引き継ぐ(メタディスクリプションなどSEO設定)

Simplicityで記事を書くときに「メタディスクリプション」や「SEOタイトル」などの設定をきちんと入れていた方は、テーマの変更によって消えてしまっている可能性があります。(たぶん、消えます)

一記事ずつ全部手動で書き直さなくてはいけないの!?……という心配はありません。

1. メニューから「Cocoon設定」を開く
Wordpressテーマの変更Sinplicity→cocoon 設定

2. 「その他」タブを開き、「Simplicityから投稿設定を引き継ぐ」をクリックして保存

Wordpressテーマの変更Sinplicity→cocoon 設定引き継ぐ

たったこれだけで、以前書いた記事のSEO設定が復活します。

2.Google Analytics とGoogle Search Console の設定

「Google Analytics」のトラッキングIDと「Google Search Console」のIDを持っている方は先ほどの「Cocoon設定」をクリックして記入します。(IDを持っていない方は、この機会に作りましょう)

あわせて読みたい
Google Search Console(サーチコンソール)の設定・URL登録方法[無料ブログからWordPressまで] Google Search Console(サーチコンソール(いわゆるサチコ))の開設、設定、サイトとの連携、サチコを開設したら初めに何をするべきか、などをまとめます。この記事の初稿...
あわせて読みたい

1. メニューから「Cocoon設定」を開く

2. 「アクセス解析・認証」タブを開き、「Google AnalyticsトラッキングID」「Google Search Console ID」を記入して保存

一番上の「アクセス解析設定」→「解析する」にチェックすると各ページのアクセス数を管理人だけに表示してくれます。おすすめ。

3.「All in one SEO」プラグインを何とかする

上記のアナリティクスやサーチコンソールの再設定ですが、元々「All in one SEO」プラグインで設定してある方はそのままで良いです。つまり、Cocoon設定にも記入してしまうとダブってしまいます。

それは「Sinplicity」の時もそうだったと思うのですが、記事の「メタディスクリプション」も「All in one SEO」とダブってしまうので記載する必要がないですし……要するに、Cocoonを使うとSinplicity以上に「All in one SEO」は不要になります。停止してもいいかも。

4.「目次」プラグインを停止する

「Table of Contents Plus」などの「目次」作成プラグインを使っていた方は、Cocoonを使えば必要なくなるので停止した方がいいです。(と申しますか、ダブるので停止してください。)

Cocoonでは<H2>タグの上に目次が自動的に作成されます。(目次が要らない場合はCocoon設定の「目次」タブから表示非表示を設定できます)

 

あとは、体裁や広告の場所の問題になりますので、Cocoon 設定のタブをあれこれいじりながらカスタマイズしていくといいと思います。Cocoonのカスタマイズは全てこの「Cocoon設定」画面で行うことができます。

 

デザイン的なカスタマイズについては、また別記事で。

 

サイトカスタマイズの覚え書き
cocoonカスタマイズ | サイトカスタマイズの覚え書き「ブログのblog」 Wordpressの優良無料テーマ『Cocoon』の初心者でもできるカスタマイズと使い方覚え書き
よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

profile

主にWordpress中心のサイト・ブログ制作&コーダー、カスタマイザー。

2000年からHP制作を始めました。

ハウツーサイトやキュレーションサイトのライター、ブログ作成・運営のお手伝いなどをしております。

お仕事で関わった無料ブログ&Wordpressカスタマイズ案件実績500件以上。

携わったワードプレステーマ30以上。

アナリティクスを観察するのは生活の一部。

Google Analytics個人認定資格取得(GA4)。 SEOマーケティングアドバイザー資格取得。

SEOに特化したページ作りをめざしています。

 

カスタマイズのご依頼は「一木堂」へ

follow us in feedly 映画@見取り八段 | 映画感想ブログ coconara ss

サポートよろしくお願いします

いつもありがとうございます。

この記事を気に入って下さった方、「寄付してあげてもいいよ」という方がいらっしゃったらサポートしていただけると嬉しいです。

Amazonギフト券- Eメールタイプ - Amazonベーシック
金額は空白欄に適当に(15円から)書きこんで下さい。(あらかじめ入っている金額はAmazonの設定なので気になさらないでください)。

メールのあて先は 「ageru15@gmail.com」です。
※上記のアドレスは投げ銭受け取り専用です。他のメールは受け取れない設定にしてあるのでご注意ください。

a
よろしくお願いいたします。

なお、この投げ銭システムに関する記事はこちら→『ブログに「投げ銭」システムをつける方法を考えてみたまとめ』

コメント

コメントする

目次