WORDPRESS

AFFINGER5で便利な「Webアイコン」の種類と使い方【WordPressブログ】

AFFINGER5で便利な「Webアイコン」の種類と使い方 アイキャッチ



今回は、このブログでも愛用中のWordPressテーマ「WING(AFFINGER5)」における…

「Webアイコン」の種類と使い方

をご紹介していきたいと思います

まず「WING(AFFINGER5)」における「Webアイコン」とは、例えば…

明けない夜はありません

↑ こんなの

例文が急に重たい

ほかにも種類はたくさんあり、使い方も超簡単です

それではさっそく見ていきましょー🐥

ちなみに、Webアイコンの「色設定」をカスタマイズする方法は ↓ をどうぞ♪

AFFINGER5で「Webアイコン」の色設定をカスタマイズする手順 アイキャッチ
AFFINGER5で「Webアイコン」の色設定をカスタマイズする手順【WordPressブログ】

続きを見る

このブログのWordPress環境

\「本気」で戦うなら /

WING AFFINGER5 バナー 02

―― 検証と改善を重ねた唯一無二のテーマ ――

WING AFFINGER5

今なら超時短ツール「タグ管理プラグイン(4,980円)」の無料配布キャンペーン中!

About me

あずきアイコン main-01 背景透過

- 専業ブロガー・フリーランス -

あずき

独立3年目 / 元アパレル → 歴10年

20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます

普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^

Twitter

AFFINGER5における、「Webアイコン」の種類&使い方

Webアイコンの種類

pc-work-202001_01

WING(AFFINGER5)」におけるWebアイコンは全部で「7パターン」で、次の通りです

「はてな」アイコンです

「注意」アイコンです

「人物」アイコンです

「チェック」アイコンです

「メモ」アイコンです

「王冠」アイコンです

「初心者マーク」アイコンです

ちなみにこれらのWebアイコンは、初期設定で「カラー」が決まってますが、もちろんその配色は自由にカスタマイズできます

↑ の見本も、実際に愛用してる配色にカスタマイズした後のもの!

Webアイコンの「色設定」をカスタマイズする手順は ↓ をどうぞ♪

つづいて、肝心の使い方を見ていきましょう🐥

\「本気」で戦うなら /

WING AFFINGER5 バナー 02

―― 検証と改善を重ねた唯一無二のテーマ ――

WING AFFINGER5

今なら超時短ツール「タグ管理プラグイン(4,980円)」の無料配布キャンペーン中!

Webアイコンの使い方

pc-work-202001_02

まずは、Webアイコンを付けたいテキストを…

affinger-web-icon-20200314_2-01

↑ 普通に入力します

ビジュアルエディタのままでOK!

「ビジュアルエディタ」が何のことかわからない方は、↓ をどうぞ♪(超大切!)

WordPressの「ビジュアルエディタ&テキストエディタ」とは? アイキャッチ
WordPressの「ビジュアルエディタ&テキストエディタ」とは?【クラシックエディタにおけるブログ記事編集】

続きを見る

本題に戻って…

テキストを入力したら、そのテキストを…

affinger-web-icon-20200314_2-02

↑ 丸ごと選択します。 その状態で…

affinger-web-icon-20200314_2-03

↑ 画面上部の「スタイル」をクリックし…

affinger-web-icon-20200314_2-04

↑ そのなかの「アイコン」にカーソルを合わせると、Webアイコンの種類が表示されます

ここで、好きなアイコンを選びましょう

今回は例として、「チェック」を選んでみたいと思います

affinger-web-icon-20200314_2-05

↑ 選ぶと、テキストの左側に □ のマークが付きます

編集画面だと実感がないですが、これでもうWebアイコンは挿入完了です

プレビューで見てみると…

affinger-web-icon-20200314_2-06

↑ チェックアイコンが無事付きました

「Webアイコン」の基本的な使い方は、これでOKです

お疲れさまでした♪

あずき🐥

Webアイコンの「色設定」をカスタマイズする方法は、↓ をどうぞ♪

AFFINGER5で「Webアイコン」の色設定をカスタマイズする手順 アイキャッチ
AFFINGER5で「Webアイコン」の色設定をカスタマイズする手順【WordPressブログ】

続きを見る

\「本気」で戦うなら /

WING AFFINGER5 バナー 02

―― 検証と改善を重ねた唯一無二のテーマ ――

WING AFFINGER5

今なら超時短ツール「タグ管理プラグイン(4,980円)」の無料配布キャンペーン中!

About me

あずきアイコン main-01 背景透過

- 専業ブロガー・フリーランス -

あずき

独立3年目 / 元アパレル → 歴10年

20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます

普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^

Twitter

-WORDPRESS

© 2020 あずきのぶろぐ