AFFINGER7の管理画面の初期設定ガイド｜導入後にやるべき設定

こんにちは "osaboo"です。"@osaboo_Bot"

AFFINGER7をインストールしたけど、「どこから設定すればいいの？」「AFFINGER管理には設定項目が多くてよくわからない…」という方も多いのですよね。

AFFINGER7の管理画面には、サイト全体のデザインやトップページ、メニュー、記事、SNS、SEOなど、さまざまな設定項目があります。

ただし、最初からすべての項目を細かく設定する必要はありません。

この記事では、AFFINGER7を導入したあとに確認しておきたい設定を、おすすめの順番に沿ってわかりやすく解説します。

この記事で解決できる悩み

この記事では、これらのお悩みを解決します。

この記事では、AFFINGER7の管理画面を中心に、「まず何を設定するか」→「どこを設定するか」→「詳しい設定方法」の順番で紹介します。

なお、各項目の詳しい設定方法については、必要に応じて個別記事もあわせて紹介していきます。

「まずはブログを始めたい！」という方は、『WordPressブログ完全ガイド』をご覧ください。
開設から運営・収益化までを初心者向けに画像付きでわかりやすく解説しています。

AFFINGER7の管理画面とは？

AFFINGER7では、WordPress管理画面に追加される「AFFINGER管理」から、サイト全体に関わるさまざまな設定を行えます。

たとえば、サイト全体のレイアウトやデザイン、トップページ、投稿・固定記事、SNS関連、SEO関連などを設定できます。

また、AFFINGER7のカスタマイズでは、WordPressの「外観 → カスタマイズ」からデザインやカラー、ヘッダーなどを細かく調整できます。

そのため、AFFINGER7の設定を始める前に、

• AFFINGER管理
• Gutenberg設定
• 外観 → カスタマイズ

の役割をざっくり把握しておくと、設定で迷いにくくなります。

AFFINGER7公式マニュアルでも、レイアウト、メニュー、ウィジェット、投稿・固定ページなど、それぞれの設定が分けて案内されています。

AFFINGER7を導入したら最初に確認すること

AFFINGER7を有効化したら、いきなり細かなデザイン設定を始めるのではなく、まずWordPress側の基本設定とAFFINGER7の管理画面を確認しましょう。

WordPressの基本設定を確認する

まずは、WordPressの基本情報を確認します。

サイトタイトルやキャッチフレーズ、サイトアドレス、サイトアイコンなど、サイト運営の基本となる項目を設定しておきます。

特にサイトタイトルやキャッチフレーズは、サイトの基本情報として重要なので、AFFINGER7の設定を始める前に確認しておきましょう。

AFFINGER管理を開く

次に、WordPress管理画面から「AFFINGER管理」を開きます。

AFFINGER管理には、以下のような設定項目があります。

• 設定ナビ
• 全体設定
• トップ / 記事一覧
• メニュー
• ヘッダー（ナビ / 画像）
• 投稿・固定記事
• サブエリア / おすすめ
• SNS / OGP
• SEO
• Google・広告
• 会話アイコン
• その他

ここでは、AFFINGER7独自の機能やサイト全体に関わる設定を行います。

今回の記事では、ここから以下の順番で設定を進めていきます。

1. 全体設定
2. トップページ / 記事一覧
3. メニュー
4. ヘッダー（ナビ / 画像）
5. 投稿・固定記事
6. SNS / OGP
7. SEO

この順番で進めることで、サイト全体の基本設定から個別の表示設定、SNSやSEO関連の設定まで、順序よく確認できます。

Gutenberg設定を確認する

AFFINGER7では、ブロックエディター（Gutenberg）を使って記事を作成します。

「AFFINGER管理」とは別に、Gutenberg関連の設定も用意されています。

たとえば、記事作成時のブロックの余白など、記事を書くときの表示や使い勝手に関わる設定を変更できます。

ただし、これらはサイトの基本設定を終えてから必要に応じて調整すれば問題ありません。

まずは「AFFINGER管理」の基本設定を優先しましょう。

カスタマイザーを確認する

サイトのデザインを細かく調整するときは、WordPress管理画面の「外観 → カスタマイズ」を使用します。

AFFINGER7では、カスタマイザーからヘッダー、メニュー、カラー、記事エリアなど、サイトの見た目を細かくカスタマイズできます。

「AFFINGER管理」と「カスタマイザー」は設定する場所が異なるため、最初は混乱しやすい部分です。

ざっくり分けると、

AFFINGER管理 → 機能やサイト全体に関わる設定

カスタマイザー → デザインや表示を細かく調整する設定

と考えておくとわかりやすいです。

❶ 「全体設定」で表示内容を確認する

まずは、AFFINGER7の基本となる「全体設定」から確認します。

「全体設定」では、サイト全体のデザインやレイアウト、カラー、記事一覧の表示など、AFFINGER7の基本的な設定をまとめて行えます。

AFFINGER7をインストールした直後は設定項目が多く感じますが、最初からすべてを変更する必要はありません。

まずは、サイト全体の見た目とレイアウトに関係する項目を中心に確認しましょう。

「全体設定」の設定を確認する

WordPress管理画面から、「AFFINGER管理」→「全体設定」をクリックします。

「全体設定」には、サイトのデザインやレイアウトに関するさまざまな項目が用意されています。

AFFINGER7では、ここで設定した内容をベースに、後から「外観 → カスタマイズ」で細かなデザインを調整できます。

カラーパターンを設定する

「全体設定」の「カラーパターン」では、サイト全体の基本となるカラーを設定できます。

AFFINGER7には複数のカラーパターンが用意されているため、サイトのイメージに合ったパターンを選択します。

ブログをこれから作り始める場合は、まず好みのカラーパターンを選択しておきましょう。

なお、カラーパターンはあくまでサイト全体のカラー設定のベースです。

あとからカスタマイザーの「全体カラー設定」を使って、「キー・メイン・サブ・テキスト・アクセント」カラーなどを細かく調整できます。

デザインパターンを設定する

「デザインパターン」では、サイト全体の基本となるデザインを選択できます。

