chrome.pageAction

Some examples:

• Subscribe to this page's RSS feed
• Make a slideshow out of this page's photos

The RSS icon in the following screenshot represents a page action that lets you subscribe to the RSS feed for the current page.

If you want the extension's icon to always be visible, use a browser action instead.

Manifest

Register your page action in the extension manifest like this:

      {
        "name": "My extension",
        ...
        "page_action": {
          "default_icon": {                    // optional
            "19": "images/icon19.png",           // optional
            "38": "images/icon38.png"            // optional
          },
          "default_title": "Google Mail",      // optional; shown in tooltip
          "default_popup": "popup.html"        // optional
        },
        ...
      }

If you only provide one of the 19px or 38px icon size, the extension system will scale the icon you provide to the pixel density of the user's display, which can lose detail or make it look fuzzy. The old syntax for registering the default icon is still supported:

      {
        "name": "My extension",
        ...
        "page_action": {
          ...
          "default_icon": "images/icon19.png"  // optional
          // equivalent to "default_icon": { "19": "images/icon19.png" }
        },
        ...
      }

Parts of the UI

Like browser actions, page actions can have an icon, a tooltip, and popup; they can't have badges, however. In addition, page actions can appear and disappear. You can find information about icons, tooltips, and popups by reading about the browser action UI.

You make a page action appear and disappear using the pageAction.show and pageAction.hide methods, respectively. By default, a page action is hidden. When you show it, you specify the tab in which the icon should appear. The icon remains visible until the tab is closed or starts displaying a different URL (because the user clicks a link, for example).

Tips

For the best visual impact, follow these guidelines:

• Do use page actions for features that make sense for only a few pages.
• Don't use page actions for features that make sense for most pages. Use browser actions instead.
• Don't constantly animate your icon. That's just annoying.

Examples

You can find simple examples of using page actions in the examples/api/pageAction directory. For other examples and for help in viewing the source code, see Samples.

Summary