Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Documentation: <a href="http://code.google.com/chrome/extensions/getstarted.html" rel="nofollow">http://code.google.com/chrome/extensions/getstarted.html</a><br> Samples: <a href="http://code.google.com/chrome/extensions/samples.html" rel="nofollow">http://code.google.com/chrome/extensions/samples.html</a></p> <p>This is the official documentation and sample code for Google Chrome extensions. In your <a href="http://code.google.com/chrome/extensions/manifest.html" rel="nofollow">manifest</a> you want to declare a popup for either a page or browser action (whichever best suites your extension). In your popup HTML file you probably want something like the following;</p> <pre><code>&lt;!DOCTYPE HTML&gt; &lt;html&gt; &lt;head&gt; &lt;script type="text/javascript"&gt; function initPopup() { chrome.tabs.getSelected(null, function (tab) { document.body.appendChild(document.createTextNode(tab.url)); }); } &lt;/script&gt; &lt;/head&gt; &lt;body onload="initPopup();"&gt;&lt;/body&gt; &lt;/html&gt; </code></pre> <p>This very simply appends the URL of the selected tab to the body of the popup.</p> <p>Your manifest should look like the following;</p> <pre><code>{ "name": "My First Extension", "version": "1.0", "description": "The first extension that I made.", "browser_action": { "default_icon": "icon.png", "default_popup": "popup.html" }, "permissions": [ "tabs" ] } </code></pre> <p>The file structure for this example is a single folder containing <code>manifest.json</code>, <code>popup.html</code> and <code>icon.png</code>.</p> <p>On the Extensions page (chrome://extensions) you should click <em>Load unpacked extension...</em> and navigate to this folder. If you make any changes to the manifest be sure to click the <em>Reload</em> link to pick up these changes.</p> <p>I hope this helps but I strongly suggest reading through the documentation I mentioned above to get a better understanding of what you're doing.</p> <p><strong>EDIT:</strong> Added missing <code>null</code> argument to code and included an example manifest and file structure based on additional information gathered from comments.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload