こんにちは。
Aoirolife運営者のあおいろです。
Twitterはこちらから→@ao_bloger
今回はAFFINGER6を導入したての方向けに、見出しデザインのカスタマイズ方法を画像付きでわかりやすく解説します。
AFFINGER6は最初から入ってる機能で十分自分好みにカスタマイズできますのでぜひやってみてください。
AFFINGER6見出しデザインのカスタマイズ方法

さっそく見ていきましょう。
見出しデザインのカスタマイズ手順
AFFINGER6の見出しデザインは下記の手順でカスタマイズすることができます。
【 外観 】→【 カスタマイズ 】→【 見出しタグ 】→【 各見出しの色とデザインを決定 】
1.ワードプレス管理画面の外観→カスタマイズの順にクリック

2.見出しタグ ( hx ) / テキストをクリック

3.カスタマイズしたい見出しを選択

各見出しの説明
- H2タグ‥見出し2
- H3タグ‥見出し3
- H4タグ‥見出し4
- H5タグ‥見出し5
ここでは見出し2のカスタマイズをしていきますので、「H2タグ 」をクリックします。

※h2タグ ( 見出し2 ) は記事内の章の内容を要約した大きな見出しになります。
目次でみると画像の赤枠部分がh2タグ ( 見出し2) になります。
例:Twitter感謝企画とは?やるべき理由と3つの注意点 目次

4.見出しタグ ( hx ) /テキストでH2タグをクリックしたらデザインと文字色、背景色を決める。
赤枠のボックス内でデザインと色をカスタマイズできます。

記事をひらいてデザインを見ながらカスタマイズするとわかりやすいです。
↓↓↓

見出しデザインのカスタマイズ手順は以上です。
次の章でAFFINGER6の見出しの基本デザインの種類を一気にみていきましょう。
見出しデザイン一覧
1:吹き出しデザイン ( 当ブログ採用 )

2:囲み左ラインデザイン

3:2色アンダーライン

4:グラデーションアンダーライン
2色アンダーラインに似ていますが、こちらは色がグラデーションになっています。

5:センターライン

6:囲みドットデザイン

7:ストライプデザイン

8:破線アンダーライン

9:左ラインデザイン

10:チェック ( ボックスタイプ )

11:なし

以上がAFFINGER6見出しの基本デザインです。
あとは基本デザインのボックスの角を丸くしたり、テキストを中央によせたりもできます。

※青枠部分にチェックを入れて補足でカスタマイズできる

補足のカスタマイズ一覧
- ボーダーを上下のみにする
- ボーダーを太くする ( 下をサブカラーに )
- テキストを中央寄せ
- デザインを幅一杯に
- 背景や吹き出しの角を丸くする
- グラデーションを横向きにする
最後に:AFFINGER6見出しデザインはブログの雰囲気にあわせてカスタマイズしよう
以上AFFINGER6での見出しデザインのカスタマイズをご紹介しました。
AFFINGER6の見出しは最初から入っている機能でかなり多くのパターンをつくることができます。
自分のブログの雰囲気に合わせて好みにカスタマイズしていきましょう。

見出しデザインを変えたかった方の参考になれば幸いです。
今回は以上です。