WordPressのメニューを作成したけれども、文字表示だけでは少し物足りない感じがします。
そこで、この記事では、WordPressのメニューにアイコンを表示する方法を紹介します。
今回実施すること
Font Awesomeのプラグインをインストールする
次の手順でプラグインをインストールします。（→関連記事）
- WordPressのダッシュボードにログインし、[プラグイン]→[新規追加]をクリック。
- 「プラグインを追加」画面で検索窓へ[font awesome]と入力。
- 「Font Awesome」が表示されたら[今すぐインストール]ボタンをクリック。
- インストールが終わると[インストール]ボタンが「有効化」ボタンに変わるので、
その[有効化]ボタンをクリック。
「Font Awesome」サイトでアイコンのHTMLコードをコピーする
Font AwesomeのウェブサイトへアクセスしてアイコンのHTMLコードをコピーしてきます。
Font Awesomeのウェブサイト⇒ https://fontawesome.com/
WordPressのメニュータイトルへアイコンのHTMLコードをペーストする
Font AwesomeのウェブサイトでコピーしたアイコンのHTMLコードをWordPressのメニュー設定でペーストします。
- WordPressのダッシュボードで、[外観]→[メニュー]をクリック。
- アイコンを表示したいメニュー項目横の[▼]をクリック。
- ナビゲーションラベルにコピーしたHTMLコードをペースト。
- [メニューを保存]ボタンをクリック。
結果を表示する
このように表示されました。
コメント