WordPressブログの初期設定は、サイト運営をスムーズに行うための重要なステップです。デザイン面でも、訪問者にとって見やすく、使いやすいサイト作りが求められます。本記事では、WordPressのデザイン設定に関する重要な手順を解説します。特に、固定ページやカテゴリーページの作成方法、メニューの作成、ウィジェットの配置に焦点を当て、ブログのデザインを整え、読者にとって便利で魅力的なサイト作りをサポートします。
WordPress初期設定（Cocoon）まとめ
- STEP①：基本設定
→ 詳しくは「WordPressの初期設定・手順①：基本設定」をご覧ください。 - STEP②：プラグイン
→ 詳しくは「WordPressの初期設定・手順②：プラグイン」をご覧ください。 - STEP③：デザイン← 本記事はこちらです
- STEP④：その他
→ 詳しくは「WordPressの初期設定・手順④：その他」をご覧ください。
1．固定ページの作成方法
WordPressでは、記事を作成する際に使用する「投稿」と、独立したページを作るための「固定ページ」の2種類があります。それぞれの役割を以下に説明します。
投稿
- 通常のブログ記事を作成するための機能です。
- 記事が時系列で一覧表示されます。
- カテゴリーやタグを使ってグループ分けができます。
固定ページ
- 更新頻度は少ないが重要な内容を掲載するページに適しています。
- 各ページが単体で独立しています。
必要な固定ページの作成
ブログ運営に欠かせない以下のページを、固定ページで作成します。
- プロフィールページ
- お問い合わせページ
- プライバシーポリシー/免責事項ページ（デフォルトで用意されているものは英語なので新たに作成します）
固定ページを作成する手順
固定ページの新規追加
- WordPress管理画面の「固定ページ」➡「固定ページ一覧」を開きます。
- 「新規固定ページを追加」をクリックします。
プロフィールページの作成
- タイトル欄に「プロフィール」と入力します。
- 固定ページの右側設定欄で「リンク」の部分を「profile」（半角英字）に変更します。
- 「下書き保存」をクリックします。
- 「公開」をクリックします。
ひとまず本文は空欄のままで構いません。「公開してよいですか？」の確認画面が出たら、再度「公開」をクリックしてください。
その他のページも同様に作成
「お問い合わせ」ページと「プライバシーポリシー/免責事項」ページも、同じ手順で作成します。それぞれ以下の設定を使用してください。
- お問い合わせ
- タイトル：お問い合わせ
- パーマリンク：contact
- プライバシーポリシー/免責事項
- タイトル：プライバシーポリシー/免責事項
- パーマリンク：privacy
以上で、必要な3つの固定ページが作成できました！
デフォルトの固定ページを削除
WordPressにはデフォルトで以下の固定ページが用意されていますが、不要なので削除しましょう。
- Sample Page
- Privacy Policy（下書き状態）
削除方法
- 固定ページ一覧で削除したいページにカーソルを合わせます。
- 表示されるメニューから「ゴミ箱へ移動」をクリックします。
お問い合わせページの設定
お問い合わせフォームの設置には、プラグイン「Contact Form 7」を使用します。以下の手順で設定してください。
プラグインの有効化（まだ有効化していない場合）
- 「プラグイン」→「インストール済みプラグイン」から「Contact Form 7」を有効化します。
固定ページへの反映
- 「お問い合わせ」➡「コンタクトフォーム」を開き、「コンタクトフォーム1」を選択します。
- 表示されるショートコードをコピーします。
- 作成したお問い合わせページに移動し、「ショートコードブロック」を追加してコピーしたコードを貼り付けます。
- 公開ボタンをクリックすれば設定完了です。
※フォームが正常に動作するか、テスト送信を行い確認しましょう
プライバシーポリシー/免責事項ページの編集
プライバシーポリシーの本文がまだ空なので、記事本文を追加しましょう
- 「固定ページ一覧」➡「プライバシーポリシー/免責事項」を開きます。
- 本文エリアに、プライバシーポリシーのテンプレートを貼り付けます。
- 記事内容を確認し、右上の「更新」ボタンをクリックしてください。
内容に不備がないか、公開後にページを確認しましょう。
各固定ページのURL
- プロフィールページ：https://（あなたのブログドメイン）/profile/
- お問い合わせページ：https://（あなたのブログドメイン）/contact/
- プライバシーポリシーページ：https://（あなたのブログドメイン）/privacy/
2．カテゴリーページの作成方法
カテゴリーを設定することで、投稿記事をグループ分けでき、読者が目的の記事を見つけやすくなります。
特にブログの発信テーマが明確な場合は、事前にカテゴリーを3〜5個程度に絞って作成しておくと便利です。
ただし、カテゴリーの設定は後から変更可能なので、最初は「方向性を決めながら進めよう！」くらいの気軽な気持ちで構いません。
カテゴリーの作成手順
- 「投稿」➡「カテゴリー」をクリックし、カテゴリー設定画面を開きます。
- 左側にある入力欄のうち、以下の項目を記入します：
- 名前：カテゴリーの名前を入力（例：「旅行」「グルメ」など）。
- スラッグ：カテゴリーのURLで使用する文字列を入力（例：「travel」「gourmet」など）。
※スラッグは、アルファベットの小文字とハイフン（-）で記載します。
- 入力が終わったら、画面下部にある「新規カテゴリーを追加」ボタンをクリックしてください。右側の「カテゴリー一覧」に新しいカテゴリーが追加されます。
カテゴリーページの生成
カテゴリーを作成すると、自動的にカテゴリーページが生成されます。
カテゴリーページのURLは以下の形式になります：https://（あなたのブログドメイン）/category/（スラッグ）
※このURLを使ってカテゴリーページを読者に案内できます。
デフォルトカテゴリー「uncategorized」の変更
初期設定では、投稿した記事は「uncategorized」というカテゴリーに分類されます。
このままだと見栄えが悪いので、以下の手順で名前を変更しましょう：
- カテゴリー一覧で「uncategorized」にマウスを合わせる。
- 表示されるメニューから「クイック編集」をクリック。
- 名前を「未分類」などの日本語に変更（スラッグはそのままでOK）。
- 「更新」ボタンを押して保存します。
💡 ポイント
- 1記事1カテゴリーが基本：同じ記事を複数のカテゴリーに分類すると混乱しやすいので注意しましょう。
- カテゴリーは柔軟に追加・変更可能：運営していく中で、必要に応じて編集していけば問題ありません。
カテゴリーの設定が完了したら、カテゴリーページを実際に開いて確認してみてください！
3．メニューの作成・配置方法
これまでの手順で「固定ページ」と「カテゴリーページ」を作成しました。
次に、それらのページへアクセスしやすくするために、「メニュー」を2つ作成して設置します。
作成するメニュー
- ヘッダーメニュー（ブログの上部に表示されるメニュー）
- フッターメニュー（ブログの最下部に表示されるメニュー）
ヘッダーメニューの作成方法
- 「外観」➡「メニュー」をクリックします。
- メニュー名を入力し、「ヘッダーメニュー」と「ヘッダーモバイルメニュー」にチェックを入れます。
- メニュー名は「ヘッダーメニュー」や「グローバルメニュー」といった、分かりやすい名前が一般的です。
- 入力が終わったら「メニューを作成」ボタンをクリックします。
- 表示させたい項目を選んで追加します。
- 画面左側にある「メニュー項目を追加」から、追加したい項目にチェックを入れ、「メニューに追加」をクリックします。
※「ホーム」ページを追加する場合は、「すべて表示」タブをクリックすると表示されます。
- 画面左側にある「メニュー項目を追加」から、追加したい項目にチェックを入れ、「メニューに追加」をクリックします。
💡 固定ページが表示されない場合
作成した固定ページがメニュー項目に表示されないときは、そのページが「下書き」の状態かもしれません。「公開」してから再度確認してください。
- メニュー項目を調整します。
- 追加した項目は右側の「メニュー構造」内に表示されます。
- 項目の順番を変更するには、項目をドラッグ＆ドロップで移動します。例えば、「ホーム」を一番上に配置できます。
- 項目を削除したい場合は、項目の右側にある「▼」をクリックして中身を開き、「削除」を選択します。
- メニューを保存します。
- 全ての項目を設定したら、画面右下の「メニューを保存」ボタンをクリックします。サイトを確認すると、ブログタイトルの下にメニューが表示されているはずです。
フッターメニューの作成方法
フッターメニュー（ブログの最下部）の作成手順は、基本的にヘッダーメニューと同じです。ただし、メニュー名は「フッターメニュー」に変更し、メニュー設定で「フッターメニュー」にチェックを入れる点が異なります。
💡 ポイント
- ヘッダーメニューはサイト全体のナビゲーションとして重要です。特に「ホーム」「プロフィール」「お問い合わせ」など、読者が頻繁にアクセスするページを配置すると良いでしょう。
- フッターメニューは補足的な情報を表示させるのに適しています。例えば、「利用規約」「プライバシーポリシー」などを追加すると便利です。
これでメニューの作成と配置が完了です！読者がスムーズにサイトを利用できるよう、必要なページを適切に配置しましょう。
4．ウィジェットの配置方法
ブログをパソコンで開いたとき、画面右側に表示されるエリアがサイドバーです。
ここでは、サイドバーを使いやすくカスタマイズし、ブログ運営に適したウィジェットを設置する方法を解説します。
不要なウィジェットを削除する
まずは、「サイドバー」と「サイドバースクロール追従」にデフォルトで設定されているウィジェットをすべて削除します。
- 「外観」➡「ウィジェット」をクリックします。
- 左側には「利用できるウィジェット」、右側には「ウィジェットエリア」が表示されます。
- 「サイドバー」および「サイドバースクロール追従」エリアにデフォルトで配置されているウィジェットをクリックし、表示される「削除」をクリックして空にします。
サイドバーにウィジェットを追加する
「サイドバー」を空にしたら、次に必要なウィジェットを追加していきます。
- 左側の「利用できるウィジェット」から「検索」を選びます。
- 設置可能なエリア一覧が表示されるので、「サイドバー」を選択し、「ウィジェットを追加」をクリックします。追加後は自動で反映されます（※保存ボタンは不要）。
- その他のウィジェットを追加します。同じ手順で、以下のウィジェットを順番に追加してください：
- [C]プロフィール
- [C]新着記事
- カテゴリー
追加したウィジェットは、サイドバー上でドラッグ＆ドロップで順番を並べ替えることも可能です。
サイドバースクロール追従に目次を追加する
次に、「サイドバースクロール追従」に目次ウィジェットを設置します。
- 左側の「利用できるウィジェット」から「[C]目次」を選びます。
- 設置可能なエリアから「サイドバースクロール追従」を選択し、「ウィジェットを追加」をクリックします。
💡 ポイント
目次を設置することで、長文の記事を読む際に読者が目的の見出しを探しやすくなります。
投稿本文上にプロフィールを追加する
最後に、「投稿本文上」にプロフィールウィジェットを追加します。
- 「利用できるウィジェット」から「[C]プロフィール」を選びます。
- 設置可能なエリアから「投稿関連記事上」を選び、「ウィジェットを追加」をクリックします。
💡 ポイント
このエリアにプロフィールを配置することで、読者が記事を読み終えた後に著者情報へアクセスしやすくなります。
プロフィールアイコンをカスタマイズする
プロフィールウィジェットの設定画面で、アイコンを円形に変更することで、より見栄えの良いデザインに仕上げることができます。
これで、サイドバーやその他のエリアにウィジェットを適切に配置する方法が完了しました。
ブログ全体の使いやすさや見やすさを向上させるため、読者にとって便利なウィジェットを積極的に活用してみましょう！
まとめ
- 固定ページの作成と公開
- カテゴリーページの作成
- メニューの作成
- ウィジェットの配置
これでWordPress初期設定・手順③は完了です。お疲れ様でした！次回は、手順④のその他設定について紹介します。
