本記事では、AFFINGER5（アフィンガー）でおすすめのカスタマイズ・装飾について、図解付きで解説します。
WordPress有料テーマ「AFFINGER5（アフィンガー）」は、「稼ぐ」に特化したアフィリエイターに人気のワードプレステーマです。
装飾やカスタマイズ多い分、使い方がわからない、難しいと言った声もよく聞きます。
そんなお悩みを解決します。
当サイトを運営している私も、最初はAFFINGER5（アフィンガー）の使い方がわからず、最初は苦労しましたが、よく使う機能だけを覚えればすごく簡単に作ることができるようになりました。
本記事の信頼性
本記事を書いている筆者（@hachi_nomad）は副業ブロガーとしてブログを運営しています。
- 当サイトもAFFINGER5（アフィンガー）を使ってカスタマイズをしています。
- ブログ経験0の初心者でも、当サイトを始めて3週間でAFFINGER5（アフィンガー）を購入し、設定を完了できました。
- AFFINGER5（アフィンガー）購入2週間で、収益を上げることができています。
本記事はこんな方におすすめ
- AFFINGER5（アフィンガー）の使い方を具体的に知りたい
- AFFINGER5（アフィンガー）でできるおすすめの装飾を知りたい
- AFFINGER5（アフィンガー）がどんなことができるか知りたい
もくじ
本記事はAFFINGER5（アフィンガー）公式で推奨されている「Classic Editor」を使った画面で解説します。
こちらの記事でAFFINGER5（アフィンガー）をインストールした後に必要なプラグインを紹介していますので、参考にしてくださいね。
-
AFFINGER5（アフィンガー）インストール後のカスタマイズまとめ【初期設定】
続きを見る
AFFINGER5（アフィンガー）の使い方を図解付きで解説【よく使うおすすめ装飾】
AFFINGER5（アフィンガー）でよく使う、おすすめの装飾と使い方を紹介します。
これさえ覚えておけば、1記事をきれいに書くことが出来ますよ。
チェックリスト
- 会話ふきだし
- ボックスデザイン
- 文字装飾
- 関連記事
- ボタン
会話ふきだし
会話ふきだしは人物を使って会話しているように見せる装飾です。
会話を本文の間に適度に入れることで、記事に緩急をつけることができるので、おすすめですよ。
会話ふきだしの使い方
まずは会話に使う登場人物の設定をしましょう！
AFFINGER5管理 > 会話・ファビコン等 > 会話風アイコンをクリックします。
【アイコン画像1】【アイコン画像5】という箇所が見えますね。
アイコンのタイトルを入れ、アップロードから、画像を挿入し、保存しましょう。
（ちなみに、私はよくいらすとやの画像を使います。）
【アイコン画像XX】の番号を覚えておいてください。
記事投稿の画面に戻ります。
タグ > 会話ふきだし > 会話1 をクリックします。
この「1」の数字が、設定の【アイコン画像1】に該当します。
こんな形で記事が表示されるので、間に会話に入れたい文字を入力しましょう！
これで完了です。
メモ
上記が例のように、「 r」半角スペース+rをいれると、逆向きの表示にすることができます。
ボックスデザイン
ボックスデザインは、最もよく使う機能の一つです。
ボックスデザインはいくつかありますが本記事では例を3つ紹介します。
- ポイント
- こんな方におすすめ
- チェックリスト
ポイントの例
ポイントの例
ポイント例：まとめ文でよく使います
ボックスデザイン > マイボックス > ポイント をクリックします。
以下が挿入されるので、間にテキストをいれましょう。
こんな方におすすめの例
タグ > ボックスデザイン > マイボックス（+CSSクラス）> こんな方におすすめ(v)をクリックします。
以下のテキストが挿入されるので、「これはダミーのテキストです」の部分を修正すると、書きたいテキストを表示できます。
チェックリストの例
チェックリスト
- ダミーテキスト
- ダミーテキスト
- ダミーテキスト
タグ > ボックスデザイン > マイボックス（+CSSクラス）> チェックリストをクリックします。
以下のテキストが挿入されるので、「ダミーテキスト」の部分を修正すると、チェックリストにしたいテキストを表示できます。
文字装飾
文字装飾のダミーです
文字装飾のダミーです
文字装飾の使い方
スタイル > テキスト > 赤字 をクリックします。
同様に、スタイル > マーカー > 青マーカー（細）をクリックすると青の下線マーカーを書けますよ。
関連記事
関連記事は、以下のような例です。
関連記事例
-
AFFINGER5（アフィンガー）がアフィリエイトにおすすめな3つの理由【メリット・デメリットも解説】
続きを見る
関連記事の使い方
「カード」をクリックします。以下テキストが挿入されます。
「id=」に記事ID、「label=」に"関連記事"などラベルを入力します。
これで完了です。
ボタン
ボタンを追加します。
ボタンの装飾はAFFINGER5（アフィンガー）は種類が多く、特徴となっている機能です。
ボタン例
ボタンの使い方
タグ > カスタム > ノーマル > 詳しくはコチラ（レッド）をクリックします。
「url=」にリンクを追加したいURL、「title=」にボタンのテキストを入力します。
「ref=」の「on」は最初からついていますが、以下のようなキラッとした動作をつける内容です。
私はあまり使わないので、「on」を取って「ref=""」にすると消すことができますよ。
AFFINGER5（アフィンガー）記事内での装飾のコツ
AFFINGER5（アフィンガー）は使える装飾がかなり多いですし、細かい調整もできます。
ですが、使いすぎてしまうと、ごちゃごちゃして目立たせたい内容がわからなくなってしまいます。
- 文字は3〜4色にしておく
- ボタン、見出し、ボックスなど使うときを固定して決めておく
- 過度なアニメーション動作は使わない
これを意識しておくと、わかりやすい装飾になると思います。
AFFINGER5公式サイトにも装飾や参考サイト例が紹介されていますので、ぜひチェックしてみてください。
-
AFFINGER5（アフィンガー）がアフィリエイトにおすすめな3つの理由【メリット・デメリットも解説】
続きを見る