こんにちは、すろーらいふです。
本日はCocoonのグローバルメニューにアイコンを入れるカスタマイズ方法をご紹介します。
とても簡単に設定できるので是非試してみてください♪
Cocoonテーマが最強な理由≫【WordPressテーマ】収益化を目指す初心者にCocoonをおすすめする5つの理由!!
Cocoonのグローバルメニューをカスタマイズしてアイコンを入れてみた
グローバルメニューにアイコンを入れた完成形がコチラです。

「ホーム」「子育て」「ブログ」「英語」「お仕事」「生活/家事時短」だけだと味気ないですよね。
そこで、グローバルメニューにアイコンを入れる方法について解説します。
簡単3ステップで設定|cocoon グローバルメニュー カスタマイズ
簡単3ステップで設定が完了します!
- 「外観」→「メニュー」
- ヘッダー下に入れたいメニューを選択
- ナビゲーションラベルに入れたいアイコンのコードを入れる
1. 「外観」→「メニュー」を選択する
2. ヘッダー下に入れたいメニュー(グローバルメニュー)を「編集するメニューを選択」から選択
3. ナビゲーションラベルに表示させたいラベル名を記載するときにアイコンのコードを入れる

アイコンのコードはコチラのサイトが便利です。Font Awesome Icons
使用したいアイコンをクリックして、コードをコピー(この場合はサーモメーターのアイコン)
<i class="fa fa-thermometer-quarter" aria-hidden="true"></i>
先ほど表示させたいラベル名の前に上記コードを貼り付けるだけ!
これで完了です♪
【Cocoonカスタマイズ】グローバルメニューにアイコンを入れる方法
【Cocoonカスタマイズ】グローバルメニューにアイコンを入れる方法について解説しました。
とても簡単に設定でき、おしゃれなので、目を引くこと間違いなしです!
本日も最後までご覧いただきありがとうございました♪
\Cocoonに関するほかのカスタマイズ方法/
コメント