ConoHaとWordPressでブログを立ち上げ、Cocoonを調整した手順まとめ

2. テーマをCocoonに変更

標準テーマから無料・高機能・軽量なCocoonに変更しました。外観 > テーマからCocoonを有効化し、外観 > カスタマイズで配色やロゴ、レイアウトを調整しました。初期設定時に間違えて削除してしまった場合はCocoonのサイトにてダウンロードを行いテーマのアップロードから再度追加することができます。

▲ ページ上部へ

3. 新着記事のレイアウト調整（Gridで1と3を縦に）

新着記事を「1の下に3、2の下に4」と縦並びにしたい場合、CSS Gridで並び順を強制すると整います。以下は概念的なCSS。

.posts-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, auto);
  gap: 20px;
}
.post-card:nth-child(1) { grid-column: 1; grid-row: 1; }
.post-card:nth-child(2) { grid-column: 2; grid-row: 1; }
.post-card:nth-child(3) { grid-column: 1; grid-row: 2; }
.post-card:nth-child(4) { grid-column: 2; grid-row: 2; }

スマホでは1列にしたい場合は、@media (max-width: 768px)でgrid-template-columns: 1fr;に切り替えます。見出しの青ラインはh2{border-left:5px solid #4cafef; padding-left:10px;}で再現できます。

▲ ページ上部へ

4. 固定ページをトップページに設定

1. 管理画面 → 設定 > 表示設定
2. 「ホームページ」を固定ページに変更

これで記事一覧ではなく、自由に作った固定ページをサイトのトップとして表示できます。

▲ ページ上部へ

5. お問い合わせページの作成（Contact Form 7）

1. プラグイン「Contact Form 7」をインストールして有効化
2. お問い合わせ > 新規追加でフォームを作成
   例：名前（必須）／メール（必須）／件名／本文
3. 発行されたショートコードを固定ページに貼り付けて公開
4. フッターやメニューから該当ページへリンク

▲ ページ上部へ

6. プライバシーポリシーの作成ポイント

アドセンスやアフィリエイト、アクセス解析を使うなら必須。以下の項目を盛り込み、固定ページで公開します。

• 収集する情報と利用目的（お問い合わせ時の氏名・メールなど）
• Cookieの利用、Googleアナリティクス等のツール利用
• 広告配信（例：Google AdSense）のクッキー利用について
• 免責事項・著作権・リンクポリシー・問い合わせ窓口

公開後はフッターやヘッダーメニューから常時アクセスできるようリンクを配置します。

▲ ページ上部へ

7. 今後の改善予定

• カテゴリ別の導線最適化、サイドバー整理（プロフィール・人気記事）
• フォントや配色、余白の微調整で可読性アップ
• Search Console / GA4 導入と検索クエリ分析
• 広告・アフィリエイトの配置と表示速度の両立

▲ ページ上部へ

8. まとめ

ConoHaでWordPressを立ち上げ、Cocoonを導入して基本の見せ方を整えました。
新着記事の縦並び（1の下に3）など、細かいUIはCSSでコントーロールできます。
固定ページをトップに据え、お問い合わせとプライバシーポリシーを整備すればブログの土台は完成です。
CSSでのレイアウト編集と記事の投稿などを行っていきます。

▲ ページ上部へ