[好讀版]

為了將 Chrome Extension 客製化，會需要提供一些選項讓使用者自行設定，而選項頁面就是為此而存在。

加入選項頁面的方法

Step 1. 在設定檔中定義選項頁面

manifest.json

{
...
"options_page": "options.html",
...
}

Step 2. 建立選項頁面

options.html

<meta charset="utf-8">
<title>Options page</title>
<link rel="stylesheet" href="options.css">


<h2>Options page</h2>
<p>你可以在這裡製作客製化選項。</p>
<select name="style" id="style">
<option value="1">Mac OS X</option>
<option value="2">Windows</option>
<option value="3">Linux</option>
</select>

Step 3. 加入後，會在擴充功能管理頁的 Extension 旁多出一個『選項』的按鈕

溫馨小提醒：選項頁面設定的值可以用 chrome.storage 的 API 來儲存，不但可以在 Extension 的任何腳本中存取，也支援同步功能。

重要注意事項

Chrome Extension 開發團隊正在計劃提供選項頁面的預設畫面，讓不同的 Extension 有風格一致的外觀。您可以在crbug.com/25317 關注目前最新的狀況。