![見出し画像](https://assets.st-note.com/production/uploads/images/126363136/rectangle_large_type_2_d44a730dd4eff0597fcaa6defbbfa323.png?width=1200)
PWA 版の Twitter のアイコンを、𝕏 から青い鳥にする
この記事においては、原則として、𝕏 のことを、Twitter と呼びます。
また、黒い丸に 𝕏 という文字があるアイコンになる前の、青い円に鳥がいる頃の Twitter のアイコンを、青い鳥などと呼ぶことがあります。
Windows の PC を初期化 (クリーンインストール) したついでに書いた駄文です。読みにくいと思っても、気合で読んでください。
ちなみに、この手法で、ほかの PWA でも、アイコンを自由に変更できると思います。
Microsoft Edge で、Twitter を見ていると、このようなポップアップが出てきます。
![](https://assets.st-note.com/img/1704092112507-xX4sGiq3RC.png)
この黒い丸に 𝕏 と書いてあるアイコン、嫌ですね。
というわけで、これを、青い鳥に戻してあげましょう。
用意するもの
・青い鳥の頃の PWA 版 Twitter のアイコン画像
・Microsoft Edge
・Microsoft アカウント
(Chrome など、その他の Chromium をベースにしたブラウザは、検証していませんが、似た方法でできると思われます。)
青い鳥のアイコン画像は、持っていない方もいると思うので、ここに置いておきます。
怒られたら消してしまうので、この下に ZIP ファイルがなければ、自力で用意してください。
手順
過去に MS アカウントで同期している Edge で、Twitter の PWA をインストールしたことある場合、2台目の PC 以降 (または初期化などした同じ PCなど) は、8 以降の手順のみで済むと思います。
1. Microsoft Edge の下準備 (プロファイル)
Microsoft Edge では、複数のプロファイルを利用することができます。
PWA 版 Twitter をインストールするプロファイルが、Default (Microsoft Edge で、特に何も設定せずとも、一番最初に起動するプロファイル) で良い場合は、ここを飛ばして、次に進んでください。
プロファイルが何かわからない人も、飛ばして、次に進んでください。
Default 以外のプロファイルにインストールしたい場合は、予めプロファイルを作成しておく必要があります。
設定ページの、最初の画面、プロファイルのタブで、右上の「プロファイルの追加」から、プロファイルを追加できます。(画像の 1)
![](https://assets.st-note.com/img/1704098986800-jIfMYvHPeQ.png?width=1200)
2. Microsoft Edge の下準備 (MS アカウント)
次に、Microsoft Edge で、Microsoft アカウントにサインインします。
上にある画像の 2 の部分に、メールアドレスが表示され、「同期は有効になっています」と表示されていれば、ここを飛ばして、次に進んでください。
そうでない場合、このようになっていると思うので、「サインインしてデータを同期」を押して、サインインしてください。
(個人用の Microsoft アカウントでも、職場の Microsoft Entra ID でも、アプリの同期さえできればよいので、どちらでも構いませんが、職場のアカウントでは、組織による制限がある場合があります。)
![](https://assets.st-note.com/img/1704099260311-XC6JzVhjhA.png?width=1200)
3. Microsoft Edge の下準備 (同期)
先ほどの、プロファイル名の下に、「同期」という項目があるので、そこを開き、「アプリ」を有効にします。
![](https://assets.st-note.com/img/1704099391945-BQ00379Dfd.png?width=1200)
3. PWA 版 Twitter を一度インストールする
Twitter (https://twitter.com) に行き、一度、PWA 版 Twitter をインストールします。
黒い丸に 𝕏 という文字があるアイコンになっていますが、この時点では、嫌でも受け入れてください。
![](https://assets.st-note.com/img/1704092112507-xX4sGiq3RC.png)
嫌だ、嫌だぁぁぁ……
![](https://assets.st-note.com/img/1704099645531-WYq7u4YXf7.png)
さて、Windows の、スタートメニューに、X という項目が増え、黒い丸に 𝕏 という文字があるアイコンが、出ています。
4. アイコンの保存先を確認する
エクスプローラーで、「%localappdata%\Microsoft\Edge\User Data」を開きます。
%localappdata% とは、C:\Users\(現在のユーザー名)\AppData\Local というフォルダに対応しています。
1 のときの、プロファイルが Default なら、「Default」のフォルダ、それ以外の場合は、プロファイルの番号に対応する、「Profile (番号)」というフォルダを開きます。
![](https://assets.st-note.com/img/1704100714470-uHvhEwNnCw.png?width=1200)
そして、「Web Applications\Manifest Resources」というフォルダを開き、「jgeocpdicgmkeemopbanhokmhcgcflmi」というフォルダがあるかを確認してください。
そうでない場合、黒い丸に 𝕏 という文字があるアイコンがあるフォルダを見つけてください。
そして、最初に配布した ZIP ファイルを開き、その中にある、_crx__jgeocpdicgmkeemopbanhokmhcgcflmi というフォルダと、jgeocpdicgmkeemopbanhokmhcgcflmi というフォルダの名前を、対応するフォルダ名に、書き換えてください。
5. Edge で、MS アカウントからサインアウト
一度、Microsoft Edge の Microsoft アカウントから、サインアウトします。
Twitter のサインアウトではありません。
また、先ほどの PWA 版 Twitter をインストールした場合、同期が終わるまで、数分待ってからサインアウトします。
設定の、この部分ですね。
![](https://assets.st-note.com/img/1704099797488-K8JHpi1VBA.png?width=1200)
この際に、お気に入りなどはクリアしなくてもよいです。
![](https://assets.st-note.com/img/1704099848383-nVCAYLhr5p.png)
こうなればよいです。
![](https://assets.st-note.com/img/1704099949268-7fKwz9jj09.png?width=1200)
6. Edge から、PWA 版 Twitter をアンインストール
Edge で、画面上部にある、アドレスバーに、「edge://apps/」と入力して開きます。
もしくは、Edge の右上にある、「…」→「アプリ」→「アプリの表示」→
![](https://assets.st-note.com/img/1704100150070-KgLz7tUz37.png?width=1200)
→「…」→「アプリの管理」でも、同じ画面が開けます。
![](https://assets.st-note.com/img/1704100216979-8n58b19XUO.png)
こうなればよいです。
![](https://assets.st-note.com/img/1704100283393-Wl7RdmXBlZ.png?width=1200)
そして、「X」の右上にある、「…」→「アンインストール」
![](https://assets.st-note.com/img/1704100324535-uL0CBBWNJH.png?width=1200)
データはクリアしなくてよいです。
クリアすると、Twitter からログアウトされます。
![](https://assets.st-note.com/img/1704100418907-zGOgnnUwWM.png)
7. Edge でサインインする
2 の手順と同じなので省略。
8. アイコン画像をコピーする
4 のときのフォルダ、「%localappdata%\Microsoft\Edge\User Data」に行き、プロファイル名に対応するフォルダの中に、ダウンロードした ZIP ファイルの中身を展開します。
黒い丸に 𝕏 という文字があるアイコンのファイルを、置き換えるかという確認が出れば正常です。置き換えてください。
もしも、そのような確認が出ない場合、展開する場所を間違えているか、4 の部分で間違えている可能性があります。
9. Twitter の PWA 版をインストール
6 の手順で、アプリの管理画面を開きます。
青い鳥の Twitter のアイコン (グレーアウト状態)になっていることを確認します。
そうでないならやり直し。
![](https://assets.st-note.com/img/1704113620322-ZARgonQiQe.png?width=1200)
右側の「インストール」を押して、インストールする。
完成。青い鳥が帰ってきました。
![](https://assets.st-note.com/img/1704114082516-9n6Lq1kESd.png?width=1200)
![](https://assets.st-note.com/img/1704113922074-rVbgWSD2ng.png?width=1200)
Q: なぜ、MS アカウントの作業が必要なのか?
MS アカウントがなくても、PWA のインストール後に、画像ファイルを差し替えるだけで、Edge 内のみのアイコン自体の変更はできます。
しかし、その場合、PWA をインストールするときに、アイコン画像がダウンロードされて設定されるため、スタートメニューや、タスクバーに登録されるアイコンが、黒い丸に 𝕏 という文字があるアイコンのままになってしまうのです。
(UWP などの知識があれば変更できるかもしれないが、少なくとも、この記事の方法よりも数倍は面倒になると思われます)
そのため、一度 MS アカウントの同期で、ローカルに事前にアイコンのキャッシュを保存させておき、PWA のインストール時に、そのキャッシュを使うようにさせる必要があります。
Q: ほかの PWA などにも応用できるか
4 のときの、フォルダさえわかれば、あとはほかの PWA でも、別の好きなアイコンでも、できると思います。
30分で書いた駄文終わり。