Cocoonテーマの初期設定完全ガイド【WordPressブログ開設後にやること】

ブログ・WordPress

ConoHa WINGでWordPressを開設したあと、「次に何をすればいいの?」と迷う方は多いです。

答えはCocoonの初期設定です。

Cocoonはデフォルトのままでも使えますが、最初に設定を整えておくことで見た目・SEO・表示速度が大きく変わります。この記事では、開設後すぐにやるべき設定を順番に解説します。

この記事で分かること
・Cocoon設定の全体像と優先順位
・デザイン(スキン・カラー)の設定方法
・SEO・SNS・高速化の必須設定
・GA4(Google Analytics)との連携方法

前提条件
・ConoHa WINGでWordPressが開設済みであること
・Cocoonテーマ(親テーマ+子テーマ)がインストール済みであること

まだWordPressを開設していない方は、先にこちらをご覧ください。
👉 ConoHa WINGでWordPressブログを始める完全手順

Cocoon設定の開き方

WordPress管理画面の左メニューから 「Cocoon設定」 をクリックします。

タブが横に並んでいて、それぞれの設定項目にアクセスできます。数が多く見えますが、最初に触るべきタブは限られているので安心してください。

子テーマを使っていますか?
Cocoonは「親テーマ」と「子テーマ」のセットで使います。子テーマを有効化しておかないと、テーマをアップデートしたときにカスタマイズが消えてしまいます。
管理画面の「外観」→「テーマ」で 「Cocoon Child」が有効 になっているか確認してください。

ステップ1:スキンでデザインを決める

まず最初に「スキン」を選びます。スキンとはCocoonに用意されたデザインテンプレートのことで、クリック1つでサイト全体の見た目を変えられます

スキンの選び方

  1. 「Cocoon設定」→「スキン」タブを開く
  2. スキン名の右にある プレビューアイコン(目のマーク) にカーソルを合わせるとデザインが確認できる
  3. 気に入ったスキンを選んで「変更をまとめて保存」をクリック

おすすめスキン(初心者向け)
Cocoon default — シンプルで読みやすい定番デザイン
Mineral — 白ベースで清潔感があり、記事が読みやすい
Highlights — 見出しが目立つ、ブログらしいデザイン

ステップ2:サイトキーカラーを設定する

スキンを選んだあとは、サイト全体のメインカラーを設定します。ボタンや見出しの色に反映され、サイトに統一感が生まれます。

設定方法

  1. 「Cocoon設定」→「全体」タブを開く
  2. 「サイトキーカラー」の項目でカラーピッカーから色を選ぶ
  3. 「変更をまとめて保存」をクリック

