Cocoon親テーマが2つ?ウィジェット画面がおかしい?解決策を丁寧に解説|ConoHa WING編

Cocoonウィジェット画面がおかしい?解決法

WordPressでCocoonの更新をしたところ、親テーマが2つになってしまいました。
ウィジェット画面も今までと違い使いにくい・・・。
ですが、どこにも私と同じウィジェット画面を掲載しているサイトがネット上に見つかりません。

「あれ?私だけ変?」

その原因はConoHa WINGユーザーによく出るエラーにありました。
なぜなら、ConoHa WINGで提供しているCocoonのフォルダ名とCocoon標準のフォルダ名が違うからです。

ブログを始めて日が浅い初心者には、ちょっと何言っているか分からない・・・ですよね。私もそうでした。(^^;

そこで、超初心者の私でも簡単に解消できた方法を画像付きで説明します。

追記:2021年11月22日以降ConoHaのコントロールパネルよりインストールしたCocoonは今回の問題を修正済み。ConoHa公式サイトより

この記事はこんな方にオススメ
  • ConoHa WINGユーザー
  • Cocoonを使っている
  • ウィジェット画面がみんなと違う
  • Cocoonの親テーマが2つ存在する
  • WordPressでCocoonの更新をした

べる
べる

この記事を書いたのは、WordPressでブログを運営して3か月の超初心者ブロガー。

sun
sun

えっ?大丈夫?説明できる??

べる
べる

初心者の私でも解決できた方法をお伝えします。 専門知識がなくでも大丈夫!丁寧に分かりやすく伝えるよ!

Cocoon設定で「閲覧できません」!3分で分かる解決法はこちら

スポンサーリンク

親テーマとウィジェット画面をチェック

親テーマcocoonが2つ


まずは不具合が発生しているかどうか、WordPressで確認してみましょう。

不具合の見分け方

①WordPress管理画面→外観→テーマをクリック。
親テーマが2つ存在する。

cocoon親テーマが2つある

②WordPress管理画面→外観→ウィジェットをクリック。
下記のような画面が表示される。

ウィジェット画面の不具合

以上の2つが当てはまる方は不具合が発生しています。
放置せずに修正を行いましょう。

スポンサーリンク

「cocoon」、「cocoon-master」2つの存在

なぜ親テーマが2つあるの?

不具合の原因
【親テーマ「cocoon」と「cocoon-master」2つ存在している状態】

なぜ、親テーマが2つになってしまったのか?
ConoHa WINGとどんな関係があるのでしょうか?

ConoHa WINGでcocoonをインストールした時は、「cocoon」と「cocoon-child」の組み合わせに設定されています。
WordPressでテーマの更新をしたことで、標準の「cocoon-master」が追加されたのです。

つまり、親テーマが「cocoon」と「cocoon-master」の2つ存在している状態

これから先もWordPressでテーマを更新することになりますので、不具合のまま使用せず修正作業をしていきましょう。

スポンサーリンク

親テーマをcocoon-masterに切り替え

sun
sun

どんな作業で修正するの?

べる
べる

「cocoon-child」が「cocoon」と紐づけされているので「cocoon-master」との紐づけに変更するよ。

作業前に必ずバックアップ

作業する前には必ず各データのバックアップを取りましょう。

1.WordPressデータのバックアップを取る。
2. Cocoon設定のバックアップ を取る。
3.Googleサーチコンソールやアナリティクスなどのコードをコピペしてメモ帳に保存する。

べる
べる

私は「UpdraftPlus」というプラグインを使って、WordPressデータのバックアップを取っています。

Cocoon設定のバックアップは、以下の設定はバックアップされないのでご注意ください。詳しくはこちら➡Cocoon設定のバックアップ

  • 吹き出し
  • テンプレート
  • アフィリエイトタグ
  • ランキング作成
  • アクセス集計

ConoHaファイルマネージャー確認

では詳しい手順の説明です。

①ConoHa WINGにログイン。

ConoHA WINGにログイン


②右上「ファイルマネージャー」をクリック。

「ファイルマネージャ―」をクリック。


③左側「public_html」をクリック。

④サイト名(ドメイン名)のフォルダをクリック。

⑤「wp-content」をクリック。

⑥「themes」をクリック。

ConoHaファイルマネージャー画面

cocoonに関するフォルダを3つ発見しました。

cocoon-childの紐づけを変更

①ファイルマネージャー左側「cocoon-child」をクリック。

②「style.css」をダブルクリックしてダウンロード

cocoon-childの変更


③ダウンロードした「style.css」をクリック。→「開く」をクリック。→「メモ帳」が開く。

④「Template」の「cocoon」を「cocoon-master」に書き換える
(書き換えたらメモ帳を上書き保存。)

「Template」の「cocoon」を「cocoon-master」に書き換える。
「Template」の「cocoon」を「cocoon-master」に修正。


⑤書き換えた「style.css」ファイルを「cocoon-child」フォルダにドラックアンドドロップ。

「style.css」ファイルをドラックアンドドロップ


⑥ファイルアップロード「上書きしますか?」→「はい」をクリック。

ファイルアップロード「上書きしますか?」→「はい」をクリック。

これで「cocoon-child」と「cocoon-master」の紐づけが完了です!

sun
sun

ここまでくればあと少し!頑張って!

「cocoon」フォルダを削除

「cocoon-child」と「cocoon-master」の紐づけが出来たので、「cocoon」フォルダを削除します。

①WordPress管理画面→外観→テーマをクリック。

②親テーマである「Cocoon」(新バージョン)を一度有効化する。

cocoon親テーマ2つ確認方法

sun
sun

2つあるよ!どっちが新バージョン?

それぞれの「Cocoon」をクリックしてください。
バージョンの数字が大きい方が今後使う新バージョンのCocoonです。
確認したら新バージョンの「Cocoon」を有効化します。(今回はバージョン2.3.5.1)

親テーマバージョン確認
親テーマ確認方法

③再度「Cocoon-child」を有効化する。

④ConoHa WINGに戻る。
先ほどと同様、ファイルマネージャーをクリック。
「public_html」→サイト名のフォルダ→「wp-content」→「themes」クリック。

⑤「cocoon」を選択しフォルダを削除。(右クリックで削除。)

「cocoon」を選択しフォルダを削除
「cocoon-child」と「cocoon-master」フォルダ。

「cocoon」のフォルダがなくなり「cocoon-child」と「cocoon-master」の2つになりました。

最終確認

さいごに確認作業です。

①親テーマである「Cocoon」が1つかどうか。

②子テーマである「Cocoon-child」が有効化になっているか。
(WordPress管理画面→外観→テーマをクリック。)

「Cocoon-child」が有効化になっているか確認。

注意:最終的に有効化するのは「Cocoon-child」です。
必ず「Cocoon-child」が有効化になっているか確認しましょう。

③ウィジェット編集画面が戻ったか。
( WordPress管理画面→外観 →ウィジェットをクリック。)

ウィジェット編集画面


④サイトを表示して変わった点はないか。
(Cocoon設定に変化が見られた場合はCocoon設定の復元方法をご参照ください。)

吹き出しアイコンが表示されない場合、こちらを試してみてください。
吹き出しの画像が表示されない不具合

sun
sun

吹き出し画像のURLを「cocoon」から「cocoon-master」に変更するといいんだね。べるは1個1個アイコン画像を入れ直したね・・・。

べる
べる

お疲れ様です!以上で作業終了です。

 

ConoHa WING×Cocoon修正のまとめ

さいごにおさらいです!

ConoHa WINGユーザーでCocoonの親テーマが2つある場合・ウィジェット画面がおかしい場合は、ConoHaファイルマネージャー内にある「cocoon-child」を「cocoon-master」と紐づけする。

ConoHa WINGはとても使いやすいのですが、WordPress更新時に今回のような不具合が発生するようです。
しかし、ConoHa WINGユーザーが様々な知識を持って親切・丁寧に教えてくれたり、記事にしてくれています。
ですので、私のような初心者でも続けていくことができています。(^-^)

私が今回の不具合に気づくことができたのも、先輩ユーザーさんのおかげでした。
今回ご紹介した方法とは違う方法 (Cocoonを一度削除して入れ直す方法) で修正されていますので、ご覧になってみてください。

私は過去に、WordPressを再インストールした経験から「再インストール」にトラウマがあり、別の方法を探しました(>_<)
参考記事 開始1週間でWordPressを再インストールした原因は?

色々な修正方法がありますので、ぜひご自身にあった方法で修正してみてください☆

追記:2021年11月、ConoHa公式サイトより今回の件について言及しています。

2021年11月22日以前にConoHaサイトでCocoonをインストールした場合。
提供元(cocoon-master)とは異なるディレクトリ名(cocoon)でインストールされていた。
そのため、ディレクトリの差し替え作業が必要。

公式サイトでは差し替え作業の手順が掲載されています。
本記事の方法でも、テーマ更新元となる親テーマを 「cocoon-master」に修正できること、子テーマの「cocoon-child」が親テーマの「cocoon-master」と紐づけされていることから問題はないのですが、心配であれば公式サイトの手順で修正することをおススメします。

作業前に必ずCocoon設定のバックアップを取る
Cocoon設定のバックアップ
作業が完了したら、Cocoon設定のバックアップを復元する。
Cocoon設定の復元方法

バックアップを取らないと、Cocoon設定が初期化されてしまいます。
ほかにも万が一に備えてWordPressデータのバックアップを取りましょう。
Googleサーチコンソールやアナリティクスなどのコードをコピペしてメモ帳に保存することも忘れずに!


初心者のつまずきを解消するお役に立てればと思い、今回の記事を書かせていただきました。
より良いサイトを構築できるよう、これからも皆さんのお役に立つ記事を更新していきたいと思います。

さいごまで読んでいただきありがとうございました!

あわせて読みたい 
無料独自SSLの有効期限を延長させる方法

【2022年版】アフィリエイト初心者におすすめ人気ASP4選

コメント

  1. さかもん より:

    本記事を参考にし、デザイン崩れが直りました!
    大変助かりました。

    • べる べる より:

      さかもんさん、デザインの崩れが修正できたなら良かったです。お役に立てて何よりです。
      コメントありがとうございます!励みになります!(^^)!

  2. 池やん より:

    いろんな記事があったのですが、こちらの記事が分かりやすく、すぐに解決ができました!
    テーマ2重問題に苦しんでましたので、助かりました~
    ありがとうございます!

    • べる べる より:

      池やんさん、コメントありがとうございます。
      Cocoon親テーマ問題は私も震えながら作業しました。無事解決するお役に立てたなら幸いです。
      ブログ運営一緒に頑張りましょう!

タイトルとURLをコピーしました