8日目-ブラウザのタブやブックマークに表示されるアイコンを変更しました。

2021-02-162023-07-30

はじめに

Google Adsense 、なかなか審査結果の通知がきませんね。
本当に待ち遠しいです。

最近Twitterでフォローいただいた方々から、支援をしていただけるという連絡を多数頂いています。
とても嬉しいですね。

直接お話ししていただけるという方も現れて嬉しいです。
先輩方にわからないことを聞けるなんて貴重です。

僕のブログを開いたときにタブに表示されるアイコンの見栄えが悪い

WordPressでブログを開始して一週間立ちました。

今日になってようやく気づきました。
僕のサイトのアイコンがおかしな画像になっていることについて。

例えば、Google先生の検索結果ページを開いた状態でブラウザのタブを見ると、このようにGoogle専用のアイコンが表示されます。

このアイコンのことを ファビコン(favicon) というそうです。（僕らの世代だと、ファミコンを連想してしまう）

さて、今日はこの ファビコン を変更してみたいと思います。

サイトのアイコン(ファビコン)を変更してみよう！

それではサイトのアイコンを変更してみます。

0. 前提

前提として、僕はWordPressの Luxeritas Theme というものを利用しています。

したがって、このテーマを利用した際のアイコン設定手順の説明となってしまいます。
（他のテーマでも同じかどうかはわからず。すみません。）

1. WordPress管理ページを表示

WordPressで管理ページにログインします。

2. メニューから「カスタマイズ(外観)」を開く

管理ページの左メニューから 「Luxeritas」>「カスタマイズ(外観)」 を開きます。

3. サブメニューから「サイト情報/サイトアイコン」を開く

更に表示された左サブメニューから 「サイト情報/サイトアイコン」 を開きます。

4. 「サイトアイコンを選択」ボタンを押す

更に開いたページから 「サイトアイコンを選択」 のボタンを押します。

画像を指定するダイアログが表示されますので、自分の好きなイメージを選択します。

僕は、いらすとやさんから選んだ「お金」の画像を使いました。
選んだ画像は .png と言われる拡張子を持つものでしたが、問題なく利用できました。( .ico でないといけなかったり、サイズを小さくしないといけないといった情報がWeb上にはありますが、 Luxeritas** は賢いですね。 )

5. 必要があれば画像を切り抜く

画像の選択が終われば、今度は画像の切り抜き設定ページが表示されます。

切り抜きが必要であればこのページで調整できるようですが。僕は切り抜きが必要ないのでそのままにしておきましあt。

6. 「公開」ボタンを押して終了

最後に、戻ってきたページの「公開」ボタンを押して終了です。

ひとこと

無事にブラウザのタブに表示されるアイコンがお金のアイコンになりました！
お金持ちのブログっぽく見えますね。

昨日までのとーちゃんの収支

まだまだ収益はなしです。
SBI証券 に登録してみました。ブログだけではなく、株も始めてみようと思います。

早速、今まで少しずつためた 100,000円 を投入してみます！