アフィンガー6(AFFINGER6)

【AFFINGER6】記事中のアイキャッチのデザインパターンを全部紹介!

2021年4月20日

AFFINGER6では記事中のアイキャッチはどんな風に表示されるの?

今回はAFFINGER6(※β版)で標準装備されているアイキャッチのデザインパターンを全部ご紹介します。これらはすべてボタン一つでお手軽に設定できます。

ちなみにデフォルトはこんな感じです↓何も表示されません。

AFFINGER6のアイキャッチ(デフォルト状態)
AFFINGERを導入した直後はアイキャッチは表示されません。

AFFINGER6アイキャッチのデザインパターンはこんな感じ!

それではAFFINGERでアイキャッチを設定していきます。

アイキャッチを表示する

まず、何もない状態からアイキャッチを表示させまます。表示する設定にするととこんな感じ。これがAFFINGERでは基本のアイキャッチスタイルです。タイトルの上にアイキャッチが大きく表示されてますね!

AFFINGER6のアイキャッチ(表示状態)
基本スタイルは一番上に大きなアイキャッチ。

タイトルと場所を入れ替える

アイキャッチとタイトルの場所を入れ替えたりもできます。アイキャッチが下に行き、タイトルが上に行きました。画像は標準の大きさに変わります。

AFFINGER6のアイキャッチ(キャプションを挿れた状態)
タイトルとアイキャッチの場所を入れ替えた状態

ワイド化

さらにアイキャッチとタイトルの場所を入れ替えた状態で、アイキャッチを大きしたりもできます。

AFFINGER6のアイキャッチ(タイトルと場所を入れ替えた状態、ワイド化)
アイキャッチとタイトルを入れ替えた状態でアイキャッチをワイド化

ポラロイド風

さらにアイキャッチをポラロイド風にできたりもします(アイキャッチとタイトルの場所を入れ替えた状態で)。アイキャッチに枠と影がついてポラロイド風になってるのが分かりますか?

AFFINGER6のアイキャッチ(タイトルと場所を入れ替えた状態、ポラロイド風)
アイキャッチがポラロイド写真風に

キャプションを挿れる

さらに、アイキャッチの写真に説明文(キャプション)やURLも表示することができます!写真を引用するときにURLを表示できて便利です!

AFFINGER6のアイキャッチ(キャプションを挿れた状態)
アイキャッチに説明文やURLを挿入できる

アイキャッチの設定方法はこちら >>

アイキャッチをヘッダーに!

もっとこだわりたい人はこれ!アイキャッチを記事のヘッダーにすることもできます。アイキャッチがヘッダー部分にドドーーンと現れてるのが分かるでしょうか?その上にタイトルやカテゴリ情報が載っています。(記事ごとのヘッダーデザイン)

AFFINGER6のアイキャッチデザイン(アイキャッチをヘッダーに)

アイキャッチが上部にドドーンと広がる

設定方法はこちら >>

-アフィンガー6(AFFINGER6)
-