从 Firefox 扩展覆盖浏览器首选项答案

【问题标题】：Overlay browser preferences from firefox extension从 Firefox 扩展覆盖浏览器首选项
【发布时间】：2012-11-12 22:07:24
【问题描述】：

我正在尝试从我的扩展程序中向浏览器的首选项添加一个叠加层，但没有成功。安装我的插件时没有显示任何内容。其他 xul 文件正确显示（例如插件的首选项对话框。我尝试根据需要调整 this 教程。

我在 chrome.manifest 中注册了叠加层：

content smime chrome/content/
overlay chrome://browser/content/preferences/preferences.xul chrome://smime/content/preferences.xul

preferences.xul:

<overlay xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<!-- Merge with the BrowserPreferences Window -->
<prefwindow id="BrowserPreferences">

  <!-- Create a new pane (tab) for HP Scheduler. -->
  <prefpane id="hpschedPane" label="&prefpane.label;"
            image="chrome://smime/content/sogo-48.png">

    <!-- Intermediary between GUI and preferences system -->
    <preferences>
    <preference id="sodgeItSmimeKeyfile" name="extensions.sodgeItSmime.keyfile" type="text"/>

    </preferences>
    <!-- GUI Elements... -->
    <groupbox>
        <caption label="Settings"/>
        <grid>
            <columns>
                <column flex="4"/>

                <column flex="1"/>
            </columns>
            <rows>
                <row>
                    <label control="keyfile" value="Keyfile"/>
                    <textbox id="keyfile" preference="sodgeItSmimeKeyfile"/>

                </row>
            </rows>
        </grid>
    </groupbox>
    </prefpane>
</prefwindow>
</overlay>

这就是我想做的——在 Firefox 设置对话框中添加一个选项卡。

编辑：添加图片来描述我正在尝试做的事情

【问题讨论】：

是这个吗？？ [url=postimage.org/image/l7jopntxz/][img]http://s15.postimage.org/…
编辑了问题并添加了一张我想做的图片。

标签： firefox firefox-addon xul

【解决方案1】：

让这个工作比它应该的更棘手。您可以尝试我们在 FireTorrent 扩展中使用的以下方法：

如图所示覆盖 Firefox 首选项窗口：

<?xml version="1.0"?>

<?xml-stylesheet href="chrome://firetorrent/skin/firetorrent-prefs.css" type="text/css"?>

<overlay id="FiretorrentPaneOverlay"
    xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

    <prefwindow id="BrowserPreferences">
        <prefpane id="paneFiretorrent" label="FireTorrent"
            src="chrome://firetorrent/content/optionsOverlay.xul"/>
    </prefwindow>
</overlay>

将以下内容添加到您的 CSS 文件（示例中为firetorrent-prefs.css）：

#BrowserPreferences radio[pane="paneFiretorrent"] {
  list-style-image: url("chrome://firetorrent/skin/firetorrent-icon-32.png");
}

optionsOverlay.xul的内容如下：

<?xml version="1.0"?>

<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>
<?xml-stylesheet href="chrome://global/skin/preferences.css" type="text/css"?>
<?xml-stylesheet href="chrome://firetorrent/skin/options.css" type="text/css"?>

<!DOCTYPE overlay SYSTEM "chrome://firetorrent/locale/optionsOverlay.dtd">

<overlay id="firetorrentOptionsOverlay"
     xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

    <prefpane id="paneFiretorrent" onpaneload="loadOptions();" flex="1">

        <preferences>
            <preference id="firetorrent.options.port" name="extensions.firetorrent.port" type="int"/>
            ...etc...
        </preferences>

        <script type="application/x-javascript" src="chrome://firetorrent/content/optionsOverlay.js"/>

        ...all your prefpane XUL here...
    </prefpane>
</overlay>

我写这篇文章已经很久了，但我认为需要注意的重要一点是preferences.xul 的叠加层（我的示例中的第 1 点）引用了另一个包含实际 prefpane 的 XUL 叠加层 (optionsOverlay.xul)并且您需要在 CSS 中使用 list-style-image 样式来指定新标签的图标。

【讨论】：