カラーパターンと同様に、AFFINGER7のデザインを決めるベースとなる設定です。

公式マニュアルでも、「全体設定」の「デザインパターン」と「カラーパターン」で基礎となるデザインとカラーを決め、その後カスタマイザーで細かな調整を行う方法が案内されています。

サイトをこれから作る場合は、プレビューを確認しながら好みのデザインパターンを選択してください。

サイトの幅を確認する

「全体設定」では、サイト全体の表示幅に関する設定も確認できます。

サイト幅は、記事本文やサイドバーなどを含めたページ全体の横幅を決める重要な項目です。

ただし、AFFINGER7を導入したばかりの段階では、無理に変更する必要はありません。

まずはデフォルト設定のままサイトを作成し、実際の表示を確認してから調整するのがおすすめです。

特にサイト幅を変更すると、記事本文の見え方やサイドバーとのバランスも変わります。

最初はデフォルト値を基準にして、必要になったときに変更しましょう。

サイト全体のレイアウトを確認する

続いて、サイト全体のレイアウトを確認します。

AFFINGER7では、サイトを大きく、

• 1カラム
• LP
• 2カラム（リセット）

などのレイアウトに設定できます。

一般的なブログであれば、まずは2カラム（リセット）を基本にすると使いやすいです。

2カラム（リセット）では、記事を表示するメインエリアの右側にサイドバーが表示されます。

ブログのカテゴリーやプロフィール、検索、広告などをサイドバーに配置したい場合にも使いやすいレイアウトです。

なお、レイアウトは「全体設定」だけでなく、トップページや投稿・固定ページごとに変更できます。

そのため、最初はサイト全体の基本レイアウトだけ決めておき、必要になったら個別ページで調整すれば問題ありません。

記事一覧の表示を確認する

「全体設定」には、トップページやアーカイブなどの記事一覧に関係する設定もあります。

記事一覧では、記事タイトルやアイキャッチ画像、抜粋などの表示方法を設定できます。

AFFINGER7では、記事一覧のデザインやサムネイル表示などを細かく調整できます。

ただし、記事をまだ公開していない段階では表示を確認しにくいため、ここも最初から細かく設定する必要はありません。

まずは記事をいくつか作成し、実際の一覧表示を確認してから調整すると効率的です。

「Save」で設定を保存する

設定を変更したら、画面下部にある「Save」をクリックして保存します。

AFFINGER7のテーマ管理では、複数の「Save」ボタンがありますが、どの「Save」ボタンを押しても設定全体に反映されます。

設定を変更したら、保存することを忘れないようにしましょう。

全体設定は最初に細かく設定しすぎない

AFFINGER7の「全体設定」には非常に多くの項目があります。

しかし、初期設定の段階ですべてを変更すると、かえって設定が複雑になってしまいます。

最初は、

• カラーパターン
• デザインパターン
• サイト全体のレイアウト
• サイト幅

など、サイト全体に影響する項目を中心に確認しておけば十分です。

その後、実際にサイトを表示しながら、必要な項目だけ細かく調整していきましょう。

また、AFFINGER7公式マニュアルでは、設定できない項目がある場合、関連する上位項目を先に有効化して保存することで選択できるようになるケースも案内されています。

全体設定のおすすめ設定

AFFINGER7を初めて使う場合は、以下を目安に設定すると進めやすいです。

設定項目	おすすめ
カラーパターン	好みのカラーを選択
デザインパターン	好みのデザインを選択
サイト全体のレイアウト	2カラム（リセット）を基本に設定
サイト幅	まずはデフォルト
記事一覧	まずはデフォルトで確認
その他の詳細設定	必要になってから設定

「とりあえずブログを使える状態にする」ことを優先するなら、細かな設定は後回しでOKです。

関連記事
「全体設定」の詳しい設定方法については、以下の記事で解説しています。

❷ 「トップページ / 記事一覧」で表示内容を確認する

「全体設定」でサイト全体の基本設定を確認したら、次にトップページの表示内容を確認します。

トップページは、サイトを訪れたユーザーが最初に目にするページです。

AFFINGER7では、「AFFINGER管理」の「トップページ / 記事一覧」から、トップページの記事一覧やレイアウト、コンテンツの表示などを設定できます。

ただし、ここもすべての項目を最初から変更する必要はありません。

まずは、トップページがどのような構成になっているのかを確認し、必要な部分だけ設定するのがおすすめです。

「トップページ」の設定を確認する

WordPress管理画面から、「AFFINGER管理」→「トップページ / 記事一覧」をクリックします。

「トップページ / 記事一覧」には、トップページの表示方法に関するさまざまな設定項目があります。

ここでは、サイトのトップページに表示するコンテンツや記事一覧などを確認していきます。

トップページにコンテンツを追加する

AFFINGER7では、トップページに記事一覧だけでなく、独自のコンテンツを追加することもできます。

たとえば、

• サイトの紹介
• おすすめ記事
• カテゴリーへの案内
• 特定の記事へのリンク
• サイト運営者の紹介

などを配置できます。

ただし、ブログを始めたばかりの段階で無理にコンテンツを増やす必要はありません。

まずは、ユーザーが目的の記事へたどり着きやすい構成を意識しましょう。

記事数が増えてきたら、アクセスしてほしい記事やカテゴリーをトップページに掲載すると、サイト内の回遊にもつなげやすくなります。

トップページのレイアウトを確認する

次に、トップページのレイアウトを確認します。

サイト全体を2カラムにしている場合でも、トップページだけ異なるレイアウトにすることができます。

たとえば、トップページを、

• 記事一覧中心のブログ型
• サイドバーを表示する2カラム
• サイドバーを表示しない1カラム
• コンテンツを自由に配置するトップページ

など、サイトの目的に合わせて構成できます。

一般的なブログであれば、まずは記事一覧を中心としたシンプルな構成にしておくと管理しやすいです。

トップページを作り込むのは、記事数が増えてからでも問題ありません。

トップページの記事一覧を確認する

まず確認したいのが、トップページに表示される記事一覧です。

