ブラウザのタブにファビコンを設定しました。 – こつこつライフ.com

カスタマイズ ワードプレス

ブラウザのタブにファビコンを設定しました。

投稿日:

ブラウザのタブに、自分のサイトとわかるようなロゴマーク、favicon(ファビコン)をつけたいと思いました。

色々調べた結果、画像をアップロードして画像URLをコピーし、 headタグの中に以下の記述を追加という流れがありました。

WordPressだと、ダッシュボードで「外観」→「テーマ編集」→「ヘッダー(header.php)」と進んで、</head>の上に<link rel=”shortcut icon” href=”あなたのファビコン画像のURL”>を追加するようです。

<head>
~途中省略~
<link rel=”shortcut icon” href=”あなたのファビコン画像のURL”></head>

色々なやり方があり悩んでいたところ、途中で、stinger8のテーマでは簡単に設定できることが判明。

「外観 」→「 カスタマイズ 」と進むと、下の方にあった!

「サイトアイコン」という名前でした。

サイトアイコン設定

画像を選択して、プレビューを見ます。

サイトアイコン設定

↓↓↓↓↓

ちょっとさみしいので(笑)、ロゴ入りのものに変更。
画像のトリミングもここでできます。

↓↓↓↓↓

1つの画像が、アプリとブラウザのアイコンで使用されるので便利!

アプリのホーム画面にしてもらえるようになったら(夢)嬉しい♪

ブラウザアイコンは、見えづらくて目立ちませんでした(写真左)。
上級者だと、色々カスタマイズ設定できそうです。

風邪気味で寒気がしているので、ここまでにしよう・・・(T_T)

本日もブログをご覧いただきありがとうございました!