ごけたです。
サイトアイコンは別名ファビコン「favicon」。
「favorites icon (お気に入りアイコン)」の略だそうです。
はじめに
WordPress Twenty Sixteen カスタマイズ シリーズ その2-1
今回は「外観」→「カスタマイズ」→「サイト基本情報」の続き。
「サイトアイコン」についでです。
ページ構成
画像、ソースコード、その下に説明文の構成になっています。
画像はクリックすると拡大されて表示されます。
リンクは予告なく削除される場合がございます。
OSはWindows、ブラウザーはchrome、
レンタルサーバーはエックスサーバーです。
サイトアイコンとは
![]()
サイトアイコンは「サイト基本情報」の表示の説明にもあるように、
タブやブックマーク、Wordpress モバイルアイコンとして表示されます。
サイトアイコンを設定する前に、「Wordpress サイトアイコン」で検索しました。
「Wordpress Codex 日本語版」の「faviconの作成」を読みました。
その中の
faviconを使用する場合は以下のセクションでの説明ではなく、
サイトアイコン機能を使用してください。
favicon.ico ファイルを自分で作成したり、テンプレートを変更する必要はなく、
カスタマイザー画面から縦横512ピクセル以上の正方形の画像を指定すれば済みます。
と書かれています。
と、言うことはこれまでファビコン(サイトアイコン)の
「ico」の拡張子に変換するためのソフトやプラグインは無視して、
「GIF」や「PNG」ファイルの画像でOKと解釈しました。
でもページ一番下の「.pngや.gifよりも.icoを使用する利点」は
今回は無視して行います。
サイトアイコンを表示してみる
サイトアイコン設定はWordpressの管理画面左メニューの
「外観」から「カスタマイズ」をクリック。
「サイト基本情報」内にあります。
サイトアイコンは「サイト基本情報」の表示の説明にもあるように、
「512×512ピクセル以上」が推奨です。
ここでは既にサイトアイコンを作成済みとして進行します。
※サイトアイコンの保存拡張子は「png」にしています。
サイトアイコンの「画像を選択」をクリックします。
任意の場所にある「サイトアイコン」を選択します。
![]()
画像を選択すると「サイト基本情報」にタブでのプレビューが表示されます。
このサイトアイコンで決定なら、一番上の「公開」をクリック、
一番左上の「x(バツマーク)」をクリックして、カスタマイズ画面を閉じます。
![]()
アンドロイドの「ホーム画面に追加」を使用して、
サイトアイコンを実際に表示させた画像。
一番左が推奨の「512×512ピクセル」で正方形のアイコン。
真ん中が分かりずらいですが「512×512ピクセル」で角を丸にしたアイコン
一番右が「512×512ピクセル」背景に馴染むように、
文字以外は背景を「透明」指定で作成したアイコン。
![]()
今回サイトアイコンは全て「photoshop Elements 2018」で作成しました。
一番右の背景を「透明」指定で作成したアイコンは
新規作成画面で一番下の「カンパスカラー」を「透明」で指定してます。
どのサイトアイコンも保存時の拡張子は「png」です。
さいごに
「Wordpress Codex 日本語版」の「faviconの作成」の
最終更新日は「2016年5月22日 」です。
そこを踏まえて「.png」であれば、その前は「favicon」以外でもいいのかも知れません。
最後までお合い下さいまして有難うございました。