【AFFINGER6】ブログに最適な初期設定を完全解説｜2024年最新版

SHIN

WordPressテーマのAFFINGER6を購入したけど、基本的な初期設定がイマイチわからない・・・

ブログを始めるのに最適な設定をわかりやすく解説してほしい・・・

この記事は、AFFINGER6の初期設定について徹底解説している記事ですので、ぜひ参考にされてください。

AFFINGER6は、数ある有料テーマの中でも設定できる項目が非常に多いイメージなので、特に初心者の方は戸惑ってしまう設定が多いと思います。

この記事ではAFFINGER6の初期設定のほかに、WordPressの初期設定・最初にインストールすべきプラグイン・解析ツール（Googleアナリティクス・Googleサーチコンソール）の解説も含めていますので、設定がまだできていない方は、こちらもぜひ参考にしてください。

では始めていきましょう。

▶︎ AFFINGER6の初期設定を始める前に確認すること

AFFINGER6の初期設定を始める前にチェックしてほしい点が4つあります。

WordPressにAFFINGER6をアップロードして初期設定を完了できたら、さっそく記事を書きはじめたいですよね。

この4つの確認項目は、記事を書きはじめる前にやっておくべき作業なので、ブログ運営を始める準備としてやっておきましょう。

≫ WordPressの初期設定を完了させる

WordPressにもダッシュボードにある「設定」というメニュー内に、やっておくべき重要な設定があります。

こちらの設定作業は、以下の記事で詳しく解説していますので、まだの方はぜひこちらから作業を始めていきましょう。

≫ ブログ運営に必須なプラグインの導入

WordPressでブログを運営するにあたり、作業効率化・表示速度アップ・セキュリティー強化など必要な機能を無料で簡単に利用することができるので、ぜひ活用していきましょう。

以下の記事で、本当に必要な厳選したプラグインを紹介しているので、まだ導入されていない方はぜひ参考にしてください。

≫ Googleアナリティクス（GA4）の導入

Googleアナリティクス（GA4）も、ブログを分析する上で非常に便利なツールです。

特にブログの内部分析に特化したデータを見ることができるので、よりユーザビリティを磨くためのツールとして活用しましょう。

こちらも徹底した解説記事がありますので、まだ導入していない方はぜひ以下の記事を参考にしてください。

≫ Googleサーチコンソールの導入

このGoogleサーチコンソールも、ブログを分析する上でマストな無料ツールです。

Googleアナリティクスと違い、外部からの流入動向データがチェックできるので、分析によって戦略的に集客を図れるようになります。

こちらも導入していない方は、以下の記事を参考にしてください。

▶︎ AFFINGER管理の各メニュー初期設定手順

ではさっそくAFFINGER6の初期設定を始めていきましょう。

step
1まずWordPressのダッシュボードメニューにある「AFFINGER 管理」をクリックします。

step
2次にはじめに（必ずお読みください）の下にあるSaveを一度クリックし、初期化しておきましょう。

SHIN

この「はじめに」に書かれている基本事項、はじめに行うこと、うまく動かないときは？の3つの目次はしっかり読んでおきましょう。

また最後のリンク集にある便利なリンク先も、必要に応じてブックマークしておくと良いです。

≫ 全体設定

ここでは、ブログ全体に対して設定できるメニューが並んでいます。

ドロップシャドウ

この設定は、この要素に影を付けるか付けないかを設定できます。

僕は少しでも味がある装飾がいいと感じたので、チェックを入れています。

ちなみに、以下のような変化があります。

SHIN

影はない方がイイ！という方はチェックを外したままで大丈夫です。

サイト全体のレイアウト一括設定

この設定では、PC閲覧時のサイトの幅を指定していきます。

さまざまなブログサイトを見て回ってもらうと分かりますけど、デフォルトの1060pxでは「狭い」と感じます。

幅が狭いと、記事のテキストが短くでも改行数が増えて読みづらくなり、結果的にユーザビリティとして良くないと考えているので、1200pxまで広く設定することをおすすめします。

その他の項目はデフォルトのままで大丈夫です。

サムネイル画像設定

サムネイル画像設定では、まずサムネイルの形を設定できます。

僕は正方形で設定していますが、ここは好みの形でいいと思います。

