AFFINGER6

【簡単】AFFINGER5の初期設定のやり方【10項目で解説】

【PR】当サイトではアフィリエイト広告を利用しています。

【簡単】AFFINGER5の初期設定のやり方【10項目で解説】
悩んでいる人
悩んでいる人
AFFINGER5(アフィンガー5)のインストールを無事終えました。初期設定のやり方を教えてください!

 

このような悩みにお答えします。

 

この記事を書いている人

 

AFFINGER5のインストールを終えたら初期設定をしなければいけないけど、どこをどういじったらいいかわからないですよね?

 

実は僕もはじめはそうでした。そこで、この記事では初心者の人でもわかりやすいように、AFFINGER5の初期設定のやり方を解説していきたいと思います。

 

項目は多いですが難しいことはなく、ほとんどがクリックや簡単な入力でできますので、参考にしてみてください。

 

AFFINGER5の初期設定のやり方

AFFINGER5の初期設定のやり方

AFFINGER5のインストールを終えた後に実施する初期設定は以下の手順です。

 

初期設定の手順

  1. パーマリンク設定
  2. 一般設定
  3. Classic Editorの導入
  4. 初期値の設定
  5. サイトのカラーパターン設定
  6. フォント設定
  7. SNS設定
  8. Google連携の設定
  9. 会話風アイコンの設定
  10. ヘッダー画像の設定

 

以上の10項目を順番に解説していきます。

 

①:パーマリンク設定

 

まずは、パーマリンクの設定をしていきましょう。

 

『設定』→『パーマリンク設定』

 


「設定」→「パーマリンク設定」→「/%postname%/」と入力

 

『カスタム構造』にチェックを入れ『/%postname%/』と入力すればOKです。

 

最後に『変更を保存』を押しておきましょう。これで記事投稿画面でパーマリンクのURLを変更することができます。

 

②:一般設定

 

一般設定では『サイトのタイトル』と『キャッチフレーズ』『タイムゾーン』の設定をします。

 


「サイトのタイトル」「キャッチフレーズ」「タイムゾーン」の入力

 

サイトのタイトルは入力必須ですが、キャッチフレーズはどちらでも構いませんので、ご自身のサイト運営に合うものを入力しましょう。

 

『タイムゾーン』は『東京』を選択します。

 

『変更を保存』を忘れずにしておきましょう。
Nari
Nari

 

③:Classic Editorの導入

 

AFFINGER5では『Classic Editorプラグインの利用を推奨しています』と記載されているので、プラグインを導入していきます。

 

『プラグイン』→『新規追加』

 

右上の検索窓に『Classic Editor』と入力

 


「プラグイン」→「新規追加」→「Classic Editorと入力」→「今すぐインストール」→「有効化」の手順

 

すでに薄く『有効』と表示されているのは、インストールが終わっているためです。

 

まだの人は『今すぐインストール』→『有効化』の順でClassic Editorをインストールしておきましょう。

 

次からはいよいよアフィンガー側の設定に入っていきます。
Nari
Nari

 

④:初期値の設定

 

AFFINGER5の初期値の設定をします。

 

『AFFINGER5管理』→『はじめに』

 


「AFFINGER5管理」→「はじめに」→「保存」をクリック

 

ここでは『保存』をクリックするだけで初期値が設定されます。

 

⑤:サイトのカラーパターンの設定

 

ここでは自分のブログのサイトカラーを決めていきます。

 

『AFFINGER5管理』→『デザイン』

 


「AFFINGER5管理」→「デザイン」

 

好きなサイトのカラーパターンを決めましょう。

 

ちなみに僕は『グレー』を選択していますよ。
Nari
Nari

 

細かいサイトカラーの設定は『外観』→『カスタマイズ』でできるので、ここは深く考えなくでもOKです。

 

⑥:フォント設定

 

ここではブログに表示される文字の大きさやフォントの種類をを設定していきます。

 

『AFFINGER5管理』→『デザイン』→『フォントサイズ』

 


「AFFINGER5管理」→「デザイン」→「フォントサイズ」

 

