AFFINGER7の初期設定ガイド！最低限やっておきたい設定を順番に解説

AFFINGERは自由度が高い半面、設定項目も多岐にわたります。

最初から全容を把握しようとすると、記事を書かないまま数日が過ぎてしまいます。

この記事では、インストール直後に最低限やっておきたい設定を、ピックアップして紹介します。

AFFINGER7の設定画面構造はAFFINGER6とほぼ同じなので、6の設定手順が使えます。

AFFINGER6からのテーマアップデートであれば、初期設定は不要です。

AFFINGER6から7へ、何が変わった？

事前に変更点を確認しておくと、設定中に項目の未発見で迷わずに済みます。

AFFINGER7はAFFINGER6を土台にした進化版で、テーマ構造自体は大きく変わっていません。

移行作業も「外観 → テーマ → 新規追加 → テーマのアップロード」からファイルを反映するのみで完結し、AFFINGER6を削除する必要はありません（STINGER STORE）。

主な変更点は以下の3点です。

1. AMP機能が完全に廃止

AFFINGER6に存在したAMP関連の設定は、AFFINGER7で全廃されました（STINGER STORE）。

AFFINGER6の設定ガイドに掲載されている「Google・広告 / AMP」というタブ名からも、AMPの表記が削除されています。

このほか、FontAwesome 4.7.0のサポートや、メモボックス・スライドボックス・ウェブアイコンのカスタマイザー設定も廃止されました（STINGER STORE）。

AFFINGER6で作成した記事内で使用している場合は、移行後に表示崩れがないか確認が必要です。

2. AI機能が「AIサポート」プラグインとして追加

AIリライト、AI要約、スラッグ自動生成といった機能が、専用プラグイン「AIサポート」として独立しました。

利用にはOpenAIのAPIキーが必要となり、従量課金制が適用されます。

初期設定段階での導入は必須ではないです。

購入ユーザー限定ページでプラグインをダウンロードできます。

3. デザインカードが刷新

デザイン済みデータをワンクリックで反映する「AFFINGER7デザインカード」プラグインが追加されました。

AFFINGER6ではデザインごとに個別のプラグインが必要でしたが、7では本体プラグインが共通化され、データのみを個別に適用する仕様に変更されました（STINGER STORE）。

AFFINGER7インストール直後にやる2つの手順

詳細な設定に入る前に、以下の2手順を完了させましょう。

手順をスキップした場合、後の設定が反映されない原因となります。

「AFFINGER管理」で設定する12項目

ここからは、ワードプレス管理画面左メニューの「AFFINGER管理」で設定します。

【1】アイキャッチ画像を表示する

AFFINGER管理 → 投稿・固定記事 → アイキャッチ設定

• 「アイキャッチ画像の表示を全ての記事で有効化する（デフォルトは上部）」にチェック
• 「アイキャッチ画像をタイトル下表示に変更する」にチェック

スマートフォンユーザーが主体のメディアでは、意図的に非表示とする判断も有効です。

ファーストビューが画像で埋まることで本文の視認性が低下し、離脱につながるケースがあるためです。

アクセス解析でモバイル比率が高い場合は、非表示化で変化があるかテストしてみましょう。

【2】記事の更新日を表示する

AFFINGER管理 → 投稿・固定記事 → 投稿日（更新日）

ラジオボタンから 「両方表示する（※一覧を除く）」 を選択します。

公開日のみの表示では、コンテンツが陳腐化している印象を与える可能性があります。

定期的なリライトを行っている場合、更新日を併記することで情報のフレッシュネスを提示できます。

【3】スマホメニューを右側に置く

AFFINGER管理 → メニュー → スマホスライドメニュー

【メニューの位置】で 「右」 を選択します。

スマートフォン片手操作時、親指の可動域内に収まるのは画面右下領域です。

メニューを右側に配置することで操作性が向上します。

スマホメニューの中身は自動で表示されません。

別途、外観 → メニュー に移動して、メニューを作成後、「メニュー設定（画面の下の方）」にあるスマホスライドメニューのチェックが必要です。

【4】スマホヘッダーに検索アイコンを出す

AFFINGER管理 → メニュー → スマホスライドメニュー

「スマホヘッダーに検索アイコンを追加」にチェックを入れます。

コンテンツ数が増加すると、目的の記事を探しにくくなります。

ヘッダー領域に検索窓を常駐させることで、サイト内回遊を促進できます。

【5】フォントサイズと行間を調整する

AFFINGER管理 → 全体設定 → フォントのサイズ

テキストの可読性を左右する重要な項目です。