ただ「フルサイズにする」だけは避けましょう。表示速度に悪影響する可能性があることと、エラー表示するリスクもあるようなので、丸くするか正方形にするかの2択をおすすめします。

またスライド・カード型のサムネイル画像では、縦横比はデフォルトにし、基準では自動に設定することをおすすめします。

フォントのサイズ

続いてフォントサイズを設定していきます。

画像は、このブログで設定している数値なので、参考にしてください。

フォントサイズは、記事の読みやすさに直接影響する重要な設定なので、ブログを客観視してユーザービリティに最適な数値にしていきましょう。

フォントの種類

ブログの各箇所に対するフォントの種類を設定できます。

僕は少しでもオリジナル感を出すために、フォントはNoto Sansに設定しています。

このフォントを使っているブログはあまり見ないのと、固すぎず柔らかすぎないフォントですごく気に入っています。

AFFINGERで用意されている6パターンのフォントから選択する場合は、Googleフォントを使用しないので、チェックを外しておきましょう。

また追加の反映範囲では、この選んだフォントを個別に指定できるので、ここは好みでチェックしておきましょう。

AFFINGER6のフォントは、こちらでも詳しく記事にしているので、ぜひ参考にしてください。

SHIN

全体設定でやっておくべき内容は以上です。

では次にメニューを設定していきましょう。

≫ メニュー設定

このメニューでは、PCヘッダーメニューとスマホメニューを細かく設定できます。

PC版とスマホ版で、ブログのメニューをあらかじめ考案してイメージしてから設定作業に取りかかりましょう。

PCヘッダーメニュー

このPCヘッダーメニューは、あらかじめWordPressでメニューを作成しておく必要があります。

WordPressのダッシュボードから、外観＞メニューと進むとメニュー作成画面に移り、ここで作成できるようになります。

僕のブログのように、ヘッダー右に横列でメニューを作る場合は、以下のように進んでメニューを作成しておきます。

デフォルトの「PC ヘッダーメニューを上に表示する（デフォルト）」にチェックを入れている場合、以下のようなメニューデザインになります。

このメニューは一昔前のようなデザインなので、あまりおすすめしません。

事前にWordPressでメニューを作成しておき、画像にあるPCヘッダーメニューの設定をすると、このブログのヘッダーメニューを作成することができるので、よかったらマネしてみてくださいね。

スマホスライドメニュー

ここでは、スマホでブログを閲覧したときのメニュー表示を設定できます。

僕がデフォルトから変更しているのは上の2箇所だけで、どちらもデザイン的な変更なので、こちらは好みで変えていきましょう。

SHIN

メニューでやっておくべき内容は以上です。

では次にヘッダーを設定していきましょう。

≫ ヘッダー設定

この設定では、主にPC・スマホともにヘッダーに関する設定やカスタマイズ（デザイン）ができます。

このブログの場合、PCもスマホも「フロントページを除く」はチェックを外し、さらにPCのみにある「ヘッダーを分割しない」「ヘッダーナビゲーションをセンタリング」の2つもチェックを外しています。

また、PCのみヘッダーの高さを150pxに指定しています。

デザインに関する設定のみ変更しているので、こちらは好みで設定しましょう。

SHIN

ヘッダーでやっておくべき内容は以上です。

では次にヘッダー下おすすめを設定していきましょう。

≫ ヘッダー下おすすめ設定

ここでは、ヘッダーのしたにカードリンクを最大4つまで設置できる設定や、おすすめしたい記事をスライドショーで表示する設定ができます。

まだ記事が少ないうちは、ここの設定はデフォルトのままで大丈夫です。

このブログでは、スマホのみカードリンクを4つ表示する設定をしています。

詳しくは下の設定画像を見てください。

このカードリンクは、カテゴリーで設定するのがおすすめですが、単独記事で表示させることも可能です。

特に読んでもらいたいカテゴリーや記事を抜粋して、このようにアピールすることができる設定なので、有効活用していきましょう。

SHIN

ヘッダー下おすすめでやっておくべき内容は以上です。

では次にトップページを設定していきましょう。

≫ トップページ設定

ここではトップページを作成する上で、さまざまな設定ができます。

