覆盖 Chrome 页面

替换页面是一种将扩展程序中的 HTML 文件替换为 Google Chrome 通常提供的页面的方法。除了 HTML 之外,替换网页通常还包含 CSS 和 JavaScript 代码。

扩展程序可以替换以下任一页面:

  • 书签管理器:用户从 Chrome 菜单(或在 Mac 上)从“书签”菜单中选择“书签管理器”菜单项时显示的网页。您也可以通过输入网址 chrome://bookmarks 来访问此页面。
  • 历史记录:当用户从 Chrome 菜单(或在 Mac 上)从“历史记录”菜单中选择“显示全部历史记录”菜单项时显示的页面。您也可以通过输入网址 chrome://history 来访问此页面。
  • 新标签页:用户创建新标签页或窗口时显示的页面。您也可以通过输入网址 chrome://newtab 来访问此页面。
注意:单个扩展程序只能替换一个网页。例如,扩展程序无法同时覆盖“书签管理器”和“历史记录”页面。

无痕式窗口会得到特殊处理。在无痕式窗口中无法覆盖“新标签页”页面。 其他替换页面可以在无痕式窗口中运行,只要 无痕模式清单属性设为“spanning”(这是默认值)即可。如需详细了解如何处理无痕式窗口,请参阅“概览”中的节省数据流量和无痕模式

以下屏幕截图显示了默认的“新标签页”页面和自定义的“新标签页”页面。

默认的新标签页

自定义的“新标签页”页面

清单

如下所示,在扩展程序清单中注册替换页面:

{
  "name": "My extension",
  ...

  "chrome_url_overrides" : {
    "PAGE_TO_OVERRIDE": "myPage.html"
  },
  ...
}

PAGE_TO_OVERRIDE 替换为以下项之一:

  • bookmarks
  • history
  • newtab

提示

若要实现有效的替换页面,请遵循以下准则:

  • 打造简洁明快的页面。 用户希望内置的浏览器页面能够立即打开。避免执行可能需要很长时间的操作。例如,避免同步提取网络或数据库资源。
  • 在您的网页中添加标题。 否则,用户可能会看到相应网页的网址,从而引起混淆。以下是指定标题的示例:<title>New Tab</title>
  • 请勿依赖有键盘焦点的网页。 当用户创建新标签页时,地址栏始终会先获得焦点。
  • 请勿尝试模拟默认的“新标签页”页面。 目前尚不存在所需的 API,因此无法创建默认“新标签页”页面(包含热门页面、最近关闭的页面、提示、主题背景图片等)的默认“新标签页”页面。除非他们确实这样做,否则你最好尝试做出完全不同的尝试。

示例

请参阅替换示例