当サイトにおけるPC向けの設定数値は以下の通りです。

項目	設定値
基本フォントサイズ	16px
行間	32px
H2	25px
H3	21px
H4	16px
字間	0.05em

行間は文字サイズの2倍程度が適正値の目安です（16pxの場合は32px）。

行間を極端に詰めると視認性が悪化し、読了率の低下につながります。

スマートフォン・タブレット・PCで個別に設定が可能です。

実機の画面を見ながら微調整を行ってください。

【6】サイドバーの新着記事一覧を消す

AFFINGER管理 → トップページ / 記事一覧 → 記事一覧

• 「トップページのサイドバーの新着記事一覧を非表示」にチェック
• 「下層ページのサイドバーの新着記事一覧を非表示」にチェック

トップページ本体に記事一覧が配置されているため、サイドバーへの重複掲載を防止します。

空いたサイドバー領域にはプロフィールや注力記事への導線を配置してください。

【7】トップページのタイトルとディスクリプションを書く

AFFINGER管理 → SEO → SEO関連設定

• 【トップタイトルを書き替え】：検索結果に表示させたいタイトルを入力
• 【トップ用のメタディスクリプション】：サイト概要文（80〜120文字程度）を入力

本項目はWordPressの「設定 → 一般」内にあるキャッチフレーズ領域とは異なります。検索エンジンの結果画面（SERPs）に反映されるのは本項目で入力した文字列です。

【8】記事タイトルからサイト名を消す

AFFINGER管理 → SEO → SEO関連設定

• 「トップ用のメタディスクリプション」を入力
• 「投稿及び固定記事タイトルの末尾にサイト名を追加しない」にチェックを入れる
• タグをindexしない

「タイトルの末尾にサイト名を追加しない」理由は、記事のタイトルに無駄な文字を追加しないためです。

末尾にサイト名が固定で付与されると、主要な検索キーワードが省略されるリスクが生じます。

サイト自体の指名検索数が少ない初期段階では、チェックを入れて外す設定が有効です。

反映状況はブラウザで記事を開き、ソース表示画面（<title>タグ内）で確認できます。

【9】Xカード（旧Twitterカード）を設定する

AFFINGER管理 → SNS / OGP → X（旧Twitter）設定

• 「現在のX（旧Twitter）アカウント@」に自身のユーザー名を入力
• カードサイズは 「大」 を選択
• 「ハッシュタグの設定」は任意で指定

記事URLがX上でシェアされた際、大型アイキャッチ画像付きのカード形式で出力されます。

テキストリンクと比較して視認性が高まり、クリック率（CTR）の向上が期待できます。

トップページ用の画像は【トップページアイキャッチ画像】から個別に登録可能です。

【10】ヘッダーのキャッチフレーズを消す

AFFINGER管理 → ヘッダー（ナビ / 画像） → ヘッダーナビゲーション

「ヘッダーにキャッチフレーズを表示しない」にチェックを入れます。

設定項目は「スマホ（タブレット含む）」と「PCのみ」に分類されており、デバイスごとの制御が可能です。

キャッチフレーズ自体を完全に消去する場合、「外観 → カスタマイズ → サイト基本情報」から該当テキストを削除する手法も可能です。

【11】GA4（Googleアナリティクス）を連携する

AFFINGER管理 → Google・広告

「アナリティクスコード（gtag.js）」欄に、GA4の測定IDを貼り付けてSaveを実行します。

フィルタの反映には時間がかかります。

「リアルタイム」レポートで自身のアクセスが検知されないことを確認してください。

【12】サイト全体のカラーを決める

カラーリングの指定方法は以下の2パターン存在します。

パターンA：プリセットから選択する

AFFINGER管理 → 全体設定 → カラーパターン

プリセットを適用する場合は、あらかじめ「外観 → カスタマイズ → 全体カラー設定」で 「簡単設定を使用しない」 を選択しておく必要があります。

この選択を行わない場合、指定したパターンが画面に反映されません。

併せて AFFINGER管理 → 全体設定 → デザインパターン から、カテゴリー背景の形状、サイドメニュー背景、hタグ背景の形状を一括指定可能です。

構成に迷う場合は「ブログ（初心者おすすめ）」の選択を推奨します。

パターンB：個別でカラーコードを指定する

外観 → カスタマイズ → 全体カラー設定

個別に色を指定したい場合は、「外観」の全体カラーから設定します。

キーカラー・メインカラー・サブカラー・テキストの4色を個別に指定できます。

「カスタマイズ（外観）」で整える6項目