ブログ型のサイトでは、トップページに新着記事を一覧表示する構成が一般的です。

AFFINGER7では、トップページの記事一覧について、表示件数や表示方法などを設定できます。

記事を公開したときに、トップページへ新しい記事が表示されるかどうかも確認しておきましょう。

特にブログを開設したばかりの場合は、まだ記事数が少ないため、設定を細かく変更するよりも、記事を公開したあとに実際の表示を確認するほうがわかりやすいです。

トップページに固定ページを使用する場合

トップページをブログの記事一覧ではなく、オリジナルの固定ページとして作成することもできます。

この場合は、WordPressの表示設定でホームページに使用する固定ページを指定します。

WordPress管理画面から、「設定」→「表示設定」を開き、「ホームページの表示」を確認します。

「固定ページ」を選択した場合は、ホームページに表示する固定ページを指定します。

トップページを自由にデザインしたい場合には便利な方法ですが、通常のブログとして運営する場合は、最初から固定ページ化する必要はありません。

まずは記事一覧を表示する一般的なブログ構成から始めても十分です。

トップページを確認する

設定を変更したら、実際のトップページを表示して確認します。

WordPress管理画面からサイトを表示し、

• サイトタイトルが正しく表示されているか
• ヘッダーが意図した状態になっているか
• 記事一覧が表示されているか
• サイドバーが表示されているか
• アイキャッチ画像が適切に表示されているか
• スマートフォンでも見やすいか

をチェックしましょう。

設定画面だけを見て判断するのではなく、実際のサイトを表示して確認することが大切です。

トップページは最初から作り込みすぎなくてOK

AFFINGER7にはトップページを細かくカスタマイズできる機能があります。

しかし、サイトを立ち上げたばかりなら、最初から完璧なトップページを作る必要はありません。

まずは、

「サイトの目的がわかる」

「読みたい記事を見つけやすい」

「カテゴリーや主要コンテンツへ移動しやすい」

という基本を意識しましょう。

記事が増えてきたら、アクセスの多い記事や読んでほしい記事を目立たせるなど、少しずつトップページを改善していけばOKです。

トップページのおすすめ設定

AFFINGER7を導入したばかりなら、以下を目安に設定すると進めやすいです。

設定項目	初期設定のおすすめ
記事一覧	新着記事を表示
レイアウト	シンプルな構成
サイドバー	必要に応じて表示
独自コンテンツ	必要になってから追加
固定ページ型トップページ	必要な場合のみ使用
詳細なデザイン	後から調整

トップページは、「最初から完成させる」のではなく、記事を増やしながら改善していくのがおすすめです。

関連記事
「トップページ」の詳しい設定方法については、以下の記事で解説しています。

❸「メニュー」で表示内容を確認する

AFFINGER7の「メニュー」では、グローバルメニューなどのメニュー表示に関する設定を行います。

WordPress側で作成したメニューを、AFFINGER7のサイト上でどのように表示するかを設定する項目です。

初期設定では、まず現在のメニュー設定を確認し、サイトのデザインや構成に合わせて必要な項目だけ調整しましょう。

「メニュー」の設定を確認する

WordPress管理画面から、「AFFINGER管理」→「メニュー」を開きます。

「メニュー」では、AFFINGER7で使用するメニューの表示に関する設定を確認できます。

ここでは、サイトのグローバルメニューをどのように表示するかを確認し、必要に応じて設定を変更します。

WordPressのメニュー設定とは役割が違う

ここで確認しておきたいのが、WordPress側のメニュー設定とAFFINGER管理の「メニュー」は役割が異なるという点です。

WordPress側では、メニューを作成し、固定ページやカテゴリーなどの項目を追加したり、表示順を変更したりします。

一方、AFFINGER管理の「メニュー」では、作成したメニューをサイト上でどのように表示するかを設定します。

つまり、

• WordPress側 → メニューの内容を作る
• AFFINGER管理 → メニューの表示を設定する

というように、それぞれ役割が分かれています。

関連記事
メニューの作成や項目の追加・並び替えなど、WordPress側とAFFINGER管理の詳しい設定方法については、以下の記事で解説しています。

初期設定では必要な項目だけ確認する

AFFINGER7の「メニュー」には複数の設定項目がありますが、最初からすべてを細かく変更する必要はありません。

まずは、グローバルメニューが正しく表示されているかを確認しましょう。

特に、サイト全体のカラーやヘッダーのデザインを設定している場合は、メニューのデザインがサイト全体と合っているかも確認しておきます。

設定を変更する場合は、実際のサイトを表示しながら調整すると、変更後のイメージを確認しやすくなります。

グローバルメニューの表示を確認する

初期設定が終わったら、実際のサイトを開いてグローバルメニューの表示を確認します。

チェックするポイントは次のとおりです。

• メニューが意図した位置に表示されている
• メニュー項目が正しく表示されている
• サイト全体のデザインと合っている
• 文字や背景の表示に違和感がない
• メニューをクリックすると正しいページへ移動できる

メニューの内容そのものはWordPress側で管理するため、ここではAFFINGER7での表示状態を確認することを優先します。

スマートフォンの表示も確認する

メニューはパソコンだけでなく、スマートフォンでの表示も確認しておきましょう。

スマートフォンでは画面幅が狭くなるため、パソコンとは異なる形でメニューが表示されます。

特に、

• メニューが正常に開く
• 項目が見切れていない
• タップしやすい
• サブメニューが正常に操作できる
• ヘッダーとの表示に問題がない

といった点を確認します。

パソコンで問題がなくても、スマートフォンでは表示や操作性に違いが出ることがあります。

メニューのデザインはサイト全体に合わせる

グローバルメニューは、サイトを訪れたユーザーが最初に目にする部分のひとつです。

そのため、メニューだけを個別にデザインするのではなく、サイト全体のカラーやヘッダーとの統一感を意識しましょう。

たとえば、サイト全体で使用しているキーカラーやアクセントカラーに合わせると、ページ全体にまとまりが出ます。

ただし、初期設定の段階でデザインを細かく作り込む必要はありません。

