affinger-web-icon-20200314_ec

WordPress

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



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

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

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

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

明けない夜はありません

↑ こんなの

例文が急に重たい

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

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

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

affinger-color-setting-icon-20200317_ec
AFFINGER5で「Webアイコン」の色設定をカスタマイズする手順【WordPressブログ】

続きを見る

当ブログのWordPress環境

  • 使用してるテーマ:WING(AFFINGER5)
  • 使用してるエディタ:旧エディタ(クラシックエディタ)
  • 使用してるプラグイン:↓ の記事ですべて公開してます

WordPressブログで愛用中のおすすめプラグイン「16個」と設定方法をまとめて公開

wing300_gif_osusume

WordPressテーマ WING(AFFINGER5)

この記事を書いた人

azuki_01

あずき

専業ブロガー / フリーランス3年目 / 元アパレル / WordPressとSEOを独学で学んで、10年間の会社員生活から独立しました

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

Webアイコンの種類

pc-work-202001_01

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

「はてな」アイコンです

「注意」アイコンです

「人物」アイコンです

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

「メモ」アイコンです

「王冠」アイコンです

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

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

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

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

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

wing300_gif_osusume

WordPressテーマ WING(AFFINGER5)

Webアイコンの使い方

pc-work-202001_02

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

affinger-web-icon-20200314_2-01

↑ 普通に入力します

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

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

wp-editor-visual-and-text-20200308_ec
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アイコンの「色設定」をカスタマイズする方法は、↓ をどうぞ♪

affinger-color-setting-icon-20200317_ec
AFFINGER5で「Webアイコン」の色設定をカスタマイズする手順【WordPressブログ】

続きを見る

wing300_gif_osusume

WordPressテーマ WING(AFFINGER5)

この記事を書いた人

azuki_01

あずき

専業ブロガー / フリーランス3年目 / 元アパレル / WordPressとSEOを独学で学んで、10年間の会社員生活から独立しました

-WordPress

Copyright© あずきのぶろぐ。 , 2020 All Rights Reserved.