Google Chrome 拡張機能で利用する設定項目を表示する［オプション］ページを表示する方法を備忘録的に投稿しておきます。
Chrome 拡張機能でオプション表示
Chromeの機能拡張で利用する設定項目を表示する［オプション］ページを表示するには［manifest.json］に “options_page” に表示するHTMLページなどのファイルを指定します。
具体的には、次のようなファイルを用意します。
[OptionsPage]
|-[manifest.json]
|-[settings.html]２つのファイルそれぞれに、次のようなコードを追加します。
[manifest.json]
{
"manifest_version": 3,
"name": "設定を表示",
"version": "1.0",
"options_page": "settings.html"
}[settins.html]
<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="utf-8" />
<title>設定</title>
</head>
<body>
設定ページ
</body>
</html>これで［オプション］ページの表示が可能です。
［オプション］ページの表示方法
用意した［settings.html］は、Google Chromeでは次の２つの方法で表示できます。
拡張機能の詳細から表示
１つの方法は、［拡張機能］ページの［詳細］から表示できます。
1. ［拡張機能］ページで表示される一覧で［詳細］をクリックします。
2. 表示された詳細画面の［拡張機能のオプション］を選択します。
拡張機能ツールバーから表示
もう１つは、Google Chromeの拡張機能ツールバーで表示される拡張機能の［その他のオプション｜オプション］メニューで表示されます。
以外に簡単な方法で設定画面が表示できました。
まとめ
今回は、Google Chrome 拡張機能で利用する設定項目を表示する［オプション］ページを表示する方法を書きました。
［オプション］ページを表示するには［manifest.json］に “options_page” に表示するHTMLページなどのファイルを指定します。
表示には、Google Chromeの拡張機能ツールバーで表示される拡張機能の［その他のオプション｜オプション］メニューで用意したページが表示されます。
Google Chromeの拡張機能で［オプション］画面を用意して表示したい人の参考になれば幸いです。
スポンサーリンク
最後までご覧いただきありがとうございます。