まずは基本的な表示を整え、実際にサイトを運営しながら必要に応じて調整していきましょう。

初期設定で確認しておきたいポイント

AFFINGER7を導入した直後は、次の項目を確認しておけば十分です。

確認項目	初期設定の目安
メニューの表示	正しく表示されているか確認
メニュー項目	必要な項目が表示されているか確認
表示位置	意図した位置になっているか確認
デザイン	サイト全体のカラーに合わせる
PC表示	表示・リンクを確認
スマホ表示	表示・操作性を確認
細かなカスタマイズ	必要になってから調整

AFFINGER7の管理画面では、すべての項目を最初から変更する必要はありません。

まずはメニューが正常に表示される状態を作り、細かなデザインはサイト全体を整えながら調整するのがおすすめです。

関連記事
AFFINGER管理の「メニュー」の詳しい設定方法については、以下の記事で解説しています。

❹ 「ヘッダー（ナビ / 画像）」で表示内容を確認する

メニューの設定が終わったら、次にヘッダーの表示を確認します。

ヘッダーは、サイトの上部に表示されるエリアです。

サイトタイトルやロゴ、グローバルメニューなどが表示されるため、ユーザーがサイトの内容を把握するうえでも重要な部分です。

AFFINGER7では、ヘッダーに関する設定を「AFFINGER管理」から確認できます。

「ヘッダー（ナビ / 画像）」の設定を確認する

WordPress管理画面から、「AFFINGER管理」→「ヘッダー（ナビ / 画像）」をクリックします。

ここでは、ヘッダーに表示するナビゲーションや画像などに関する設定を確認できます。

❸の「メニュー」で作成したグローバルメニューも、ここで表示状態を確認していきます。

ヘッダーの表示を確認する

まずは、現在のヘッダーがどのように表示されているか確認します。

サイトを表示して、

• サイトタイトルやロゴが表示されているか
• グローバルメニューが表示されているか
• ヘッダーの高さが適切か
• メニューが見やすいか
• スマートフォンでも正常に表示されるか

をチェックしましょう。

AFFINGER7を導入した直後は、デフォルト設定のままでも基本的なヘッダーは表示されます。

そのため、最初から細かな設定を変更する必要はありません。

ヘッダー画像を設定する

ヘッダーに画像を表示したい場合は、ヘッダー画像に関する設定を確認します。

サイトのイメージに合わせて、オリジナル画像を設定することもできます。

たとえば、

• ブログのロゴ
• サイトのメインビジュアル
• ブランドイメージを表す画像

などを使用できます。

ただし、ブログを開設したばかりなら、無理にヘッダー画像を設定する必要はありません。

画像を追加するとサイトの印象を大きく変えられる一方で、画像サイズによってはヘッダーが大きくなり、コンテンツが下に押し下げられることがあります。

必要性を考えてから設定するのがおすすめです。

ロゴを設定する

サイト独自のロゴを使用したい場合は、ロゴ画像を設定します。

ロゴを設定すると、テキストだけのサイトタイトルよりもサイトのブランドを表現しやすくなります。

ただし、ロゴ画像を用意していない場合は、無理に作成する必要はありません。

まずはサイトタイトルを表示した状態で運営を始め、サイトの方向性が固まってからロゴを用意しても問題ありません。

グローバルメニューの表示を確認する

❸で設定したグローバルメニューが、ヘッダーに正しく表示されているか確認します。

ここでは、メニューそのものを作り直すのではなく、ヘッダー上での表示状態を確認するという考え方で進めるとわかりやすいです。

たとえば、

• メニュー設定 → メニュー項目を作成・並び替え
• ヘッダー設定 → 作成したメニューをサイト上で見やすく表示

という役割分担です。

ヘッダーをシンプルにする

ブログを始めたばかりなら、ヘッダーはできるだけシンプルにしておくのがおすすめです。

サイトタイトルやロゴ、グローバルメニューなど、ユーザーが必要とする情報を中心に配置しましょう。

ヘッダーに多くの画像やボタン、情報を詰め込みすぎると、かえってサイトが見づらくなることがあります。

特にスマートフォンでは表示できる幅が限られるため、パソコンだけでなくスマートフォンでの見え方も確認してください。

スマートフォン表示を確認する

ヘッダーを設定したら、スマートフォンでの表示も必ず確認しましょう。

チェックするポイントは、

• ロゴやサイトタイトルが見切れていないか
• メニューが正常に開くか
• ナビゲーションが操作しやすいか
• ヘッダーが必要以上に大きくなっていないか
• 本文を読み始めるまでに余計なスペースがないか

などです。

特にヘッダー画像を設定した場合は、パソコンとスマートフォンで表示サイズが変わるため、実際の画面で確認しておきましょう。

ヘッダーは後から変更できる

ヘッダーはサイト運営を始めたあとでも簡単に変更できます。

そのため、AFFINGER7を導入した直後は、最低限の表示だけ整えておけば十分です。

まずは、「サイトタイトルまたはロゴ」＋「グローバルメニュー」というシンプルな構成からスタートするとよいです。

サイトのデザインが決まってきたら、ヘッダー画像やカラー、メニューの表示方法などを細かく調整していきます。

ヘッダー設定のおすすめ

AFFINGER7を導入したばかりなら、以下を目安に設定しましょう。

設定項目	初期設定のおすすめ
サイトタイトル	表示を確認
ロゴ	必要に応じて設定
ヘッダー画像	必要な場合のみ設定
グローバルメニュー	表示を確認
ヘッダーのデザイン	シンプルな構成がおすすめ
スマートフォン表示	必ず確認

ヘッダーはサイトの第一印象を左右する部分ですが、最初から完璧に作り込む必要はありません。

まずはユーザーがサイト内を迷わず移動できる状態にしておきましょう。

関連記事
「ヘッダー（ナビ / 画像）」の詳しい設定方法については、以下の記事で解説しています。

❺ 「投稿・固定記事」で表示内容を確認する

ヘッダーの設定が終わったら、次に投稿ページと固定ページの表示を確認します。

「投稿・固定記事」では、ブログ記事や固定ページに関するさまざまな表示設定を行えます。

