Font Awesomeのアイコンが変更されません

カテゴリ 【CMS】通常版(不動産・中古車販売など)
タイトル Font Awesomeのアイコンが変更されません
質問者 匿名希望さん (1925)
質問日時 2023/04/18 13:28 回答数 2
メディア共有 このエントリーをはてなブックマークに追加
質問内容

使用しているテンプレート tp_fudosan16_brown_cms

「よくいただく質問」の<dl class="faq">で使用されているFont Awesomeのアイコンを変えたいと思っております。
そこでCSS内の下記箇所を変更しました。
※変更後はマップ用のアイコンです
-----
/*アイコン(Font Awesome)*/
.faq dt::before {
font-family: "Font Awesome 5 Free"; /*Font Awesomeを使う指定*/
content: "\f041"; /*使いたいアイコン名をここで指定。Font Awesomeに記載されています。詳しくは当テンプレートのマニュアルを読んで下さい。*/
color: #957e63; /*アイコンの色*/
padding: 0 20px; /*上下、左右への余白*/
}
-----
しかし変更後のCSSをアップロードしてもアイコンは変わらず当初の「?」のままです。
「詳しくは当テンプレートのマニュアルを読んで下さい。」とありますがFont Awesomeに関するマニュアルが見つけられませんでした。

Font Awesomeのマップ用のアイコンに変更するにはどのようにすればいいでしょうか。

質問に回答するには、ログインしてください。

回答(2件)

回答者:
テンプレートパーティーサポートさん (21)
回答日時:
2023/04/18 15:05

お世話になっております、テンプレートを制作しているテンプレートパーティのサポート担当です。

Font Awesomeですが、表示されない場合は以下の順番で確認してみて下さい。

1.ブラウザのキャッシュをクリアする。
Google検索などで「スーパーリロード」と検索すれば簡単にクリアするショートカットが出ると思います。
(Macでしたらコマンド + Shift + Rでクリアできます)

2.Font Awesomeの「無料」のアイコンを選んでいるか確認。
Font Awesomeの画面構成が頻繁に変わってしまうのですが、現時点だと、
https://fontawesome.com/v5/search
アイコン一覧の上あたりに「Free」というボタンがあるのでそれを押しておくとFree版だけ出てきます。この中から選ぶようにして下さい。

3.cssに以下の1行を追加してみる。
font-weight: bold;
今のFontAwesomeがどうなっているかわかりませんが、少し前まではこの1行がないとアイコンが出ない場合がありました。

解決しない場合は、お手数ですがGoogle検索などでFont Awesomeを検索して下さい。

大変参考になりました


回答者:
q19cms担当者さん (2341)
回答日時:
2023/04/18 14:22

ファイルを変更しても変わらないのであれば、ブラウザキャッシュの影響が考えられます。

cssやhtmlファイルを変更した場合、ブラウザのキャッシュ機能により、すぐに画面に反映されない場合があります。
変更後ブラウザのキャッシュクリアかリロードをしてみてください。
方法はブラウザごとに異なりますので、ご利用のブラウザの方法を調べてください。
GoogleChromeの場合は、Ctrl+R(ctrlキーを押しながらrを押す)です。

大変参考になりました


2件中 1 ~ 2