例えば、1カラムにしたり、LPページにしたり、タブを使ったカテゴリーリンクを貼ったりなどカスタマイズができます。

このブログのトップページは、まだカスタマイズできていないため、新着記事のみを表示するようにしています。

新着記事

このブログの新着記事は、トップページにも個別記事にもサイドバーには表示しない設定にしています。

サイドバーはもっと有効的な表示で活用したいというのが理由です。

またトップページには最大10件の新着記事を表示するように設定しています。

少なすぎず多すぎない件数という理由ですね。

SHIN

トップページでやっておくべき内容は以上です。

では次に投稿・固定記事を設定していきましょう。

≫ 投稿・固定記事設定

この設定では、主に投稿ページ・固定ページの表示や非表示を設定したり、投稿日の掲載方法、コメント、アイキャッチ画像、この記事を書いた人、関連記事に関する設定やカスタマイズが可能です。

では見ていきましょう。

カテゴリー・タグ

記事一覧や関連記事一覧などにカテゴリーを表示したい場合は、デフォルトのままチェックを入れておきます。

このブログでは、トップページや個別記事でもサイドバーにカテゴリーを表示しているので、チェックを外しています。

その他

その他設定では、PCでアドセンス広告を記事下に横並び表示（ダブルレクタングル）する場合に、画像にある項目にチェックを入れておきます。

注意書きにもあるように、サイトの幅は1114px以上に設定することを忘れないようにしましょう。

アイキャッチ設定

アイキャッチ画像は必要なので、記事タイトル下に表示するように設定していきましょう。

またアイキャッチ画像を横長（16⁚9）にする場合「ワイド化する」を選択しておきます。

この記事を書いた人

記事を書いた人のプロフィールは、個別記事ごとに表示することをおすすめします。

プロフィールに資格、経験、実績を書かれている場合は、その記事に対する信頼性もグンと上がりますので、大きなメリットになります。

関連記事一覧

記事の最後に、関連する記事を表示・非表示にする設定ができます。

関連記事は表示に設定することをおすすめします。理由は、記事の回遊率が上がる・ページビューが増える・滞在時間が長くなるというメリットがあり、さらにはクローラーへ伝わる情報量が多くなるというメリットもあります。

その関連記事一覧の見出しを、任意のテキストに変えることもできます。

SHIN

投稿・固定記事設定でやっておくべき内容は以上です。

では次にSNS/OGPを設定していきましょう。

≫ SNS/OGP設定

この設定では、SNSアイコンのカスタマイズやFacebook・X（旧Twitter）のOGP登録を設定できるので、登録していきましょう。

SNS設定

1つ目のチェックは、SNSボタンをトップページ下には非表示という設定にしています。

まだ記事の少ないブログの状態で、ブログ自体を各種SNSでシェアしてくれる可能性は極めて低いと考えており、トップページにまでSNS表示をすると「嫌がられる」という見解で非表示にしています。

もちろん表示したい場合は、デフォルトのままで大丈夫です。

2つ目のチェックは、Pinterestのボタンを表示するようにしています。

理由は、ブログで使用する画像は「alt設定」するのが基本ですけど、Pinterestでユーザーが検索した際に、その画像がヒットする可能性はあるので、Pinterestのアカウントを持っているユーザーには有効なボタンとした考えで表示しています。

3つ目のチェックは、画像に「Pinterestのピンを表示する」に設定しています。

というのは、画像にマウスオンするたびにPinterestのピンは表示され、画像をPinterestで拡散してくれる可能性があるため、ピン表示するように設定しています。

あまりブログに画像を使用しない方は、非表示でもいいのかなと思います。

Pinterestユーザーも取り込みたい場合は、表示しておくことをおすすめします。

OGP設定

ここでは、SNSのFacebookとX（旧Twitter）のアカウントを登録できます。

ブログで表示しているSNSボタンと連携する設定なので、アカウントを持っている場合は必ず設定しておきましょう。

SHIN

SNS/OGP設定でやっておくべき内容は以上です。

では次に SEOを設定していきましょう。

≫ SEO設定

このAFFINGER6のSEO設定ですが、すでにWordPressで設定している項目があり、あえてAFFINGER6で設定することがなく、すべてデフォルトのままで大丈夫です。