スマートフォン・タブレット・PC閲覧時の文字の大きさを調節できます。

 

僕と同じような大きさにしたいのであれば、上の図のサイズを参考にしてみてくださいね。
Nari
Nari

 

フォントの種類

 


フォントの種類

 

ここではフォントの種類を設定できます。

 

僕はデフォルト設定のままのフォントを使っていますが、フォントの種類にこだわりがあるのであれば、ここで設定することができますよ。
Nari
Nari

 

⑦:SNS設定

 

ここではTwitterカードを使用する際の『Twitter設定』をしていきます。

 

『AFFINGER5管理』→『SNS』→『Twitter設定』

 


「AFFINGER5管理」→「SNS」→「Twitter設定」

 

ご自身のTwitterを開いたら、Twitter名の下に表示されている『@』以降を入力します。コピペでもOK!

 

⑧:Google連携の設定

 

ブログではアクセスなどのデータを取るためにもGoogleアナリティクスとサーチコンソールの設定が必要です。

 

『AFFINGER5管理』→『Google・広告/AMP』

 


「AFFINGER5管理」→「Google/広告/AMP」

 

上の2か所にそれぞれコードを入力していきます。

 

アナリティクスコードの調べ方

 

『アナリティクスの管理画面』→『管理』→『トラッキング情報』→『トラッキングコード』

 

「UA-ooooooooooo」で始まるトラッキングIDが表示されますので、コピペしてアナリティクスコードのところに貼り付けます。

 

サーチコンソールHTMLタグの調べ方

 

『サーチコンソール管理画面』→『設定』→『所有権の確認』→『HTMLタグ』

 

HTMLタグが表示されますので、「content="0000000000000000000"」の色のついたところをコピペして、サーチコンソールHTMLタグのところに貼り付けます。

 

⑨:会話風アイコンの設定

 

次に、会話風アイコンの設定をしていきます。

 

お兄さん
お兄さん
このように、吹き出しに使うアイコンの設定ですね。

 

『AFFINGER5管理』→『会話・ファビコン等』→『会話風アイコン』

 


「AFFINGER5管理」→「会話・ファビコン等」→「会話風アイコン」

 

アフィンガーでは会話風アイコンを最大で8つまで作ることができます。

 

会話風アイコンがあることによって記事にメリハリがつき、読者さんを飽きさせることなく記事を読んでもらうために使うのが便利です。

 

アイコンがまだない人は『いらすとや』や『イラストAC』で無料で手に入るので気になる人は見てください。
Nari
Nari

 

⑩:ヘッダー画像の設定

 

ここではサイトのトップページに表示させるヘッダー画像の設定方法を紹介していきます。

 

『ワードプレス管理画面』→『外観』→『カスタマイズ』→『ヘッダー画像』

 

 

わかりやすいように背景色をつけていますが、デフォルトではこのようなヘッダー画像が設置されています。

 

ヘッダー画像を表示させたくなければ『画像を非表示』を、オリジナルの画像を使いたければ『新規画像を追加』より設定しましょう。

 

画面左のメニューより背景色だったり細かな設定ができるので、お好みで設定してみてくださいね。
Nari
Nari

まとめ:AFFINGER5の初期設定を終えたら、記事を書いていこう

この記事ではAFFINGER5の初期設定のやり方を解説してきました。

 

初期設定の手順

  1. パーマリンク設定
  2. 一般設定
  3. Classic Editorの導入
  4. 初期値の設定
  5. サイトのカラーパターン設定
  6. フォント設定
  7. SNS設定
  8. Google連携の設定
  9. 会話風アイコンの設定
  10. ヘッダー画像の設定

 

細かなカスタマイズは少しづつやっていっても問題はないので、初期設定を一通り終えたら記事を書いていきましょう。

 

また、当ブログのトップページの作り方や、ASPにまだ登録されていない人は下記の記事を参考にしてみてください。

 

今回は以上です。

 

あわせて読みたい【AFFINGER5】トップページをシンプルに魅せるカスタマイズ

あわせて読みたい【登録無料】初心者におすすめなアフィリエイトASP6つ【登録必須です】