WordPress4.3でファビコン(サイトアイコン)を設定する手順

WordPress4.3でファビコン(サイトアイコン)を設定する手順

WordPress4.3でファビコン(サイトアイコン)を設定する手順
  • シェアしてね♪
  • このエントリーをはてなブックマークに追加


  • 一式98,000円~の格安プランをご用意!Web制作お任せください!
  • このエントリーをはてなブックマークに追加

WordPress4.3から、管理画面上でファビコン(サイトアイコン)が簡単に設定できるようになりました。

画像を用意して設定するだけではありますが、ファビコンを設定する手順について解説したいと思います。

スポンサードリンク

WordPress4.3でファビコンを設定する方法

WordPress4.3でファビコンを設定する方法は、以下の通りです。

1. WordPress管理画面より[外観] – [カスタマイズ]にアクセスします。
2. [サイト基本情報]を選択します。

サイト基本情報

3. 「サイトアイコン」の[ファイルを選択]をクリックします。

ファイルを選択

4. ファビコンとして設定したい画像をアップロードします。画像のサイズは512*512px以上が推奨されています。
5. 右側のプレビューを確認しながら、画像の切り抜き範囲を設定します。

画像切り抜き

6. [切り抜かない]もしくは[画像切り抜き]をクリックします。

これでファビコンの設定は完了です。サイトアイコンの部分には、設定した画像が表示されるようになります。

サイトアイコン設定完了

サイトアイコンを設定することで、以下のようなコードが</head>直前に出力されます。

<link rel="icon" href="http://hogehoge.com/wp-content/uploads/2015/08/cropped-logo-32x32.png" sizes="32x32" />
<link rel="icon" href="http://hogehoge.com/wp-content/uploads/2015/08/cropped-logo-192x192.png" sizes="192x192" />
<link rel="apple-touch-icon-precomposed" href="http://hogehoge.com/wp-content/uploads/2015/08/cropped-logo-180x180.png">
<meta name="msapplication-TileImage" content="http://hogehoge.com/wp-content/uploads/2015/08/cropped-logo-270x270.png">

上記のように、サイズ違いやiOSのホーム画面用のアップルタッチアイコンなども自動生成してくれます。

なお、管理画面でも読み込まれるので、全ページでブラウザのタブにファビコンが表示されるようになります。

あとがき

今まではテーマ側が対応していなければ、自分でテーマを編集して設定する必要がありました。それがどのテーマでも管理画面から設定できるようになったのはありがたいですね。

この記事が気に入ったら
いいね!してね♪

Twitter で
スポンサードリンク

関連記事

コメントを残す

メールアドレスが公開されることはありません。