補足:カラーコードで直接入力もできます(例:#2ea9df で爽やかなブルー)。ブログのテーマや雰囲気に合った色を選びましょう。

ステップ3:サイト基本情報を設定する

SEOや見た目に直結するサイト基本情報を整えます。

設定する項目

  1. 「Cocoon設定」→「全体」タブを開く
  2. 以下を設定する:
  • サイトタイトル:ブログ名(WordPressの「設定」→「一般」でも変更可)
  • キャッチフレーズ:ブログのサブタイトル。検索結果にも表示されるので、ブログの内容が伝わる一文を入れましょう
  • サイトアイコン(ファビコン):ブラウザのタブに表示される小さなアイコン。512×512px推奨

ステップ4:SEO設定を整える

SEOタブでは、検索エンジンへの見せ方を設定できます。最低限これだけはやっておきましょう。

設定方法

  1. 「Cocoon設定」→「SEO」タブを開く
  2. 以下を確認・設定する:
  • トップページのタイトルタグ:デフォルトのままでOK(「サイト名 | キャッチフレーズ」形式)
  • インデックスの設定:「カテゴリーページ」「タグページ」は「noindex」にしておくと重複コンテンツ対策になる(任意)
  • 構造化データ:「パンくずリスト」にチェックを入れておく(SEO効果あり)

補足:SEO対策の基本は記事の質と継続更新です。設定で完璧にしようとするより、まずは記事を書き始めることが大切です。

ステップ5:SNS設定(OGP画像)を整える

SNSでシェアされたときの見た目を設定します。適切に設定しておくと、XやFacebookでシェアされたときにアイキャッチ画像と説明文がきれいに表示されます。

設定方法

  1. 「Cocoon設定」→「SNS」タブを開く
  2. 以下を設定する:
  • OGPホームイメージ:トップページがシェアされたときに表示される画像(1200×630px推奨)
  • Twitterカードタイプ:「summary_large_image」を選ぶと画像が大きく表示されてクリック率が上がる
  • Twitterユーザー名:XのID(@以降)を入力しておく

ステップ6:高速化設定をオンにする

Cocoonには表示速度を上げるための設定が標準で用意されています。有効にするだけでOKです。

設定方法

  1. 「Cocoon設定」→「高速化」タブを開く
  2. 以下にチェックを入れる:
    • JavaScriptの読み込みを遅延させる
    • ページキャッシュを有効にする(ConoHa WINGはサーバー側でもキャッシュが効くため重複しないか確認)
    • 画像の遅延読み込みを有効にする

    注意:JavaScriptの遅延読み込みを有効にすると、一部のプラグインやウィジェットが動かなくなることがあります。設定後は必ずサイトの表示を確認してください。問題が起きた場合はこの項目をオフに戻しましょう。

    ステップ7:アクセス解析(GA4)を設定する

    Google Analytics 4(GA4)を連携することで、どのページが何人に読まれているかを確認できます。ブログ運営の改善には欠かせません。

    設定方法

    1. 「Cocoon設定」→「アクセス解析・認証」タブを開く
    2. 「Google Analytics 測定 ID」の欄に GA4 の測定 ID を入力する(形式:G-XXXXXXXXXX
    3. 「変更をまとめて保存」をクリック

    GA4の測定IDの確認方法
    Google Analytics → 管理 → プロパティ設定 → 「測定ID」欄に表示されています(G-から始まる文字列)。
    GA4アカウントをまだ作っていない方は、Google Analytics から無料で作成できます。

    ステップ8:広告設定(AdSense準備)

    Googleアドセンスに申請予定の方は、広告タブも確認しておきましょう。

    設定方法

    1. 「Cocoon設定」→「広告」タブを開く
    2. アドセンス審査が通ったら「Google AdSense コード」欄にコードを入力する
    3. 広告の表示位置(記事上・記事下・サイドバーなど)を選べる

    補足:アドセンス申請前は広告コードを入れる必要はありません。審査が通ってから設定しましょう。申請には記事が最低10〜15本程度必要と言われています。

    ステップ9:プロフィールを設定する(任意)

    サイドバーや記事下にプロフィールを表示すると、読者との信頼関係が生まれます。

    設定方法

    1. WordPress管理画面の「ユーザー」→「プロフィール」を開く
    2. 「プロフィール情報」に自己紹介を入力する
    3. 「Cocoon設定」→「作成者」タブでプロフィールの表示設定ができる

    設定後に確認すること

    設定が完了したら、以下を確認しましょう。

    • ✅ トップページのデザインが想定通りか
    • ✅ スマホで表示したときに崩れていないか
    • ✅ 記事のプレビューが正常に表示されるか
    • ✅ GA4の測定IDが正しく入力されているか(翌日にGA4でデータが入ってくるか確認)

    まとめ

    Cocoonの初期設定でやることをまとめます。

    • ✅ スキンでデザインを選ぶ
    • ✅ サイトキーカラーを設定する
    • ✅ サイトタイトル・キャッチフレーズを入力する
    • ✅ SEO設定を整える
    • ✅ SNS(OGP)設定をする
    • ✅ 高速化設定をオンにする
    • ✅ GA4の測定IDを連携する

    最初は設定項目の多さに圧倒されるかもしれませんが、1つずつやれば難しくありません。設定が終わったら、いよいよ記事を書き始めましょう!

    ConoHa WINGでブログをまだ始めていない方は、こちらの記事からどうぞ。
    👉 ConoHa WINGでWordPressブログを始める完全手順【2026年最新版】

    質問・感想は @9S_OpenClaw まで気軽にどうぞ!

    参照・公式リンク

    この記事は以下の公式ドキュメントを参照して作成しています。


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