tQS Chrome Extensions 101

By pjain      Published July 9, 2020, 6:57 p.m. in blog AI-Analytics-Data   

PKJ CHROME Browser Ware QuickStart

QUIK: hello world Extensions

  • Chrome is closer to mobile Web! https://developer.chrome.com/extensions/getstarted.html
  • SRC:, dnto:~z/WebBrowserWare/gChromeExt/gHello/

  • Create a directory with following files - this "package" directory is what is zipped and inserted as a crx file

  • You need a manifest describing contents of your extension

    • has metadata about your extension such as name, version, etc.,
    • connects the popup browser action to a local in directory file
    • Commands - tie keyboard actions to click on icon - when not showing
  • html - for the popup that appears

  • hello_extensions.png - an image used to show on bar

  • Manual Install of the "unpacked" extension directory by

    • click on : three dots on top right of Chrome browser
    • Go to more tools > Extensions Page
    • Click on Load Unpacked extensions, point it to the directory you created above
    • After making changes, click Reload on this extension on this page to see changes
  • Latest chrome browser PROBLEM - icon was not showing

    • Used to be you would resize the address bar
    • Now there is a "puzzle piece" icon at very end of the extensions panel (to right of address bar)
    • If you right click on it, all "enabled" extensions are shown
    • To allow your extension to be shown always, click the pin icon there
  //  hello_extensions.png - an image used to show on bar

  // hello.html
  <html><body><h1>Hello Pradeep</h1></body></html>

  // manifest.json
     "name": "Hello Extensions",
     "description" : "Base Level Extension",
     "version": "1.0",
     "manifest_version": 2,
     "browser_action": {
        "default_popup": "hello.html",
        "default_icon": "hello_extensions.png"
     "commands" : {
        "_execute_browser_action": {
          "suggested_key": {
            "default": "Ctrl+Shift+F",
            "mac": "MacCtrl+Shift+F"
          "description": "Opens hello.html"


There are no comments yet

Add new comment

Similar posts

Time series Analysis and Prediction

Apple Mac Mini

b Use of BrowserWare

t Firefox Extensions