やらねば.com

新しいタブを空白ページで開く拡張機能を自作してみる

Microsoft Edge が Chromium ベースになり、Google Chrome 拡張も使えるという事で使ってみるも、新規タブを空白ページで開く設定が見当たらない。
何やら色々おすすめしてくれるのですが、シンプルなページを開く事はおすすめしてくれないのですね。
こんな時に Chrome 拡張はやっぱり便利。悩みを解決してくれる拡張がすぐに見付かりました。
でも、使っていると真っ白な空白ページは眩しくて目が疲れる。黒く出来ないのかなとソースを覗いて見るととってもシンプルな構造。何だか自分でも作れそう。

新しいタブを空白ページで開く Chromium 拡張を自作

最低限用意するファイルは manifest.json ファイルと .html ファイルの2つ。
ローカルにフォルダーを作って、そこに2つのファイルを入れてブラウザに読み込ませれば拡張機能として動作します。
ほぼ最低限のソースで自作に挑戦。とりあえず動作はしています。

manifest.json


{
  "name": "New Tab",
  "version": "1.0.0",
  "manifest_version": 3,
  "chrome_url_overrides": {
    "newtab": "newtab.html"
  }
}

name と .html のファイル名は任意で。manifest.json として保存します。

HTMLファイル


<html>
<head>
<title>New Tab</title>
<style>
body{background: #000000}
</style>
</head>
<body>
</body>
</html>

manifest.json のソース内で指定したファイル名、ここでは newtab.html として保存します。
空白ページを表示させたいので、HTMLソースはほぼ空の状態です。自分にしか見えないページなので構文とか余り気にしなくてもきっと大丈夫。
ここでは背景色を黒にしたいので、「#000000」のスタイルを当てています。
カラーコードを変更して背景色を好きな色にしたり、ページのリンクを記述してブックマークページとしても使えます。

拡張機能として読み込ませる

Microsoft Edge の場合、拡張機能の管理ページを開き、「開発者モード」にチェックを入れて、上記作成した2つのファイルの入ったフォルダーを管理ページ上にドラッグ&ドロップするか、「展開して読み込み」からフォルダーを選択します。
構文エラーが出る時は何行目に問題が有るかも教えてくれるので修正して再度アップします。

こんなのも作ってみました。
ユーザースタイルシートを適用する拡張機能を自作してみる