AFFINGER6の初期設定を初心者さん向けにまとめてみた。

アフィンガー初心者さん向けにおすすめの初期設定をまとめました。

当記事は「とりあえず使えるようにする最初の準備編」が終わった方向けになります。

プラグインを追加する

おすすめプラグイン

  • Classic Editor
  • Advanced Editor Tools
  • WP Multibyte Patch
  • Google XML Sitemaps
  • SUGOI MOKUJI(すごいもくじ)LITE

当サイトで使っているプラグインの一覧です。

すごいもくじ(LITE)以外は、「プラグイン>新規追加」で検索できます。

 

プラグインの追加方法

  • プラグイン名をコピペして検索窓に貼り付ける
  • プラグインが表示されたら「今すぐインストール」をクリック

インストールが終わったら「有効化」してください。

ヒロ
下記にプラグインの簡単な説明も書きました。

 

Classic Editor

クラシックエディタで記事の編集が可能に。

今の主流は「ブロックエディタ」ですが、個人的にはクラシックエディタがおすすめです。

 

Advanced Editor Tools

エディタ機能を拡張。

ヒロ
おすすめの使い方も紹介します。

 

エディタに機能を追加する

  • プラグインを有効化したら「設定」をクリック
  • 画面が切り替わったら「スタイル」を追加

ヒロ
僕は「スタイル」のみ追加してます。

 

AFFINGER6「スタイル」の機能(抜粋)

  • アニメーション(動く文字)
  • ボックス(ワイド背景など)
  • 写真(枠線・ポラロイド風)
  • リスト(丸・簡易チェックなど)
  • テーブル(横スクロール・センター寄せ)
ヒロ
エディタに「スタイル」を追加したら、試しに使ってみてください。

 

WP Multibyte Patch

文字化け防止用。

 

Google XML Sitemaps

Google用サイトマップを自動で作成。(SEO対策に)

ヒロ
有効化するだけでOKです。

 

SUGOI MOKUJI(すごいもくじ)LITE

アフィンガー専用の目次プラグイン。(限定特典

ダウンロードは「購入ユーザー限定ページ」から。

 

すごいもくじ(LITE)の設定方法

  • ファイルをダウンロードする
  • 「プラグイン>新規追加」でファイルをアップロード
  • アップロード完了後に有効化

プラグインを有効化すれば、自動で目次が表示されます。

ヒロ
目次の設定は「管理画面>目次」から。

設定は難しくありません。

ヒロ
変更したらご確認ください。

 

プロフィール設定

プロフィールの設定は、管理画面「ユーザー>プロフィール」から。

ニックネームやプロフィール情報を入力し保存します。

 

プロフィール情報に入力された文章が、プロフィールカードに表示されます。

ちなみに、プロフィール写真はここで設定しなくても問題ありません

ヒロ
プロフィールカードについても紹介しますね。

 

プロフィールカードを追加する

プロフィールの設定が終わったら、「外観>ウィジェット」でプロフィールカードを追加。

追加するウィジェットは「11_STINGERプロフィールカード」です。

 

プロフィールはサイドバーに表示させてる方が多いです。

とくに決まりはないので、好きな場所に表示させてください。

 

プロフィールカードの種類

  • 旧プロフィールカード
  • プロフィールカード

アフィンガーでは2種類のデザインが用意されてます。

切り替えはとても簡単なので、お好きな方を選んでください。

ヒロ
プロフィールカードの設定についても説明します。

 

プロフィールカードの設定

プロフィールカードは「オプション(その他)>プロフィールカード」で設定します。

旧プロフィールカードに変更する場合はチェックを入れるだけでOK。

アバター画像はここで設定します。

ヒロ
プロフィールカード用の「ヘッダー画像」も追加できますよ。

 

ボタンURLを設定すれば、プロフィールカード下に表示されます。

ちなみに「旧プロフィールカード」では表示されません。

ボタンは「プロフィール」や「お問合せ」にリンクさせるといいかもです。

 

アイキャッチ画像の有効化

アフィンガーは初期状態だとアイキャッチ画像は表示されません。

なので設定を変更していきます。

 

アイキャッチ画像の設定は「AFFINGER管理>投稿・固定記事」から。

アイキャッチ画像の表示をすべての記事で有効化する」にチェックを入れてください。

ヒロ
これだけでOKです。

 

フォントの設定

フォントは「AFFINGER管理>全体設定」で設定します。

サイトのイメージに合わせて変更してください。

ヒロ
ちなみに「デフォルト」以外を使用すると、サイトの表示スピードは若干遅くなります。

 

フォントサイズを変更する

デフォルトのままだと、スマホの文字が大きいのでサイズを調整します。

ヒロ
気にならない方は変更しなくても大丈夫です。

 

当サイトのフォントサイズ(スマホ用)

  • 基本(pタグ):15
  • 記事タイトル:18
  • H2タグ:17
  • H3タグ:17

参考までに当サイトのフォントサイズを書いておきます。

サイズを変更した後は、スマホ画面でご確認ください。

 

ヘッダー画像の設定

サイトにヘッダー画像を設定する方法です。

ヘッダー画像の設定は「カスタマイザー>ヘッダー画像」から。

 

ヘッダーに設定したい画像を追加してください。

ヒロ
ヘッダー画像の作り方についても紹介しますね。

 

Canvaでヘッダー画像を作成

デザインツール「Canva」を使った方法です。(無料)

このツールを使えば、簡単に画像が加工できます。

ヒロ
Canvaのかんたんな使い方も説明しますね。

 

Canvaの使い方

  • 画面右上の「カスタムサイズ」をクリック
  • 幅「2200」高さ「500」と入力
  • 新しいデザインを作成ボタンを押す

  • 画面左側にある「アップロード」をクリック
  • ヘッダーに設定したい画像をアップロード
  • アップロードが終わったら画像をクリック

画像が「画面中央」に表示されます。

 

  • 画面中央に表示された画像を右クリック
  • 「背景を画像として設定します」を選択

これで準備完了。

ヒロ
テキストも追加できます。

 

ヘッダー画像が完成したら、画面右上の「ダウンロード」ボタンをクリック。

画像の種類は「PNG」「JPG」を選べます。

 

おすすめ画像サイト

お世話になってる画像サイトです。

ヒロ
どのサイトも無料で使えます。

 

お問い合せフォームを設置

お問い合せフォームの作り方を紹介します。

まずはプラグイン「Contact Form 7」をインストール。

 

有効化したら「設定」ボタンを押します。

編集画面に切り替わります。

 

表示された「コンタクトフォーム1」をクリック。

ショートコードをコピーし、固定ページのテキストに貼り付けます。

 

固定ページのテキストにショートコードを貼り付けたら保存をクリック。

これで「お問い合せフォーム」の設置完了です。

ヒロ
ちゃんと機能するか「テストメール」も送ってください。

 

他、迷惑メール防止用のチェックボックスも追加できます。

詳細は下記ページに書きました。

【簡単】ワードプレスにお問い合わせフォームを設置する方法

プラグインを使えば、初心者でも簡単にお問い合わせフォームが設置できます。 使用するプラグインは「Contact Form 7」。完成形はこちらです↓↓ 以下、お問い合わせフォームの設置手順です。 迷惑 ...

続きを見る

 

AFFINGER6初期設定まとめ

  • プラグインを追加
  • プロフィール設定
  • アイキャッチ画像の有効化
  • フォントの設定
  • ヘッダー画像の設定
  • お問合せフォームを設置

これだけ設定しておけば、当分は困らないと思います。

あとはマニュアル見ながら覚えていけば大丈夫です。

-AFFINGER6, 初期設定