記事タイトルやアイキャッチ画像、投稿日、更新日、関連記事など、記事ページの見え方に関係する項目が用意されています。

ここも設定項目が多いため、最初からすべてを変更する必要はありません。

まずは、記事を公開したときに必要な情報が正しく表示される状態にしておきましょう。

「投稿・固定記事」の設定を確認する

WordPress管理画面から、「AFFINGER管理」→「投稿・固定記事」をクリックします。

表示された設定画面から、投稿ページと固定ページの基本的な表示を確認します。

投稿ページの表示を確認する

まずは、通常のブログ記事である「投稿」の表示を確認します。

記事ページでは、主に以下のような情報が表示されます。

• 記事タイトル
• カテゴリー
• タグ
• 投稿日
• 更新日
• アイキャッチ画像
• SNSボタン
• 関連記事
• サイドバー

これらの表示・非表示を、AFFINGER7の設定から調整できます。

ただし、すべてを表示すればよいわけではありません。

読者にとって必要な情報を残し、不要な情報は表示しないようにすると、すっきりした記事ページになります。

投稿日・更新日の表示を確認する

ブログ記事では、投稿日や更新日を表示するかどうかも確認しておきましょう。

特に、情報を更新しながら運営するブログでは、更新日を表示しておくと記事がいつ更新されたのかを読者が確認しやすくなります。

一方、内容によっては投稿日だけで十分なケースもあります。

自分のブログの運営方法に合わせて設定してください。

アイキャッチ画像の表示を確認する

投稿ページでは、記事のアイキャッチ画像を表示するかどうかも確認します。

アイキャッチ画像は、記事の内容を視覚的に伝えるだけでなく、記事一覧やSNSなどでも利用される重要な画像です。

ブログを運営するのであれば、基本的にはアイキャッチ画像を設定する運用がおすすめです。

ただし、記事ページの先頭にアイキャッチ画像を大きく表示するかどうかは、サイトのデザインに合わせて決めれば問題ありません。

SNSボタンの表示を確認する

AFFINGER7では、記事ページにSNSシェアボタンを表示できます。

SNSボタンを表示すると、読者が記事をSNSで共有しやすくなります。

ただし、利用していないSNSまで表示すると、ボタンが増えて記事ページが見づらくなる場合があります。

そのため、実際に利用しているSNSや、読者が利用しそうなSNSに絞るとよいです。

SNS関連の設定については、この後の「SNS / OGP」で詳しく確認します。

関連記事の表示を確認する

記事の下部などに表示される「関連記事」も確認しておきましょう。

関連記事を表示すると、読者が現在読んでいる記事から関連する別の記事へ移動しやすくなります。

これはサイト内の回遊を促すうえでも重要な要素です。

記事数が少ないうちは表示できる関連記事も限られますが、記事が増えてきたらサイト内の導線として役立ちます。

固定ページの表示を確認する

続いて、固定ページの表示を確認します。

固定ページは、

• プロフィール
• お問い合わせ
• プライバシーポリシー
• サイトについて

など、通常のブログ記事とは異なるページに使用します。

固定ページでは、投稿ページとは必要な表示が異なる場合があります。

たとえば、プロフィールページやお問い合わせページでは、関連記事や投稿日などを表示する必要がないケースもあります。

そのため、投稿と固定ページを同じ表示にする必要はありません。

投稿ページと固定ページを使い分ける

初めてWordPressを使う場合は、「投稿」と「固定ページ」の違いがわかりにくいかもしれません。

簡単に分けると、

投稿 → ブログ記事など、継続的に追加していくコンテンツ

固定ページ → プロフィールやお問い合わせなど、独立したページ

と考えるとわかりやすいです。

AFFINGER7の「投稿・固定記事」では、それぞれの表示をサイトの構成に合わせて調整できます。

記事ページはシンプルにする

初期設定では、記事ページに多くの情報を詰め込みすぎないことも大切です。

記事本文を読むことが目的なので、「記事本文が読みやすいか」を基準に表示項目を決めましょう。

特に、

• SNSボタン
• 関連記事
• 広告
• バナー
• サイドバー

などを大量に表示すると、記事本文よりも周辺情報が目立ってしまうことがあります。

最初は必要最低限の表示にして、サイトを運営しながら調整するのがおすすめです。

記事を公開して表示を確認する

設定が終わったら、実際に記事を1つ公開して表示を確認してみましょう。

確認するポイントは、

• 記事タイトルが正しく表示されているか
• アイキャッチ画像が意図した位置に表示されているか
• 投稿日・更新日が適切に表示されているか
• SNSボタンが必要な場所に表示されているか
• 関連記事が表示されているか
• サイドバーとのバランスが悪くないか
• スマートフォンでも読みやすいか

などです。

設定画面だけでは実際の見え方がわかりにくいため、記事を表示して確認することが大切です。

投稿・固定記事のおすすめ設定

AFFINGER7を導入したばかりなら、以下を目安に確認するとよいです。

設定項目	初期設定のおすすめ
投稿日	必要に応じて表示
更新日	表示がおすすめ
アイキャッチ画像	使用する
SNSボタン	必要なSNSのみ表示
関連記事	表示がおすすめ
固定ページ	ページの目的に合わせて調整
その他の詳細設定	必要になってから変更

ここでも、最初から完璧な設定を目指す必要はありません。

実際に記事を書いて表示を確認しながら、自分のサイトに合う形へ調整していきましょう。

❻ 「SNS / OGP」で表示内容を確認する

記事ページの表示を確認したら、次にSNS / OGPの設定を確認します。

SNS / OGPでは、記事をSNSでシェアしたときの表示や、記事ページに表示するSNSボタンなどを設定できます。

AFFINGER7公式マニュアルでも、SNSボタンの基本設定やOGP設定は「AFFINGER管理」のSNS設定から行う構成になっています。

SNSを積極的に利用していない場合でも、OGPは設定しておくことをおすすめします。

「SNS / OGP」の設定を確認する

WordPress管理画面から、「AFFINGER管理」→「SNS / OGP」をクリックします。

