mochiです！
サイト見てるとブラウザーのタブにアイコンが表示されているのを見て、自分のサイトにも表示させたいな〜と思っていました。そこで、導入しました！
今回は、ブラウザータブ&スマホのホームにアイコンを表示させる方法の紹介です。
とか、スマホのホームにショートカットを作った時に表示されるこれ！
環境
ブログサービス：WordPress
テーマ：Simplicity2
準備するもの
■ 表示したいiconを下記のファイル形式に変換します。
→iconデザインはKeynoteやPowerPointで作成もしくは、icon作成サイト等で作成します。
■ favicon用ファイル
→ファビコンで検索するとファイル変換できる無料のサイトがあるのでそちらで変換して下さい。mochiは、FavIcon from Picsを利用しました。
■ スマホホーム用iconファイル
→画像圧縮サイトもしくはソフト等で圧縮します。mochiのオススメはtoyviwer(macのフリーソフト)です。
プラグイン（Favicon Rotator）
今回は、Favicon Rotatorを使って説明します。
1. WordPressにFavicon Rotatorのプラグインをインストール→有効化します。
2. Appearance(外観) → Faviconをクリック
3. Browser Icon：ブラウザーのタブに表示されるicon
→Add Icon①をクリックしてfavicon用に作成したファイルを選択します。
4. Touch Icon：スマホのホーム画面にショートカットを作成した時に表示されるicon
→Set Icon②をクリックして、icon用に圧縮したファイルを選択します。
(ここでファビコン用に作成したファイルを選択することも出来ますが、解像度が低すぎることがあるので、もう少し大きいものが良いです。mochiのは100KBくらいのサイズですがちょっと大きすぎると思います…あとで改善します。)
5. Save Changes③をクリック。
終了！
Simplicityいじってたらplugin使わなくってもファビコンの表示出来たみたい…まあ出来たから良いか！スマホホーム用iconも設定できたしね！
