前回の記事を書いてから7ヶ月も経ってしまいました・・・。
爺さんになるまで続けたいと書いておきながら、これは1年後も怪しい・・・。
というわけで、しばらくSANGOのアップデートをしていなかったので、本日バージョン1.4から1.7.6にアップデートしました。
アップデート作業には何の問題もありませんでしたが、一部のアイコンが表示されなくなったので、その対処法を書いておきます。
目次
どこのアイコンが消えた?
当ブログでは以下のアイコンが消えました。
サイドバープロフィールのTwitterアイコン
モバイルフッター固定メニューのアイコン
消えたアイコンを再表示させる手順
何で消えたのかは分からないし、その原因にも興味はない。表示できればいいんだ!という方は以下の変更を行うだけでOKです。
変更内容
外観 > ウィジェット > サイドバー > プロフィール用のカスタムHTML
「内容」に入力されている以下の文字を変更します。
<i class="fa fa-twitter"></i>
<i class="fab fa-twitter"></i>
外観 > メニュー > モバイルフッター固定メニューに対応するメニューを選択
各メニュー項目のカスタムリンクを展開し、ナビゲーションラベルに設定されている文字を変更します。
<i class="fa fa-thumb-tack"></i>フォロー
<i class="fa fa-level-up"></i>トップ
<i class="fas fa-thumbtack"></i>フォロー
<i class="fas fa-level-up-alt"></i>トップ
変更後の表示
サイドバープロフィールのTwitterアイコン
モバイルフッター固定メニュー
ちゃんと表示されました。
なぜアイコンが消えた?
原因
アイコンが消えたのは、SANGOが利用しているFontAwesomeのバージョンが4.7から5に変わったためです。(SANGO v1.7より)
クラス名(※)が変更されているアイコンの場合、これまでの記述では対応するアイコンが存在しないため、表示されなくなったわけです。
※上記変更コードにおけるclass=”AAA”のAAA部分
詳しくは以下のリンク先をご覧ください。
参考 SANGOでFontAwesome4.7から5へと切り替える方法と注意点サルワカ消えなかったアイコンもついでに変更
当ブログでは、以下のアイコンは消えませんでしたが、併せて変更しておきました。
- サイドバープロフィールのRSSアイコン
- メインメニューの各アイコン
- モバイルフッター固定メニューのホーム、シェア、メニューアイコン
先ほど変更したアイコンも含めて、今回変更した部分を全て書いておきますね。
サイドプロフィール
外観 > ウィジェット > サイドバー > プロフィール用のカスタムHTML > 内容
<i class="fa fa-twitter"></i>
<i class="fa fa-rss"></i>
<i class="fab fa-twitter"></i>
<i class="fas fa-rss"></i>
モバイルフッター固定メニュー
外観 > メニュー > モバイルフッター固定メニューに対応するメニューを選択 > メニュー構造 > カスタムリンク > ナビゲーションラベル
<i class="fa fa-home"></i>ホーム
<i class="fa fa-share-alt"></i>シェア
<i class="fa fa-thumb-tack"></i>フォロー
<label for="drawer__input"><i class="fa fa-list-ul" aria-hidden="true"></i>メニュー</label>
<i class="fa fa-level-up"></i>トップ
<i class="fas fa-home"></i>ホーム
<i class="fas fa-share-alt"></i>シェア
<i class="fas fa-thumbtack"></i>フォロー
<label for="drawer__input"><i class="fas fa-list-ul" aria-hidden="true"></i>メニュー</label>
<i class="fas fa-level-up-alt"></i>トップ
メインメニュー
外観 > メニュー > メインメニューに対応するメニューを選択 > メニュー構造 > 固定ページ > ナビゲーションラベル
<i class="fa fa-sitemap" aria-hidden="true"></i>サイトマップ
<i class="fa fa-user" aria-hidden="true"></i>プロフィール
<i class="fa fa-user-secret" aria-hidden="true"></i>プライバシーポリシー
<i class="fa fa-envelope" aria-hidden="true"></i>お問い合わせ
<i class="fas fa-sitemap" aria-hidden="true"></i>サイトマップ
<i class="fas fa-user" aria-hidden="true"></i>プロフィール
<i class="fas fa-user-secret" aria-hidden="true"></i>プライバシーポリシー
<i class="fas fa-envelope" aria-hidden="true"></i>お問い合わせ