ここでは、SNSボタンやOGP、SNSシェアに関する設定を確認できます。

OGPとは？

OGPとは、Open Graph Protocolの略です。

SNSなどでWebページがシェアされたときに、ページのタイトルや説明文、画像などを適切に表示するための仕組みです。

たとえば、ブログ記事をSNSでシェアしたときに、

• 記事タイトル
• 説明文
• OGP画像

などが表示されるのは、OGPが関係しています。

AFFINGER7公式マニュアルでも、SNSでサイトや記事の情報を正確に伝えるためにOGP設定を行うことが案内されています。

SNSボタンの表示を設定する

次に、記事ページなどに表示するSNSボタンを確認します。

AFFINGER7では、記事を読んだユーザーがSNSでシェアできるように、SNSボタンを表示できます。

利用するSNSに合わせて必要なボタンを設定しましょう。

たとえば、

• X
• Facebook
• LINE
• はてなブックマーク
• Pocket
• Pinterest

などがあります。

ただし、すべてのSNSボタンを表示する必要はありません。

自分のサイトで利用しているSNSや、読者が利用しやすいSNSに絞ると、記事ページをすっきり見せられます。

SNSボタンのカラーはカスタマイザーで設定する

SNSボタンの基本的な表示設定やデザインは「AFFINGER管理」で行いますが、ボタンのカラーはカスタマイザーから調整できます。

WordPress管理画面から、「外観」→「カスタマイズ」→「オプション（その他）」→ 「SNSボタン」を開きます。

AFFINGER7公式マニュアルでも、SNSボタンの色変更はカスタマイザーの「オプション（その他）→SNSボタン」から行う案内になっています。

そのため、「AFFINGER管理 → SNS / OGP」と「外観 → カスタマイズ → オプション（その他）→ SNSボタン」は、それぞれ役割が異なると覚えておきましょう。

OGP画像を設定する

OGP設定で特に確認しておきたいのが、OGP画像です。

SNSで記事をシェアしたときに表示される画像を設定しておくことで、記事の内容を視覚的に伝えやすくなります。

記事ごとにアイキャッチ画像を設定している場合は、その画像がSNSで利用されます。

また、トップページなど、投稿・固定ページ以外のページについては、専用のOGP画像を設定できます。

AFFINGER7公式マニュアルでも、トップページをシェアしたときにアイキャッチ画像が表示されない場合は、「SNS設定」の「トップページ（投稿・固定ページ以外）アイキャッチ画像」を設定するよう案内されています。

トップページ用のOGP画像を設定する

サイトのトップページをSNSでシェアする可能性がある場合は、トップページ用のOGP画像も設定しておきましょう。

サイトのロゴやサイト名などを入れた画像を用意しておくと、SNS上でもサイトを認識してもらいやすくなります。

ただし、SNSをほとんど利用しない場合でも、設定できる画像があるなら最初に用意しておくと後から設定し直す手間を減らせます。

Xのカード表示を確認する

Xで記事をシェアする場合は、Xカードの設定も確認しておきましょう。

Xカードを適切に設定すると、投稿したURLに対して記事タイトルや画像などを含むカード形式で表示できます。

AFFINGER7公式マニュアルにも、Twitterカード・OGP設定についての項目が用意されています。

現在は「X」という名称になっていますが、設定項目や公式マニュアルでは旧名称の「Twitter」が使われている場合があります。

SNSアカウントのURLを設定する

自分が運営しているSNSアカウントがある場合は、そのアカウント情報も設定しておきましょう。

SNSプロフィールへのリンクをサイト内に表示しておけば、ブログからSNSへユーザーを誘導できます。

ただし、利用していないSNSまで登録する必要はありません。

実際に運営しているSNSだけ設定するのがおすすめです。

SNS / OGPの設定は最初に済ませておく

SNS / OGPは、記事を書き始めてからでも設定できます。

しかし、設定しないまま記事をSNSでシェアすると、意図した画像やタイトルが表示されない場合があります。

そのため、ブログを公開する前に、

• SNSボタン
• OGP
• トップページのOGP画像
• Xカード
• SNSアカウント

などを一度確認しておけばOKです。

SNS / OGPのおすすめ設定

AFFINGER7を導入したばかりなら、以下を目安に設定しましょう。

設定項目	初期設定のおすすめ
SNSボタン	利用するSNSのみ表示
OGP	設定する
トップページのOGP画像	設定がおすすめ
Xカード	利用するなら設定
SNSアカウント	運営しているものだけ設定
SNSボタンのカラー	サイトデザインに合わせて調整

SNSを利用していない場合でも、OGPだけは設定しておくと、今後SNSを利用するときにもスムーズです。

関連記事
「SNS / OGP」の詳しい設定方法については、以下の記事で解説しています。

❼ 「SEO」で表示内容を確認する

最後に、AFFINGER7のSEO関連設定を確認します。

SEOとは、Googleなどの検索エンジンからサイトへアクセスしてもらうために、Webページを適切に最適化することです。

AFFINGER7には、検索エンジンに関係する設定項目が用意されています。

ただし、SEO設定は変更すれば検索順位が上がるというものではありません。

まずは基本的な設定を確認し、記事の内容やタイトル、見出しなどのコンテンツ面をしっかり整えることを優先しましょう。

「SEO」の設定を確認する

WordPress管理画面から、「AFFINGER管理」→「SEO」をクリックします。

ここでは、AFFINGER7で使用するSEO関連の設定を確認できます。

SEO関連の設定を確認する

SEOの設定画面には、検索エンジンやサイトの表示に関係する項目があります。

AFFINGER7を導入した直後は、まず現在の設定を確認し、必要な項目だけ変更しましょう。

特に、SEOのために設定項目をすべて変更する必要はありません。

意味がわからない項目は、無理に変更せずデフォルト設定のままにしておくことも大切です。

SEOプラグインとの役割を確認する

WordPressでは、SEO対策のためにSEOプラグインを利用することがあります。

たとえば、SEO SIMPLE PACKなどのSEOプラグインを使用している場合、AFFINGER7側のSEO機能と役割が重複する項目があります。

