Search code examples
javascriptgoogle-chromegoogle-chrome-extension

Google Chrome Extension: how to add icon inside address bar?

I've googled a lot but cannot find how to add icon to the address bar.

annotated chrome URL bar screenshot

If you know how, could you please provide a code example?

Thanks

Solution

  • As of today, there is no API that allows extensions to show a UI element in the address bar (Omnibox) in the place you highlight on your screenshot. Both icons you show are from internal browser systems and not extensions.

    There is a mechanism in Chrome Extensions called "Page Actions" - to show a clickable extension control based on some conditions related to the current page.

    It used to display the control as an icon inside the Omnibox, like on your screenshot. For example, this image from a 2015 snapshot of the docs:

    Old Page Action UI

    However, as part of the changes introduced in 2016 to make all extensions visible in the toolbar, Page Actions also were moved from the Omnibox to the common area with all extension Browser Action buttons.

    They are now always show, either disabled (greyed out) or enabled (with a special mark if they are in the overflow menu) instead of showing up only when enabled.