次に「外観 → カスタマイズ」内の設定項目です。サイトの視覚的要素を調整します。

【1】見出し（hタグ）のデザイン

外観 → カスタマイズ → 見出しタグ（hx）/ テキスト

H2・H3・H4の各階層に対して、背景色・下線・アイコンなどの装飾を設定可能です。

見出しは文章構造を示す視覚的目印です。

H2とH3のデザインレベルに明確な差分を設けることで、流し読みの段階でも記事構造を把握しやすくなります。

【2】faviconを設定する

外観 → カスタマイズ → サイト基本情報

AFFINGER内では「サイトアイコン」と表記されます。

WordPress推奨規格である512×512px以上の正方形画像を用意してアップロードします。

ブラウザのタブやブックマーク一覧に表示されるファビコン未設定の場合、他サイトとの判別が困難になります。

【3】「トップに戻る」ボタンの形を変える

外観 → カスタマイズ → オプション（その他） → TOPに戻るボタン

「ページトップボタンを丸くする」のチェックを外すと、矩形（四角）デザインへ変更されます。

サイト全体の角丸処理（R値）に合わせて選択してください。

カードや見出し領域を角丸で統一している場合は円形、直線主体のデザインであれば矩形を選択することで全体のトーンが揃います。

【4】ブログカードのラベルを変える

外観 → カスタマイズ → オプション（その他） → ブログカード / ラベル

「ラベルデザイン」のデフォルト値「たすき掛け」を 「リボンデザイン」 へ変更できます。

【5】背景色を調整する

外観 → カスタマイズ → 背景 / header 背景 → 背景色

記事一覧および本文領域の後ろ（最背面）の色を設定できます。

最背面色を白（#ffffff）にすると、境界線が消えて、画面全体の拡張感がでます。

【6】ヘッダーの色を変える

外観 → カスタマイズ → 背景 / header 背景 → header エリア

ヘッダーエリアの「背景色」を設定できます。

ロゴが白系で、明度の高い色（白に近い色）を指定するとロゴが背景に溶け込んで分からなくなるので注意が必要です。

入れておきたいプラグイン

AFFINGER7で使う専用プラグインです。

【1】AFFINGERブロック（専用プラグイン）

ブロックエディタ上でAFFINGER固有の装飾パーツを利用するためのプラグインです。

AFFINGER7においても標準同梱されています。

有効化により、ブロック挿入一覧にAFFINGER専用の各種ブロックが追加されます。

AFFINGER7ではセールスカード、ステップ、タイムライン、マップ等のブロックが追加実装されました。

テーブルブロックもセルの結合・分割操作に対応しています。

本プラグインの有効化は最優先で行いましょう。

未導入状態だとテーマ固有のエディタ装飾機能が使えません。

【2】目次プラグイン

AFFINGER7には目次出力プラグイン「SUGOI MOKUJI [LITE]」が同梱されています。

同梱されていない場合は購入ユーザー限定ページからプラグインをダウンロードできます。

SUGOI MOKUJIを使わない場合は、従来より広く利用されている無料プラグイン Table of Contents Plus がおすすめです。

目次にH4レベルまで表示させると、目次領域が大きくなって可読性が低下します。

見出しの抽出範囲はH2・H3のみでOKです。

【3】XMLサイトマップ

検索エンジンに対してサイト構造を伝達するためのXMLファイルを生成します。

正常出力を確認後、Google Search Consoleの「インデックス作成 → サイトマップ」画面より対象URLを登録します。

【4】AIサポート・デザインカード（任意）

AFFINGER7より新たに提供された専用プラグインです。

AIサポート はAIによる文章リライト、要約、スラッグ自動生成等の機能を処理しますが、OpenAI APIキーの取得および利用量に応じた従量課金が発生します。

AFFINGER7デザインカード は、プリセットされたデザインデータを1クリックで適用するプラグインです。

プラグイン本体を共通基盤とし、個別デザインデータを追加読み込みさせる構成へ変更されました（STINGER STORE）。

両プラグインとも初期導入における必須要件ではありません。基本構造の構築完了後に導入を検討してください。

余裕があればやりたい＋αの設定

必須ではありませんが、事前に設定を済ませることで運用効率が向上する項目です。

スマホのサイドバーを非表示にする

AFFINGER管理 → 全体設定 → サイト全体のレイアウト

「スマホのサイドバーを非表示にする」にチェックを入れます。

スマートフォン表示時、サイドバー要素はメインコンテンツの下部へ押し下げられるため、スクロール到達率および閲覧率は低下します。

不要な要素を非表示化することで、ページ全体の表示速度や視認性の向上が期待できます。

