Chrome Extension - Context Menu On Specific Pages

Question

I am wondering if it is possible to show the following context menu item only if it is on specific pages.

I think it has something to do with documentUrlPatterns (Which can be seen here as of typing this) but I am not sure how to implement it with the following code:

---

manifest.json

{
    "name": "App Name",
    "version": "1.0",
    "manifest_version": 2,
    "description": "Description",

    "permissions": [
        "contextMenus",
        "tabs"
     ],

    "background": {
        "scripts": ["script.js"]
    }
}

---

script.js

function getword(info,tab) {
    chrome.tabs.create({ 
        url: "http://www.google.com/search?q=" + info.selectionText,
    })
}

chrome.contextMenus.create({

    title: "Search: %s", 
    contexts:["selection"], 
    onclick: getword,

});

---

It would be great if you could provide a demo which will only work on specific sites of your choice (For instance, any directory of Stack Overflow and any directory of Google).

PS. The above code allows users to make a selection on any site and provides a button (In the context menu) which will search for what the user has selected on http://www.google.com/search?q= {Selection}

Answer 1

I have stripped down your code to demonstrate selective context menu option display.

manifest.json

{
    "name": "zambrey",
    "version": "1.0",
    "manifest_version": 2,
    "description": "Description",

    "permissions": [
        "contextMenus"
     ],

    "background": {
        "scripts": ["trial.js"]
    }
}

trial.js

var showForPages = ["https://www.google.com/","*://github.com/zambrey/*","http://www.nytimes.com/"];

chrome.contextMenus.create({
    "title": "zambrey",
    "documentUrlPatterns":showForPages
});

Be sure to check out http://developer.chrome.com/extensions/match_patterns.html for more details on url pattern syntax.

Also refer to this http://developer.chrome.com/extensions/examples/api/contextMenus/basic.zip sample for more complex context menus.