WordPressのSEO設定については、冒頭で解説している「WordPressの初期設定を完了させる」で紹介した記事の【2024年最新】WordPressでやるべき初期設定ガイド完全版をぜひご覧ください。

SHIN

では続いてGoogle・広告/AMPを設定していきましょう。

≫ Google・広告/AMP設定

ここでは、Googleアナリティクス・Googleサーチコンソールの測定値を抽出するため、それぞれ測定ID・HTMLタグを登録していきます。

またGoogleアドセンス広告を、インフィード広告や各見出しなどに挟んで表示する設定などができます。

Google連携に関する設定

Googleアナリティクスの測定IDの確認方法は、まずGoogleアナリティクスにアクセスし、管理を開き、プロパティ設定からデータストリームを開きます。

次に対象のアカウントが表示されたら、そのアカウントをクリックすると以下の画面に移行するので、ここに表示されている測定IDの「G-◯◯◯◯◯◯◯この部分をコピー」を、AFFINGER6のアナリティクスコードの入力枠へ貼り付けます。

GoogleサーチコンソールのHTMLタグの確認方法は、まずGoogleサーチコンソールにログインしておき、所有権確認ページに移行し、このページ内にあるHTMLタグの一部分をコピーして、AFFINGER6のサーチコンソールHTMLタグの入力枠へ貼り付けます。

これで、AFFINGER6とアナリティクス・サーチコンソールは連携完了です。

まだGoogleアナリティクス・Googleサーチコンソールを設定できていない方は、以下の記事でアカウント作成から詳しく設定する方法を解説しているので、ぜひ参考にしてください。

SHIN

Googleアドセンスの広告設定に関しては、それぞれ戦略があると思うので割愛します。

では次に会話アイコンの設定をしていきましょう。

≫ 会話アイコン設定

会話アイコンは、全部で8種類登録できます。

ピンポイントで会話をアイコンで挟みたいときに便利な機能ですよね。

このブログで登録しているのは、全部で7種類でサンプルは以下の通りです。

SHIN

僕が1ばん♪

僕が2ばん♪

あきら

かおり

私が3ばん♪

僕が4ばん♪

ボコリン

会話で使うアイコンは、著作権フリー画像を自作するのもいいですけど、僕はココナラでアイコン作成のプロの方に依頼して作っていただきました。

1アイコン数百円などで請け負ってくれる方も多いので、オリジナル画像を用意したい場合は、ぜひ活用してみてください。

SHIN

では最後にその他の設定をしていきましょう。

≫ その他設定

ここではウィジェット、演出、遅延読込、カスタム投稿一覧の設定、管理画面、テーマのアップデート更新通知の細かな設定ができます。

まずトップにある設定から見ていきましょう。

まず上から3つまでのチェックは、ユーザビリティを向上させるための設定なので、チェックを入れておくことをおすすめします。

また、最後のFontAwesomeIcons4.7.0の読み込みというのは、FontAwesomeIconsを利用する場合にはチェックを入れておきましょう。

FontAwesomeIconsは小さなアイコンですが、アクセントとして使う場合に便利なので、ぜひ活用してみてください。

≫ FontAwesome公式サイト

テーマのアップデート更新通知

この設定は、AFFINGER6のテーマ更新情報をWordPressダッシュボードで通知してくれるサービスです。

AFFINGER6は数ヶ月単位でテーマ更新するので、気づかないうちに新しいテーマに更新されている・・といったことがないように、このサービスは設定しておきましょう。

更新通知パスワードは、テーマAFFINGER6をダウンロードできるページに掲載されているので、こちらをコピーして貼り付け、有効化にチェックを入れるだけです。

SHIN

以上でAFFIGER6の初期設定は完了です。

この設定内容はテーマが更新されると変更される可能性もあるものの、一度設定しておけばほぼ変更する必要がないので、スムーズに記事作成に専念できます。

▶︎ まとめ

今回は、テーマAFFINGER6の初期設定（AFFINGER管理）のデフォルトより変更する箇所のみをまとめて解説しています。

ブログテーマ（ジャンル）などによって合う合わないはあると思うので、デザイン系に関してはご自身の任意で変えてみてください。

また、この設定に関してご質問などございましたら、お気軽にお問い合わせください。