こんにちは、ナオミです!
皆さんは、Diviの広告モジュールを使ったことがありますか?
そしてそこで表示されたアイコンのリストをみて、「これって他の場所で使えないのかな」って思ったことはありませんか?
実はビルダーを使ってなくても、Diviを使ってればサイトのどこでも使えちゃうんです。
ちなみに、このアイコンセットはフォントでして、『ETModules』というフォントです。
どうやって好きなアイコンを表示させるのか説明していきます。
好きなDiviのアイコンを見つける
まずはアイコンを見つけましょう。
https://www.elegantthemes.com/blog/resources/elegant-icon-font#glyphs
このページにアイコンのリストがあります。
使いたいアイコンを見つけます。
Diviアイコンを入れるためのHTMLとCSS
次に『テキスト』フィールドがあるDiviモジュールを探します。
今回は普通のテキストモジュールを使います。
テキストモジュールのテキストフィールドです。
画像のようにビジュアルではなく、『テキスト』タブを開きます。
そして次にこのようにコードを入れます。
<span style="font-family: ETModules;">{アイコンの文字列}</span>
この『アイコンの文字列』と書いてある所に、先ほど見つけたアイコンの下の文字列をコピペします。
<span style="font-family: ETModules;"></span>
このようにアイコンが表示されれば成功です。
テキストモジュールだけでなく、HTMLを挿入できる所ならどこでも使えます。
是非試してみてください!
Diviのことをもっと深く知りたい方は、Diviの使い方完全ガイドをご覧ください。