そのため、SEOプラグインを導入している場合は、同じ機能を複数の場所で設定しないように注意しましょう。

特に、

• メタディスクリプション
• OGP
• canonical
• noindex

などは、どのプラグイン・テーマで管理するのかを決めておくと設定がわかりやすくなります。

SEOプラグインを使用している場合は、そのプラグインの設定内容も確認したうえでAFFINGER7側を調整してください。

「noindex」の設定には注意する

SEO設定で特に注意したいのが、noindexに関する設定です。

noindexを設定すると、検索エンジンにそのページを検索結果へ表示しないよう伝えることができます。

ただし、設定を誤ると、本来検索結果に表示したいページまで検索エンジンに登録されなくなる可能性があります。

そのため、意味を理解しないまま変更するのはおすすめしません。

「検索結果に表示させたくないページがある場合に使用する設定」と覚えておきましょう。

メタディスクリプションを設定する

メタディスクリプションは、検索結果でページの内容を説明するための文章です。

記事の内容を簡潔にまとめ、ユーザーがページの内容を理解しやすくするために設定します。

ただし、メタディスクリプションを設定したからといって、検索順位が直接上がるわけではありません。

検索結果から記事をクリックしてもらうためにも、ページの内容が伝わる自然な文章を設定することが大切です。

XMLサイトマップは別に考える

SEO設定を確認すると、XMLサイトマップについても気になるかもしれません。

XMLサイトマップは、検索エンジンにサイト内のページを伝えるための仕組みです。

ただし、これはAFFINGER7のデザイン設定とは別に考えたほうがわかりやすいです。

WordPressやプラグインなど、サイトマップを生成する仕組みがすでに用意されている場合は、複数の仕組みで同じサイトマップを作らないように注意してください。

SEO設定は設定しすぎない

SEOについては、設定項目を増やすほど検索順位が上がるわけではありません。

むしろ、複数のSEO機能を重複して設定すると、意図しないタグや設定が出力される原因になることがあります。

AFFINGER7を導入したばかりなら、基本設定を確認する → 必要な項目だけ変更する → 記事を書くという流れで十分です。

SEO対策の中心は、テーマの設定だけではなく、ユーザーが知りたい情報をわかりやすく提供することです。

SEOのおすすめ設定

AFFINGER7の初期設定では、以下を目安に確認しましょう。

設定項目	初期設定のおすすめ
SEO関連の基本設定	内容を確認
noindex	必要な場合のみ設定
メタディスクリプション	運用方法に合わせて設定
OGP	「SNS / OGP」で設定
XMLサイトマップ	使用している仕組みを確認
その他の詳細設定	意味を理解してから変更

SEO関連の設定は、「よくわからないけどSEOに良さそう」という理由だけで変更しないことが重要です。

関連記事
「SEO」の詳しい設定方法については、以下の記事で解説しています。

---

これで、AFFINGER7の管理画面で最初に確認しておきたい設定はひと通り完了です。

ここまでの設定をまとめると、

1. 全体設定 → サイト全体の基本設定
2. トップページ / 記事一覧 → トップページの表示と記事一覧の表示及びデザイン
3. メニュー → サイト内の主要な導線
4. ヘッダー（ナビ / 画像） → ヘッダーの表示
5. 投稿・固定記事 → 記事ページの表示
6. SNS / OGP → SNS・OGP関連
7. SEO → SEO関連

という順番です。

この順番で設定すれば、AFFINGER7を導入した直後でも、何から手を付ければいいのか迷いにくくなります。

次は、ここまで設定した内容を実際のサイトで確認していきましょう。

AFFINGER7の初期設定はこの順番がおすすめ

ここまで、AFFINGER7の管理画面にある主要な設定を順番に確認してきました。

AFFINGER7には多くの設定項目がありますが、すべてを一度に設定する必要はありません。

まずはサイトを正常に表示できる状態にして、必要な部分から少しずつ調整していきましょう。

今回紹介した初期設定は、次の順番で進めるのがおすすめです。

順番	設定項目	主な設定内容
❶	全体設定	サイト全体のデザイン・レイアウト
❷	トップページ / 記事一覧	トップページの表示内容・記事一覧の表示やデザイン
❸	メニュー	グローバルメニューの作成
❹	ヘッダー（ナビ / 画像）	ヘッダーやナビゲーションの表示
❺	投稿・固定記事	記事ページ・固定ページの表示
❻	SNS / OGP	SNSボタン・OGPなど
❼	SEO	SEO関連の基本設定

❶ 全体設定

まずは、サイト全体の基本となるデザインやレイアウトを設定します。

ここでサイトの大まかな方向性を決めておくと、その後の設定が進めやすくなります。

まずはカラーパターンやデザイン、レイアウトなどを確認しましょう。

❷ トップページ / 記事一覧

次に、サイトの入口となるトップページを確認します。

新着記事を表示するブログ型にするのか、固定ページを使ってオリジナルのトップページを作るのかなど、サイトの目的に合わせて決めます。

最初はシンプルな構成で始めても問題ありません。

❸ メニュー

サイト内を移動するためのグローバルメニューを設定します。

主要カテゴリーや重要な固定ページなど、ユーザーがよく利用するページを中心に登録しましょう。

メニュー項目を増やしすぎないこともポイントです。

❹ヘッダー（ナビ / 画像）

グローバルメニューを含めたヘッダーの表示を確認します。

サイトタイトルやロゴ、ヘッダー画像などを必要に応じて設定します。

ヘッダーはサイトの第一印象に関わりますが、最初から作り込みすぎる必要はありません。

❺ 投稿・固定記事

実際の記事を表示したときの状態を確認します。

投稿日・更新日、アイキャッチ画像、SNSボタン、関連記事など、記事を読むうえで必要な情報が適切に表示されるように設定します。

❻ SNS / OGP

SNSで記事をシェアしたときの表示を確認します。

SNSボタンやOGP画像などを設定し、実際にSNSへシェアしたときにどのように表示されるのか確認しておきましょう。

❼ SEO

最後に、SEO関連の設定を確認します。