ただし、サイドバーにバナー広告や回遊用リンクを配置している場合、それらも非表示になります。

収益導線として機能させている場合は、あらかじめ本文内へ配置を移動させましょう。

構造化データを出力する

著者情報の構造化データを出力する場合、「ユーザー → ユーザー一覧」から管理者プロフィール（名前、プロフィール文、アバター画像）を事前に登録しましょう。

未入力の状態で出力処理を行ってもメタデータとしての効果は得られません。

フッターメニューに設定する項目

フッターメニューに以下の項目を追加しましょう。

外観 → メニュー

フッターメニューを新しく作成し、「フッターメニュー」にチェックを入れて登録します。

免責事項、プライバシーポリシー、お問い合わせフォームの明示は、サイトの客観的信頼性の担保につながります。

最近では信頼性が重要視されており、最初から設定しておいた方がよい項目です。

プロフィールカードを作る

執筆者情報（アバター画像および略歴）をカード形式で表示するコンポーネントです。

発信者の透明性を確保することで、コンテンツの信頼性を高める効果があります。

初期設定の後、必ずやること

テーマ固有の設定作業ではありませんが、サイト運用において必須となる手順です。

Google Search Consoleへの登録作業を実行してください。

未登録の状態であってもクローラーの巡回によるインデックス自体は行われます。

しかし、未登録状態では「獲得インデックスキーワードの推移」「インデックス未登録ページの検出原因」といった解析データの収集が行えません。

サイトマップの送信やインデックスリクエスト機能も使用不能となります（Google検索セントラル）。

GA4の設定完了と一緒に登録しましょう。

登録完了後は、前述の手順で生成したサイトマップURL（https://[自身のドメイン]/sitemap.xml）の送信処理を行ってください。

そのほか入れておくと便利なプラグイン

プラグイン	用途
Contact Form 7	お問い合わせフォームの作成・設置
WPS Hide Login	ログインURLを変更し不正アクセス攻撃を防護

プラグインの過剰な導入はページ読み込み速度の遅延を招きます。

サイトの成長や必要性に応じて個別に導入しましょう。

よくある質問

AFFINGER6の設定はAFFINGER7に引き継がれる？

設定データは引き継がれます。

AFFINGER7はAFFINGER6のマイナーチェンジ・拡張版の位置づけであり、テーマファイルを上書き更新する形式でアップデートを実行します（STINGER STORE）。

ただし、AMP機能や一部の旧コンポーネントは機能自体が廃止されているため、該当機能を使用していた箇所については更新後に表示確認が必要です。

初期設定にどれくらい時間がかかる？

この記事で紹介した必須設定項目のみであれば、所要時間は1〜2時間程度です。

配色や細部のデザイン調整に時間を費やすと記事作成ができなくなるため、初期状態ではデフォルト設定をつかいつつ、コンテンツを作成しながら段階的に微調整を行うといいです。

AIサポートは最初から入れたほうがいい？

サイト立ち上げ初期段階での導入は不要です。

利用にあたってはOpenAIのAPIキー取得および従量課金設定が別途必要となります。

まずは記事執筆の運用ラインを構築することを優先し、必要性が生じた段階で導入を検討しましょう。

設定を変えたのに表示に反映されない

主に以下の3点が原因として考えられます。

1つ目は「Save」または「公開」ボタンの押下漏れ。

2つ目はキャッシュ系プラグインまたはブラウザキャッシュによる旧データの保持。

3つ目はカラーパターン適用時における「全体カラー設定」側の「簡単設定を使用しない」の非選択です。

表示されない場合はこの順序で設定状況をチェックしてください。

まとめ

AFFINGER7における初期設定の必須手順です。

• 初回必須作業：「AFFINGER管理」→「全体設定」→「サイト全体の設定」でSave実行、「設定 → パーマリンク設定」で投稿名に設定して保存
• AFFINGER管理：アイキャッチ、更新日、スマホメニュー位置、フォントサイズ、トップSEO情報、GA4連携、カラー設定
• カスタマイズ：見出しデザイン、サイトアイコン（favicon）、TOPに戻るボタン、ブログカードラベル、背景色、ヘッダーカラー
• プラグイン：AFFINGERブロックを最優先で有効化。続いて目次プラグインおよびXMLサイトマップ生成プラグインを導入
• 設定後の作業：Google Search Consoleへのサイト登録とXMLサイトマップの送信

初期段階で完璧なデザインを構築するのは難しいです。

必須項目の設定を完了させたら、記事を書きつつ、その合間にデザインの細部を詰めていきましょう。