【広告】

Amazonブラックフライデーが12月2日まで開催中です!

個人的には、Anker製品か、コカ・コーラがかなり安くなっているのでおすすめです!

高級キーボードで有名な東プレが最近発売した「REALFORCE R3」もセールをやっていました!詳しくはこちらの記事を確認してみてくださーい。

【Bookmark Favicon Changer】ブックマークのアイコンを変更するChrome拡張機能の使い方

2021年10月19日Chrome

Bookmark Favicon Changer のアイコン

この記事では、ブックマークを好きな画像に設定できるChrome拡張機能「Bookmark Favicon Changer」について書きます。

【Bookmark Favicon Changer】ブックマークのアイコンを変更するChrome拡張機能の使い方

ブックマークのアイコンを好きな画像に変更できるchrome拡張機能です。

好きな画像を用意 → アイコンを変更したいブックマークサイトを開く → 変更 の3ステップで変更できます。

サイトによっては、ブックマークしたら真っ白のアイコンになる時があるので、自分の好きな画像に変更できるのはとても便利です。Amazon のショッピングサイトとプライムビデオはアイコン一緒なので、区別するにも使えます。

読み方は「ブックマーク ファビコン チェインジャー」です。

提供元:sonthakit
最終アップデート:2.21(2014年6月13日)

ダウンロード方法

chromeウェブストアからダウンロードできます。

「chromeに追加」をクリックします。

Chromeに追加

拡張機能を追加をクリックします。

「Bookmark Favicon Changer」を追加しますか?

画面右上に、Bookmark Favicon Changer のアイコンが追加されます。

ダウンロードは完了です。

Chrome拡張機能のアイコン

使い方

「Bookmark Favicon Changer」でアイコンを変更する方法は2つあります。用途に分けて使い分けるのがおすすめです。

変更方法こんな人におすすめ
開いているページのブックマークを変える(詳しく変更したいブックマークの数が少ない人
ブックマーク一覧表示の中から変える(詳しく沢山、ブックマーク画像を変更したい人

どちらにも共通しているのはブックマークに設定したい画像を事前に準備しておくことです。

今回は、Amazonのショッピングサイトとプライムビデオのブックマークが一緒で紛らわしいので、プライムビデオのアイコンを変更しようと思います。

Amazonとプライムビデオのアイコンが見分けがつかない

アイコンにしたい画像を探します。

アイコンといえば、拡張子が「.ico」のイメージですが、Bookmark Favicon Changerでは「.jpg」や「.PNG」などの画像拡張子でも対応しています。初心者でもありがたいです。

適当にインターネットから画像を探します。

「プライムビデオ」で画像検索

右クリック → 名前をつけて画像を保存をクリックします。

良さげなアイコンを右クリックで名前を付けて画像を保存

これで下準備は完了です。

開いているページのブックマークを変える

まず、ブックマーク画像を変更したいサイトを開きます。今回の場合はプライムビデオを開きます。

次に、Bookmark Favicon Changer のアイコンをクリックします。

Chrome拡張機能アイコンのクリック

黄色で囲まれた場所の中から、変更したいURLをクリックして「Change icon and add rule」をクリックします。

今回は、Amazonショッピングとプライムビデオのアイコンを区別したいので、3番目のURLを選びます。

You can add more tab icon rule for this domain.
URLURLの意味
https://www.amazon.co.jp/Amazon-Video/b/?ie=UTF8&node=(省略)プライムビデオのホーム画面のみアイコン変更
https://www.amazon.co.jp/Amazon-Video/b/*「b/」がつくまでのプライムビデオのサイトのアイコン変更
https://www.amazon.co.jp/Amazon-Video/*プライムビデオ全体のアイコン変更
https://www.amazon.co.jp/*Amazon全体のアイコン変更

ちょっと専門用語になりますが、ドメインレベルでブックマークのアイコンを調整するってことです。Amazon の場合だと、「https://www.amazon.co.jp/*」のアイコンを変更すると、プライムビデオだけでなく、Amazonフォトや、Amazonショッピングサイト全てのアイコンが変更されます。

ナポリタン寿司のPC日記」の場合は、以下のようになります。個別サイトでアイコンを変更したいのか、サイト全体のアイコンを変更したいのかで選ぶURLが異なってきます。

URLURLの意味
https://www.naporitansushi.com/insider-program-7th/この記事 のみのブックマークを変更
https://www.naporitansushi.com/insider-program-7th/*この記事 + それより下の階層のブックマークを変更
(ただし、この記事はそれより下に階層はないので実質、この記事のみ)
https://www.naporitansushi.com/*ナポリタン寿司のPC日記」全体のブックマークを変更

画像を選ぶ画面が表示されるので、事前に準備しておいた画像を選択 → 開く をクリックします。

事前に用意しておいた画像を選択

無事にアイコンが変更されました。超簡単です。これで、同じAmazon のサイトでも、ショッピングサイトとプライムビデオで区別できました。

無事にアイコンが変更される

ブックマークを変更したいサイトが沢山ある場合は、次に説明する一覧表示の中から変更する方法がおすすめです。

ブックマーク一覧表示の中から変える

開いているページはどこでもいいので、Bookmark Favicon Changer のアイコンをクリックします。

右下のほうにある「Open options page」をクリックします。

Open options page をクリック

設定画面のタブに移動するので、「Bookmark Favicon」をクリックします。

Bookmark Favicon をクリック

変更したいアイコンを右クリックして、Changer Favicon」をクリックします。

今回は、プライムビデオのアイコンを変更します。

アイコンを右クリックでChanger Faviconをクリック

画像を選ぶ画面がでるので、先ほど保存した画像を選んで「開く」をクリックします。

ちなみに、通常アイコンの拡張子であるicoでも大丈夫です。

画像を選択して開くをクリック

開くをクリックしたら、別のウィンドウが自動で立ち上がります。

そして、自動で閉じるのを待ちます。数秒で閉じると思います。

Bookmark Favicon Changer - Close this window to abort

もし、中止したい場合はウィンドウを「×」で閉じると中止します。

無事にプライムビデオのアイコンが変わりました。

追記(2021年06月07日)

この時は成功してたんですが、他のアイコンを変更している時に、ウィンドウが自動で閉じなくて変更できない状況が続いちゃいました。

もし同じような方は、1つ目に紹介した開いているページのブックマークを変更する方法か、似たようなchrome拡張機能「Favicon Changer」を試してみてください。

まとめ

以上、ブックマークアイコンを変更するChrome拡張機能Bookmark Favicon Changer についてでした。大きく以下の2つの時に便利です。

同じアイコンのサイト → ドメインレベルでアイコン変更
真っ白なアイコンのサイト → そのサイトのロゴをスクショしてアイコン変更

ただし、たまーに変更したのにブックマークアイコンが元に戻っていることもありました。ブラウザの再起動とかしてたらいつの間にかなおってます。なんなんですかね。

メモ

Posted by ナポリタン寿司