SEO設定は、変更すれば検索順位が上がるというものではありません。

設定の意味を理解したうえで、必要な項目だけ変更しましょう。

迷ったら「デフォルト設定」を基本にする

AFFINGER7には非常に多くの設定項目があります。

そのため、設定画面を見て、「全部設定しないといけないのでは？」と思ってしまうかもしれません。

しかし、最初からすべてを変更する必要はありません。

AFFINGER7を導入したばかりなら、デフォルト設定を基本にして、必要な部分だけ変更する方法がおすすめです。

特に意味がわからない項目については、無理に変更しないようにしましょう。

サイトを運営していく中で、

「ここを変更したい」

「この表示を消したい」

「もっと見やすくしたい」

と感じたタイミングで、その設定を調べて変更すれば十分です。

初期設定より「記事を書くこと」を優先する

AFFINGER7はカスタマイズ性が高いため、設定を始めると細かな部分まで気になってしまいます。

しかし、ブログを始めたばかりなら、デザインを何時間も調整するよりも、読者に役立つ記事を作ることを優先するほうが重要です。

まずは、「基本設定を済ませる → 記事を書く → 実際の表示を確認する → 必要な部分を改善する」という流れで進めていきましょう。

これなら、設定に時間をかけすぎることなくブログをスタートできます。

AFFINGER7の管理画面で設定した後に確認すること

AFFINGER7の初期設定が終わったら、最後に実際のサイトを表示して設定内容を確認しましょう。

管理画面で設定しただけでは、実際のページでどのように表示されるのか分かりません。

特に、トップページやグローバルメニュー、記事ページは、パソコンとスマートフォンの両方で確認することが大切です。

① トップページを確認する

まずは、サイトのトップページを開いて表示を確認します。

次の項目をチェックしましょう。

• サイトタイトル・ロゴが正しく表示されている
• グローバルメニューが表示されている
• 記事一覧が正しく表示されている
• サイドバーが意図した位置に表示されている
• アイキャッチ画像が崩れていない
• サイト全体のレイアウトに違和感がない

管理画面で設定した内容と実際の表示が違っている場合は、該当する設定を見直します。

② グローバルメニューを確認する

グローバルメニューは、実際に各項目をクリックして確認しましょう。

特に、

• リンク先が間違っていない
• カテゴリーが正しく表示されている
• 不要なメニュー項目が入っていない
• サブメニューが意図したとおりに開く

といった点を確認します。

メニューはユーザーがサイト内を移動するときに利用するため、リンク切れや間違ったリンク先がないかをチェックしておきましょう。

③ 記事ページを確認する

次に、実際の記事を1記事開いて表示を確認します。

以下の項目をチェックします。

• 記事タイトルが正しく表示されている
• アイキャッチ画像が表示されている
• 見出しのデザインに問題がない
• 文字サイズや行間が読みやすい
• SNSボタンが必要な場所に表示されている
• 関連記事が表示されている
• サイドバーが意図したとおりに表示されている

設定直後は、公開済みの記事を1記事使って確認すると分かりやすいです。

④ スマートフォンで確認する

パソコンで問題がなくても、スマートフォンでは表示が崩れることがあります。

そのため、スマートフォンでも実際のサイトを開いて確認しましょう。

特に、

• グローバルメニュー
• ヘッダー
• 記事タイトル
• アイキャッチ画像
• 見出し
• 本文
• サイドバー
• SNSボタン

などをチェックします。

スマートフォンでは、文字が小さすぎないか、横スクロールが発生していないかも確認しておきましょう。

⑤ SNS・OGPの表示を確認する

SNS / OGPを設定した場合は、記事をSNSでシェアしたときの表示も確認します。

チェックするポイントは、

• ページタイトル
• 説明文
• OGP画像
• Xなどのカード表示

です。

設定したOGP画像が意図したものになっているか確認しておきましょう。

⑥ SEO設定を確認する

最後に、SEO関連の設定を確認します。

特に注意したいのが、意図せず検索エンジンに表示させない設定になっていないかです。

サイトを検索結果に表示させたい場合は、noindexなどの設定を不用意に変更していないか確認しましょう。

また、SEO関連のプラグインを使用している場合は、AFFINGER7側の設定と役割が重複していないかも確認しておくと安心です。

AFFINGER7初期設定後のチェックリスト

最後に、次の項目を確認すれば、基本的なチェックは完了です。

チェック項目	確認するポイント
トップページ	レイアウト・記事一覧・サイドバー
グローバルメニュー	リンク先・表示順・メニュー構成
ヘッダー	サイトタイトル・ロゴ・ナビ
記事ページ	タイトル・画像・見出し・本文
スマートフォン	表示崩れ・文字サイズ・横スクロール
SNS / OGP	SNSボタン・OGP画像・カード表示
SEO	noindexなどの設定
リンク	メニューや記事内リンクの動作

ここまで確認できれば、AFFINGER7の基本的な初期設定は完了です。

あとは記事を書きながら、必要になった設定を少しずつ調整していきましょう。

まとめ！AFFINGER7の管理画面の初期設定ガイド｜インストール後にやるべき設定

AFFINGER7を導入した直後は、管理画面に多くの設定項目があるため、どこから手を付ければいいのか迷いやすいです。

ただし、最初からすべての項目を細かく設定する必要はありません。

まずは、次の順番で基本的な設定を確認しておきましょう。

1. 全体設定
2. トップページ
3. メニュー
4. ヘッダー（ナビ / 画像）
5. 投稿・固定記事
6. SNS / OGP
7. SEO

初期設定では、サイト全体のレイアウトやメニュー、記事の表示など、ブログを運営するために必要な部分を優先するのがおすすめです。

細かなデザインやカスタマイズは、実際に記事を書きながら必要に応じて調整していけば問題ありません。

AFFINGER7は設定項目が豊富なテーマだからこそ、最初から完璧を目指すのではなく、基本設定を済ませて記事作成を始めることを意識しましょう。

なお、個別の設定について詳しく知りたい場合は、それぞれの設定項目を解説した記事も参考にしてください。