initial commit

73 files changed, 9948 insertions, 0 deletions

diff --git a/files/pt-br/mozilla/add-ons/code_snippets/canvas/index.html b/files/pt-br/mozilla/add-ons/code_snippets/canvas/index.html
new file mode 100644
index 0000000000..5178d91a50
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/code_snippets/canvas/index.html
@@ -0,0 +1,235 @@
+---
+title: Canvas fragmentos de códigos
+slug: Mozilla/Add-ons/Code_snippets/Canvas
+translation_of: Archive/Add-ons/Code_snippets/Canvas
+---
+<p>Para informações gerais sobre o uso do <code>&lt;canvas&gt;</code> ver a <a class="internal" href="/en-US/docs/Web/API/Canvas_API" title="En/HTML/Canvas">página do tópico canvas</a>.</p>
+
+<h2 id="Código_usável_do_conteúdo_da_Web">Código usável do conteúdo da Web</h2>
+
+<h3 id="Recebendo_o_número_de_pixels_de_uma_certa_cor_em_um_canvas">Recebendo o número de pixels de uma certa cor em um canvas</h3>
+
+<p>A função a seguir retornará o número de pixels em um canvas que a cor RGB de r, g e b. Isso pode ser muito útil para comparar, por exemplo se um usuário  pintou sobre uma outra área  como explicado <a href="https://hacks.mozilla.org/2013/06/building-a-simple-paint-game-with-html5-canvas-and-vanilla-javascript/" title="https://hacks.mozilla.org/2013/06/building-a-simple-paint-game-with-html5-canvas-and-vanilla-javascript/">nessa publicação do blog</a>.</p>
+
+<pre class="brush: js">function getpixelamount(canvas, r, g, b) {
+  var cx = canvas.getContext('2d');
+  var pixels = cx.getImageData(0, 0, canvas.width, canvas.height);
+  var all = pixels.data.length;
+  var amount = 0;
+  for (i = 0; i &lt; all; i += 4) {
+    if (pixels.data[i] === r &amp;&amp;
+        pixels.data[i + 1] === g &amp;&amp;
+        pixels.data[i + 2] === b) {
+      amount++;
+    }
+  }
+  return amount;
+};
+</pre>
+
+<h3 id="Recebendo_a_cor_de_um_pixel_em_um_canvas">Recebendo a cor de um pixel em um canvas</h3>
+
+<p>Esse fragmento a seguir retorna um objeto com os valores RGBA do pixel na posição x e y do canvas. Isso pode ser usado para determinar se o cursor do mouse está dentro de uma certa forma ou não.</p>
+
+<pre class="brush: js">function getpixelcolour(canvas, x, y) {
+  var cx = canvas.getContext('2d');
+  var pixel = cx.getImageData(x, y, 1, 1);
+  return {
+    r: pixel.data[0],
+    g: pixel.data[1],
+    b: pixel.data[2],
+    a: pixel.data[3]
+  };
+}
+</pre>
+
+<h3 id="Encadeamento_de_métodos">Encadeamento de métodos</h3>
+
+<p>Essa classe prove um estilo JQuery de acesso encadeado aos métodos e propriedades do contexto 2D.</p>
+
+<pre class="brush: js">function Canvas2DContext(canvas) {
+  if (typeof canvas === 'string') {
+    canvas = document.getElementById(canvas);
+  }
+  if (!(this instanceof Canvas2DContext)) {
+    return new Canvas2DContext(canvas);
+  }
+  this.context = this.ctx = canvas.getContext('2d');
+  if (!Canvas2DContext.prototype.arc) {
+    Canvas2DContext.setup.call(this, this.ctx);
+  }
+}
+Canvas2DContext.setup = function () {
+  var methods = ['arc','arcTo','beginPath','bezierCurveTo','clearRect','clip',
+    'closePath','drawImage','fill','fillRect','fillText','lineTo','moveTo',
+    'quadraticCurveTo','rect','restore','rotate','save','scale','setTransform',
+    'stroke','strokeRect','strokeText','transform','translate'];
+
+  var getterMethods = ['createPattern','drawFocusRing','isPointInPath','measureText', // drawFocusRing not currently supported
+    // The following might instead be wrapped to be able to chain their child objects
+    'createImageData','createLinearGradient',
+    'createRadialGradient', 'getImageData','putImageData'
+  ];
+
+  var props = ['canvas','fillStyle','font','globalAlpha','globalCompositeOperation',
+    'lineCap','lineJoin','lineWidth','miterLimit','shadowOffsetX','shadowOffsetY',
+    'shadowBlur','shadowColor','strokeStyle','textAlign','textBaseline'];
+
+  for (let m of methods) {
+    let method = m;
+    Canvas2DContext.prototype[method] = function () {
+      this.ctx[method].apply(this.ctx, arguments);
+      return this;
+    };
+  }
+
+  for (let m of getterMethods) {
+    let method = m;
+    Canvas2DContext.prototype[method] = function () {
+      return this.ctx[method].apply(this.ctx, arguments);
+    };
+  }
+
+  for (let p of props) {
+    let prop = p;
+    Canvas2DContext.prototype[prop] = function (value) {
+      if (value === undefined)
+        return this.ctx[prop];
+      this.ctx[prop] = value;
+      return this;
+    };
+  }
+};
+
+var canvas = document.getElementById('canvas');
+
+// Use context to get access to underlying context
+var ctx = Canvas2DContext(canvas)
+  .strokeStyle("rgb(30,110,210)")
+  .transform(10, 3, 4, 5, 1, 0)
+  .strokeRect(2, 10, 15, 20)
+  .context;
+
+// Use property name as a function (but without arguments) to get the value
+var strokeStyle = Canvas2DContext(canvas)
+  .strokeStyle("rgb(50,110,210)")
+  .strokeStyle();
+</pre>
+
+<h2 id="Saving_a_canvas_image_to_a_file" name="Saving_a_canvas_image_to_a_file">Código usável apenas para código previlegiado</h2>
+
+<p>Esse fragmento só é útl para códigos previlegiados, como extensões ou aplicativos previlegiados.</p>
+
+<h3 id="Saving_a_canvas_image_to_a_file" name="Saving_a_canvas_image_to_a_file">Salvando uma imagem do canvas à um arquivo</h3>
+
+<p>A função a seguir aceita um objeto canvas e uma string de destinação do caminho do arquivo. O canvas é convertido para um arquivo PNG e, é salvo na localização especificada. A função retorna uma promessa que resolve quando o arquivo foi completamente  salvo.</p>
+
+<pre class="brush: js">function saveCanvas(canvas, path, type, options) {
+    return Task.spawn(function *() {
+        var reader = new FileReader;
+        var blob = yield new Promise(accept =&gt; canvas.toBlob(accept, type, options));
+        reader.readAsArrayBuffer(blob);
+
+        yield new Promise(accept =&gt; { reader.onloadend = accept });
+
+        return yield OS.File.writeAtomic(path, new Uint8Array(reader.result),
+                                         { tmpPath: path + '.tmp' });
+    });
+}
+</pre>
+
+<h3 id="Loading_a_remote_page_onto_a_canvas_element" name="Loading_a_remote_page_onto_a_canvas_element">Carregando uma página remota em um elemento canvas</h3>
+
+<p>A classe a seguir primeiro cria um elemento iframe oculto e anexa um ouvinte ao evento carregar frame. Uma vez que a página remota foi carregada, o método remotePageLoaded é ativado. Esse método pega uma referência da janela do iframe e desenha essa janela no objeto canvas.</p>
+
+<p>Note que isso só funciona se você esta rodando a página no chrome. Se você tentar rodar o código como uma página da web simples, você receberá um 'Erro de segurança" código: erro "1000'.</p>
+
+<pre class="brush: js">RemoteCanvas = function() {
+    this.url = "http://developer.mozilla.org";
+};
+
+RemoteCanvas.CANVAS_WIDTH = 300;
+RemoteCanvas.CANVAS_HEIGHT = 300;
+
+RemoteCanvas.prototype.load = function() {
+    var windowWidth = window.innerWidth - 25;
+    var iframe;
+    iframe = document.createElement("iframe");
+    iframe.id = "test-iframe";
+    iframe.height = "10px";
+    iframe.width = windowWidth + "px";
+    iframe.style.visibility = "hidden";
+    iframe.src = this.url;
+    // Here is where the magic happens... add a listener to the
+    // frame's onload event
+    iframe.addEventListener("load", this.remotePageLoaded, true);
+    //append to the end of the page
+    window.document.body.appendChild(iframe);
+    return;
+};
+
+RemoteCanvas.prototype.remotePageLoaded = function() {
+    // Look back up the iframe by id
+    var ldrFrame = document.getElementById("test-iframe");
+    // Get a reference to the window object you need for the canvas
+    // drawWindow method
+    var remoteWindow = ldrFrame.contentWindow;
+
+    //Draw canvas
+    var canvas = document.createElement("canvas");
+    canvas.style.width = RemoteCanvas.CANVAS_WIDTH + "px";
+    canvas.style.height = RemoteCanvas.CANVAS_HEIGHT + "px";
+    canvas.width = RemoteCanvas.CANVAS_WIDTH;
+    canvas.height = RemoteCanvas.CANVAS_HEIGHT;
+    var windowWidth = window.innerWidth - 25;
+    var windowHeight = window.innerHeight;
+
+    var ctx = canvas.getContext("2d");
+    ctx.clearRect(0, 0,
+                  RemoteCanvas.CANVAS_WIDTH,
+                  RemoteCanvas.CANVAS_HEIGHT);
+    ctx.save();
+    ctx.scale(RemoteCanvas.CANVAS_WIDTH / windowWidth,
+              RemoteCanvas.CANVAS_HEIGHT / windowHeight);
+    ctx.drawWindow(remoteWindow,
+                   0, 0,
+                   windowWidth, windowHeight,
+                   "rgb(255,255,255)");
+    ctx.restore();
+};
+</pre>
+
+<p>Emprego:</p>
+
+<pre class="brush: js">var remoteCanvas = new RemoteCanvas();
+remoteCanvas.load();
+</pre>
+
+<h3 id="Loading_a_remote_page_onto_a_canvas_element" name="Loading_a_remote_page_onto_a_canvas_element">Converter arquivos de imagem para strings base64</h3>
+
+<p>O código a seguir recebe uma imagem remota e converte seu conteúdo para <code><a href="/en/data_URIs">Dados do esquema URI</a></code>.</p>
+
+<pre class="brush: js">var canvas = document.createElement("canvas");
+var ctxt = canvas.getContext("2d");
+function loadImageFile (url, callback) {
+  var image = new Image();
+  image.src = url;
+  return new Promise((accept, reject) =&gt; {
+    image.onload = accept;
+    image.onerror = reject;
+  }).then(accept =&gt; {
+    canvas.width = this.width;
+    canvas.height = this.height;
+    ctxt.clearRect(0, 0, this.width, this.height);
+    ctxt.drawImage(this, 0, 0);
+    accept(canvas.toDataURL());
+  });
+}
+</pre>
+
+<p>Emprego:</p>
+
+<pre class="brush: js">loadImageFile("myimage.jpg").then(string64 =&gt; { alert(string64); });
+</pre>
+
+<p>Se você quer receber ao invés do conteúdo base64 de um arquivo local usando o arquivo elemento {{ HTMLElement("input") }}, você deve usar o objeto <code><a href="/en/DOM/FileReader#readAsDataURL%28%29" title="en/DOM/FileReader#readAsDataURL%28%29">FileReader</a></code>.</p>
diff --git a/files/pt-br/mozilla/add-ons/code_snippets/index.html b/files/pt-br/mozilla/add-ons/code_snippets/index.html
new file mode 100644
index 0000000000..a3e51b03df
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/code_snippets/index.html
@@ -0,0 +1,173 @@
+---
+title: Snippets de código
+slug: Mozilla/Add-ons/Code_snippets
+tags:
+  - Add-ons
+  - Code snippets
+  - Extensions
+  - NeedsTranslation
+  - TopicStub
+translation_of: Archive/Add-ons/Code_snippets
+---
+<div class="warning">
+  <p>
+    O suporte para extensões que usam XUL/XPCOM ou <span lang="en">Add-on SDK</span> foi removido no Firefox 57, lançado em novembro de 2017. Como não há versão suportada do Firefox ativando essas tecnologias, essa página será removida em dezembro de 2020.
+  </p>
+
+  <p>
+    Os complementos que usam as técnicas descritas neste documento são considerados código legado no Firefox. Não use essas técnicas para desenvolver novos complementos.
+    Use <a href="/pt-BR/docs/Mozilla/Add-ons/WebExtensions"><span lang="en">WebExtensions</span></a>. Se você mantém um complemento que usa as técnicas descritas aqui, considere migrar para usar <span lang="en">WebExtensions</span>.
+  </p>
+
+  <p>
+    <strong>
+      A partir do <a href="https://wiki.mozilla.org/RapidRelease/Calendar">Firefox 53</a>, nenhum código legado será aceito no <span lang="en">addons.mozilla.org (AMO)</span> para Firefox e Firefox para Android.
+    </strong>
+  </p>
+
+  <p>
+    <strong>
+      A partir do <a href="https://wiki.mozilla.org/RapidRelease/Calendar">Firefox 57</a>, apenas as extensões desenvolvidas usando as APIs <span lang="en">WebExtensions</span> serão suportadas no Firefox e Firefox para Android.
+    </strong>
+  </p>
+
+  <p>
+    Mesmo antes do Firefox 57, as mudanças na plataforma Firefox quebraram muitas extensões legado. Essas alterações incluem o multiprocessamento do Firefox (e10s),
+    <span lang="en">sandboxing</span> e múltiplos processos de conteúdo. As extensões legado afetadas por essas alterações devem migrar para usar as APIs <span lang="en">WebExtensions</span>, se possível.
+    Consute o <a href="https://blog.mozilla.org/addons/2017/02/16/the-road-to-firefox-57-compatibility-milestones/">documento de "Marcos de compatibilidade"</a> para mais informações.
+  </p>
+
+  <p>
+    Uma página wiki contendo <a href="https://wiki.mozilla.org/Add-ons/developer/communication">recursos, caminhos de migração, expediente e mais</a>, está disponível para ajudar os desenvolvedores a fazer a transição para as novas tecnologias.
+  </p>
+</div>
+
+
+
+<p>
+  Esta é uma lista rápida de snippets de código (pequenos exemplos úteis de código) disponíveis para desenvolvedores de extensões para os vários aplicativos Mozilla. Muitos desses exemplos também podem ser usados ​​em aplicativos XULRunner, bem como no próprio código Mozilla.
+</p>
+
+<p>
+  Esses exemplos demonstram como realizar tarefas básicas que podem não ser imediatamente óbvias.
+</p>
+
+<h2 id="General" name="General">General</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Code_snippets/From_articles" title="/en-US/docs/Code_snippets/From_articles">Examples and demos from MDN articles</a></dt>
+ <dd>A collection of examples and demos from articles.</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Windows" title="/en-US/docs/Code_snippets/Windows">Window code</a></dt>
+ <dd>Opening and manipulating windows</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Toolbar" title="/en-US/docs/Code_snippets/Toolbar">Toolbar</a></dt>
+ <dd>Toolbar related code</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Sidebar" title="/en-US/docs/Code_snippets/Sidebar">Sidebar</a></dt>
+ <dd>Sidebar related code</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Forms">Forms</a></dt>
+ <dd>Forms related code</dd>
+ <dt><a href="/en-US/docs/Code_snippets/XML" title="/en-US/docs/Code_snippets/XML">XML</a></dt>
+ <dd>Code used to parse, write, manipulate, etc. XML</dd>
+ <dt><a href="/en-US/docs/Code_snippets/File_I_O" title="/en-US/docs/Code_snippets/File_I/O">File I/O</a></dt>
+ <dd>Code used to read, write and process files</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Drag_&amp;_Drop" title="/en-US/docs/Code_snippets/Drag_&amp;_Drop">Drag &amp; Drop</a></dt>
+ <dd>Code used to setup and handle drag and drop events</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Dialogs_and_Prompts" title="/en-US/docs/Code_snippets/Dialogs_and_Prompts">Dialogs</a></dt>
+ <dd>Code used to display and process dialog boxes</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Alerts_and_Notifications" title="/en-US/docs/Code snippets/Alerts and Notifications">Alerts and Notifications </a></dt>
+ <dd>Modal and non-modal ways to notify users</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Preferences" title="/en-US/docs/Code_snippets/Preferences">Preferences</a></dt>
+ <dd>Code used to read, write, and modify preferences</dd>
+ <dt><a href="/en-US/docs/Code_snippets/JS_XPCOM" title="/en-US/docs/Code_snippets/JS_XPCOM">JS XPCOM</a></dt>
+ <dd>Code used to define and call XPCOM components in JavaScript</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Running_applications" title="/en-US/docs/Code_snippets/Running_applications">Running applications</a></dt>
+ <dd>Code used to run other applications</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Canvas" title="/en-US/docs/Code_snippets/Canvas"><code>&lt;canvas&gt;</code> related</a></dt>
+ <dd><a href="/en-US/docs/HTML/Canvas" title="/en-US/docs/HTML/Canvas">WHAT WG Canvas</a>-related code</dd>
+ <dt><a href="/en-US/docs/Signing_a_XPI" title="/en-US/docs/Signing_a_XPI">Signing a XPI</a></dt>
+ <dd>How to sign an XPI with PKI</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Threads">Delayed Execution</a></dt>
+ <dd>Performing background operations.</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Miscellaneous" title="/en-US/docs/Code_snippets/Miscellaneous">Miscellaneous</a></dt>
+ <dd>Miscellaneous useful code fragments</dd>
+ <dt><a href="/en-US/docs/Code_snippets/HTML_to_DOM" title="/en-US/docs/Code_snippets/HTML_to_DOM">HTML to DOM</a></dt>
+ <dd>Using a hidden browser element to parse HTML to a window's DOM</dd>
+</dl>
+
+<h2 id="javascript-libraries" name="javascript-libraries">JavaScript libraries</h2>
+
+<p>Here are some JavaScript libraries that may come in handy.</p>
+
+<dl>
+ <dt><a href="/en-US/docs/Code_snippets/StringView" title="/en-US/docs/Code_snippets/StringView">StringView</a></dt>
+ <dd>A library that implements a <code>StringView</code> view for <a href="/en-US/docs/Web/JavaScript/Typed_arrays" title="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a>. This lets you access data in typed arrays using C-like string functions.</dd>
+ <dt><a href="/en-US/Add-ons/Code_snippets/Rosetta" title="/en-US/docs/Code_snippets/Rosetta">Rosetta</a></dt>
+ <dd>By default, the only possible standardized scripting language for HTML is <strong>ECMAScript</strong>. Hence, if you are going to use another scripting language you might expect that most of the browsers will not recognize it. Nevertheless, the increasing computational power of modern browsers together with the introduction of <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays">typed arrays</a> in ECMAScript allow us, in theory, to build full <a class="external external-icon" href="https://en.wikipedia.org/wiki/Virtual_machine">virtual machines</a> in pure ECMAScript. Therefore, it is also possible, in theory, to use ECMAScript for a smaller task: parsing exotic programming languages (i.e., creating compilers). This snippets shows a possible way to start from.</dd>
+</dl>
+
+<h2 id="Browser-oriented_code" name="Browser-oriented_code">Browser-oriented code</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Code_snippets/Tabbed_browser" title="/en-US/docs/Code_snippets/Tabbed_browser">Tabbed browser code</a> (Firefox/SeaMonkey)</dt>
+ <dd>Basic operations, such as page loading, with the tabbed browser, which is the heart of Mozilla's browser applications</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Cookies" title="/en-US/docs/Code_snippets/Cookies">Cookies</a></dt>
+ <dd>Reading, writing, modifying, and removing cookies</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Page_Loading" title="/en-US/docs/Code_snippets/Page_Loading">Page Loading</a></dt>
+ <dd>Code used to load pages, reload pages, and listen for page loads</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Interaction_between_privileged_and_non-privileged_pages" title="/en-US/docs/Code_snippets/Interaction_between_privileged_and_non-privileged_pages">Interaction between privileged and non-privileged code</a></dt>
+ <dd>How to communicate from extensions to websites and vice-versa.</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Downloading_Files" title="/en-US/docs/Code_snippets/Downloading_Files">Downloading Files</a></dt>
+ <dd>Code to download files, images, and to monitor download progress</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Password_Manager" title="/en-US/docs/Code_snippets/Password_Manager">Password Manager</a></dt>
+ <dd>Code used to read and write passwords to/from the integrated password manager</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Bookmarks" title="/en-US/docs/Code_snippets/Bookmarks">Bookmarks</a></dt>
+ <dd>Code used to read and write bookmarks</dd>
+ <dt><a href="/en-US/docs/Code_snippets/JavaScript_Debugger_Service" title="/en-US/docs/Code_snippets/JavaScript_Debugger_Service">JavaScript Debugger Service</a></dt>
+ <dd>Code used to interact with the JavaScript Debugger Service</dd>
+</dl>
+
+<h2 id="SVG" name="SVG">SVG</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Code_snippets/SVG_General" title="/en-US/docs/Code_snippets/SVG_General">General</a></dt>
+ <dd>General information and utilities</dd>
+ <dt><a href="/en-US/docs/Code_snippets/SVG_Animation" title="/en-US/docs/Code_snippets/SVG_Animation">SVG Animation</a></dt>
+ <dd>Animate SVG using JavaScript and SMIL</dd>
+ <dt><a href="/en-US/docs/Code_snippets/SVG_Interacting_with_script" title="/en-US/docs/Code_snippets/SVG_Interacting_with_script">SVG Interacting with Script</a></dt>
+ <dd>Using JavaScript and DOM events to create interactive SVG</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Embedding_SVG" title="/en-US/docs/Code_snippets/Embedding_SVG">Embedding SVG in HTML and XUL</a></dt>
+ <dd>Using SVG to enhance HTML or XUL based markup</dd>
+</dl>
+
+<h2 id="XUL_Widgets" name="XUL_Widgets">XUL Widgets</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Code_snippets/HTML_in_XUL_for_rich_tooltips" title="/en-US/docs/Code_snippets/HTML_in_XUL_for_rich_tooltips">HTML in XUL for Rich Tooltips</a></dt>
+ <dd>Dynamically embed HTML into a XUL element to attain markup in a tooltip</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Label_and_description" title="/en-US/docs/Code_snippets/Label_and_description">Label and description</a></dt>
+ <dd>Special uses and line breaking examples</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Tree" title="/en-US/docs/Code_snippets/Tree">Tree</a></dt>
+ <dd>Setup and manipulation of trees using XUL and JS</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Scrollbar" title="/en-US/docs/Code_snippets/Scrollbar">Scrollbar</a></dt>
+ <dd>Changing style of scrollbars. Applies to scrollbars in browser and iframe as well.</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Autocomplete" title="/en-US/docs/Code_snippets/Autocomplete">Autocomplete</a></dt>
+ <dd>Code used to enable form autocomplete in a browser</dd>
+ <dt><a href="/en-US/docs/Code_snippets/Boxes" title="/en-US/docs/Code_snippets/Boxes">Boxes</a></dt>
+ <dd>Tips and tricks when using boxes as containers</dd>
+ <dt><a class="internal" href="/en-US/docs/Code_snippets/Tabbox" title="/en-US/docs/Code snippets/Tabbox">Tabbox</a></dt>
+ <dd>Removing and manipulating tabs in a tabbox</dd>
+</dl>
+
+<h2 id="Windows-specific" name="Windows-specific">Windows-specific</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Code_snippets/Finding_Window_Handles" title="/en-US/docs/Code_snippets/Finding_Window_Handles">Finding Window Handles (HWND)</a> (Firefox)</dt>
+ <dd>How to use Windows API calls to find various kinds of Mozilla window handles. Window handles can be used for IPC and Accessibility purposes.</dd>
+ <dt><a href="/en-US/docs/Accessing_the_Windows_Registry_Using_XPCOM" title="/en-US/docs/Accessing_the_Windows_Registry_Using_XPCOM">Using the Windows Registry with XPCOM</a></dt>
+ <dd>How to read, write, modify, delete, enumerate, and watch registry keys and values.</dd>
+</dl>
+
+<h2 id="External_links" name="External_links">Links externos</h2>
+
+<p>
+  O conteúdo do <a class="external" href="https://kb.mozillazine.org/Category:Example_code"><span lang="en">MozillaZine Example Code</span></a> está sendo movido lentamente para cá, mas você ainda pode encontrar exemplos úteis.
+</p>
diff --git a/files/pt-br/mozilla/add-ons/creating_opensearch_plugins_for_firefox/index.html b/files/pt-br/mozilla/add-ons/creating_opensearch_plugins_for_firefox/index.html
new file mode 100644
index 0000000000..677ed79638
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/creating_opensearch_plugins_for_firefox/index.html
@@ -0,0 +1,168 @@
+---
+title: Criando um plugin OpenSearch para Firefox
+slug: Mozilla/Add-ons/Creating_OpenSearch_plugins_for_Firefox
+tags:
+  - OpenSearch
+  - Plugins
+  - busca
+translation_of: Web/OpenSearch
+---
+<p>{{ fx_minversion_header("2") }}</p>
+<p><a href="/en-US/Firefox/Releases/2" title="/en-US/Firefox/Releases/2">Firefox 2</a> suporta formatos descrições <a class="external" href="http://opensearch.org/">OpenSearch</a> para plungins de busca. Plugins que usam a <a class="external" href="http://www.opensearch.org/Specifications/OpenSearch/1.1#OpenSearch_description_document">syntax de descrição OpenSearch</a> são compatíveis com IE 7 e Firefox. Devido isto, ele é o formato recomendado para o uso na web.</p>
+<p>Firefox também suporta recursos adicionais não incluídos na <a class="external" href="http://www.opensearch.org/Specifications/OpenSearch/1.1#OpenSearch_description_document">syntax de descrição OpenSearch</a>, como sugestões de busca e elementos  <code>SearchForm</code>. Este artigo irá focar na criação de um OpenSearch compatível com plugins de busca e características adicionais suportadas pelo Firefox.</p>
+<p>Arquivos de descrição podem também ser descritos automaticamente pelo <a href="#Autodiscovery_of_search_plugins">Autodiscovery of search plugins</a>,  e podem ser instalados via programação como descrito em <a href="/en/Adding_search_engines_from_web_pages" title="en/Adding_search_engines_from_web_pages">Adding search engines from web pages</a>.</p>
+<h2 id="Arquivo_de_descrição_OpenSearch" style="line-height: 30px;">Arquivo de descrição OpenSearch</h2>
+<p>O Arquivo XML descrevendo um motor de busca é bastante simples, seguindo o template básico a seguir. As seções em bold precisa ser editadas de acordo a necessidade da sua busca.</p>
+<pre class="brush: xml" style="font-size: 14px;">&lt;?xml version="1.0" encoding="UTF-8"?&gt;
+&lt;OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/"
+                       xmlns:moz="http://www.mozilla.org/2006/browser/search/"&gt;
+  &lt;ShortName&gt;<strong>SNK</strong>&lt;/ShortName&gt;
+  &lt;Description&gt;<strong>Search engine full control</strong>&lt;/Description&gt;
+  &lt;InputEncoding&gt;<strong>UTF-8</strong>&lt;/InputEncoding&gt;
+  &lt;Image width="16" height="16" type="image/x-icon"&gt;data:image/x-icon;base64,http://www.world-connect-commodities.ro:20523/Style%20Library/icon.png&lt;/Image&gt;
+  &lt;Url type="text/html" method="<strong>method</strong>" template="<strong>searchURL</strong>"&gt;
+    &lt;Param name="key/value pairs" value="<code>{searchTerms}</code>"/&gt;
+    ...
+    &lt;Param name="key/value pairs" value="<code>{searchTerms}</code>"/&gt;
+  &lt;/Url&gt;
+  &lt;Url type="application/x-suggestions+json" template="<strong>suggestionURL</strong>"/&gt;
+  &lt;moz:SearchForm&gt;http://www.world-connect-commodities.ro:8775/Search/default.aspx&lt;/moz:SearchForm&gt;
+&lt;/OpenSearchDescription&gt;</pre>
+<dl>
+ <dt>
+  <strong>ShortName</strong></dt>
+ <dd>
+  Um nome para seu motor de busca.</dd>
+ <dd>
+  <strong>Restrições:</strong> O valor deve conter até 16 caracteres. Este valor também não deve conter markup HTML.</dd>
+</dl>
+<dl>
+ <dt>
+  <strong>Descrição</strong></dt>
+ <dd>
+  Uma breve descrição do seu motor de busca.</dd>
+ <dd>
+  <strong>Restrições:</strong> Este valor deve conter até 1024 caracteres. Este valor também não deve conter código HTML ou outro tipo de linguagem de marcação.</dd>
+</dl>
+<dl>
+ <dt>
+  <strong>InputEncoding</strong></dt>
+ <dd>
+  Define o ecoding a ser usado na busca. Exemplo: <code>&lt;InputEncoding&gt;UTF-8&lt;/InputEncoding&gt;</code>.</dd>
+</dl>
+<dl>
+ <dt>
+  <strong>Image</strong></dt>
+ <dd>
+  URI para um icone que represente o motor de busca. Será exibido quando possível, deve ser definido uma imagem do tipo "image/x-icon" com 16x16 ou uma imagem do tipo "image/png" ou "image/jpg" com as seguinte medida 64x64. O link também suporta o formato <a class="external" href="http://en.wikipedia.org/wiki/Data:_URI_scheme">data: URI scheme</a>. Uma ferramenta útil que pode ser utilizada apra construir imagem no formato data você encontra aqui: <a class="external" href="http://software.hixie.ch/utilities/cgi/data/data">The data: URI kitchen</a>.
+  <pre class="eval">&lt;Image height="16" width="16" type="image/x-icon"&gt;<a class="external" href="http://example.com/favicon.ico" rel="freelink">http://example.com/favicon.ico</a>&lt;/Image&gt;
+  OR
+&lt;Image height="16" width="16"&gt;data:image/x-icon;base64,AAABAAEAEBAAA ... DAAA=&lt;/Image&gt;
+</pre>
+  O Firefox armazena os icones no formato base64 data: As URL's (do plug-ins de busca são armazenados na pasta "searchplugins" no perfil do usuário). http: URIs são alteradas para data: URIs quando isto é feito.</dd>
+ <dd>
+  <div class="note">
+   <strong>Nota:</strong> Para icones carregados remotamente (ex. de http:// URIs), o Firefox irá rejeitar ícones maiores que 10000 bytes.</div>
+ </dd>
+</dl>
+<dl>
+ <dt>
+  <strong>Url</strong></dt>
+ <dd>
+  Descreve a URL ou URLs para ser usada pela search. O atributo <code>method</code> indica se deve ser usada uma requisição <code>GET</code> ou <code>POST</code> para buscar o resultado. O atributo <code>template</code> indica a URL base para a query da busca.</dd>
+ <dd>
+  <div class="note">
+   <strong>Nota:</strong> Internet Explorer 7 não suporta requisições do tipo <code>POST</code>.</div>
+ </dd>
+</dl>
+<dl>
+ <dd>
+  Existem três tipos de URL que o Firefox suporta:</dd>
+</dl>
+<ul>
+ <li><code>type="text/html"</code> é usado para especificar a URL para query atual da pesquisa.</li>
+ <li><code>type="application/x-suggestions+json"</code> é usado para especificar a URL que retorna sugestões para a busca.</li>
+ <li><code>type="application/x-moz-keywordsearch"</code> é usado para especificar a URL usada quando uma palavra chave da busca é inserida na location bar. Isto não é suportado no Internet Explorer.</li>
+</ul>
+<dl>
+ <dd>
+  Para este tipo de URL's você pode usar <code>{searchTerms}</code> para substituir os termos inseridos na busca pelo o usuário na barra de busca ou location bar. Outro parâmetro suportado dinamicamente são descritos em <a class="external" href="http://www.opensearch.org/Specifications/OpenSearch/1.1/Draft_3#OpenSearch_1.1_parameters">OpenSearch 1.1 parameters</a>.</dd>
+</dl>
+<dl>
+ <dd>
+  Para sugestões de queries, o template de URL especificado é usado para buscar sugestões em uma lista em um formato JavaScript Object Notation (JSON). Para detalhes de como implementar o suporte a sugestões de busca em seu servidor , veja <a href="/en/Supporting_search_suggestions_in_search_plugins" title="en/Supporting_search_suggestions_in_search_plugins">Supporting search suggestions in search plugins</a>.</dd>
+</dl>
+<p><img alt="Image:SearchSuggestionSample.png" class="internal" src="/@api/deki/files/358/=SearchSuggestionSample.png"></p>
+<dl>
+ <dt>
+  <strong>Param</strong></dt>
+ <dd>
+  Os parâmetros que precisam ser passados junto com a query da busca, com um par de key/value. Quando especifica os valores, você pode usar o <code>{searchTerms}</code> para inserir os termos de busca inseridos pelo o usuário na barra de busca.</dd>
+ <dd>
+  <div class="note">
+   <strong>Nota:</strong> O Internet Explorer 7 não tem suporte a este elemento.</div>
+ </dd>
+</dl>
+<dl>
+ <dt>
+  <strong>SearchForm</strong></dt>
+ <dd>
+  A URL que irá abrir a página de busca para qual plugin é designado. Este fornece um modo para o Firefox buscar diretamente no site.</dd>
+ <dd>
+  <div class="note">
+   <strong>Nota:</strong> Uma vez que o elemento é específico para Firefox, e não parte da especificação do OpenSearch, nos usamos o prefixo XML "<code>moz:</code>"  no exemplo acima para asegurar que os outros user agents que não tenham suporte ignorem o recurso por segurança.</div>
+ </dd>
+</dl>
+<h2 id="Detecção_automática_de_plugins_de_busca" style="line-height: 30px;">Detecção automática de plugins de busca</h2>
+<p>Um web site que oferece um plugin de busca pode notificar facilmente aos usuários do Firefox a instalação do plugin.</p>
+<p>Para o suporte a detecção automática, você simplesmente adicionaa uma linha na seção <code>&lt;head&gt;</code> do sua web page:</p>
+<pre class="eval" style="font-size: 14px;">&lt;link rel="search" type="application/opensearchdescription+xml" title="<em>searchTitle</em>" href="<em>pluginURL</em>"&gt;
+</pre>
+<p>Substitua os item em itálico como explicado a seguir:</p>
+<dl>
+ <dt>
+  <strong>searchTitle</strong></dt>
+ <dd>
+  O nome da busca a ser realizada, por exemplo,  "Search MDC" ou "Yahoo! Search". Este valor deve corresponder ao ShortName do seu plugin de busca.</dd>
+</dl>
+<dl>
+ <dt>
+  <strong>pluginURL</strong></dt>
+ <dd>
+  A URL para o XML do plugin de busca, a partir do qual o navegador irá baixar.</dd>
+</dl>
+<p>Se você oferece multiplas busca em seu site, você pode adicionar para todos eles o suporte a auto detecção dos seus plugins de busca. Por exemplo:</p>
+<pre class="eval" style="font-size: 14px;">&lt;link rel="search" type="application/opensearchdescription+xml" title="MySite: By Author" href="<a class="external" href="http://www.mysite.com/mysiteauthor.xml" rel="freelink">http://www.mysite.com/mysiteauthor.xml</a>"&gt;
+&lt;link rel="search" type="application/opensearchdescription+xml" title="MySite: By Title" href="<a class="external" href="http://www.mysite.com/mysitetitle.xml" rel="freelink">http://www.mysite.com/mysitetitle.xml</a>"&gt;
+</pre>
+<p>Deste modo, seu site irá oferecer plugins de busca para ambos os casos autor e título como no exemplo acima.</p>
+<h2 id="Suportando_atualizações_automáticas_para_OpenSearch_plugin" style="line-height: 30px;">Suportando atualizações automáticas para OpenSearch plugin</h2>
+<p>{{ fx_minversion_note("3.5", "Esta seção cobre uma feature introduzida na versão 3.5 do Firefox.") }}</p>
+<p>Iniciada na versão 3.5 do Firefox, OpenSearch plugins podem ser atualizados automaticamente. Para o suporte a este recurso, é preciso incluir uma url extra elemento do tipo  "<code>application/opensearchdescription+xml</code>".  O atributo  <code>rel</code> precisa ser "<code>self</code>" e o atributo template precisa ser a URL do documento OpenSearch para atualizar automaticamente.</p>
+<p>Por exemplo:</p>
+<pre style="font-size: 14px;">&lt;Url type="application/opensearchdescription+xml"
+     rel="self"
+     template="http://www.foo.com/mysearchdescription.xml" /&gt;
+</pre>
+<div class="note">
+ <strong>Nota:</strong> Neste momento, <a class="external" href="http://addons.mozilla.org" title="http://addons.mozilla.org/">addons.mozilla.org</a> (AMO) não dá suporte a updates automaticos do plugin OpenSearch plugins. Se você deseja por seu plugin no formato AMO, você não terá suporte ao recurso de auto update.</div>
+<h2 id="Dicas_para_solucionar_problemas" style="line-height: 30px;">Dicas para solucionar problemas </h2>
+<p>Se houver algum erro no seu XML do plugin de busca, você deve rodar o plugin do Firefox 2 para descobrir quais são os erros. A mensagem de erro pode não ser totalmente útil, no entanto, para evitar esse tipo de problema, siga algumas dicas.</p>
+<ul>
+ <li>Seu servidor deve fornecer suporte a plugin OpenSearch do tipo MIME <code>application/opensearchdescription+xml</code>.</li>
+ <li>Tenha certeza que seu XML do Plugin de Busca está bem formatado. Você pode checar lendo o arquivo diretamente no Firefox. Um &amp; em uma URL template precisa ser escapado com &amp;amp; e tags que precisam ser fechadas com uma barra ou tags correspondente.</li>
+ <li>O atributo <code>xmlns</code> é importante, sem isto você pode ter uma messagem de erro indicando:  "Firefox could not download the search plugin from: (URL)".</li>
+ <li>Note que você deve incluir uma URL <code>text/html</code> — plugin de busca inclui apenas o Atom ou a URL <a href="/en/RSS" title="en/RSS">RSS</a>  (cada um é valido, mas o Firefox não suporta) também irá gerar um erro "could not download the search plugin".</li>
+ <li>Favicons obtidos remotamente não devem ser maiores que 10KB(see {{ Bug(361923) }}).</li>
+</ul>
+<p>Além disso,  o plugin de busca fornece um serviço de que pode ser usado por desenvolvedores. Use <em>about:config</em> para ser a propriedade '<code>browser.search.log</code>' para <code>true</code>. As informações de log irá aparecer <a href="/en/Error_Console" title="en/Error_Console">Error Console</a> do Firefox (Tools-&gt;Error Console) quando os plugins de busca são adicionados.</p>
+<h2 id="Material_de_referência" style="line-height: 30px;">Material de referência</h2>
+<ul>
+ <li><a class="external" href="http://opensearch.org/">OpenSearch Documentation</a>, <a class="external" href="http://www.opensearch.org/Specifications/OpenSearch/Extensions/Parameter/1.0">OpenSearch Documentation about the Url and Param element</a></li>
+ <li>imdb.com has a <a class="external" href="http://i.media-imdb.com/images/SFccbe1e4d909ef8b8077201c3c5aac349/imdbsearch.xml">working osd.xml</a></li>
+ <li>More on Autodiscovery difficulties at bugzilla {{ Bug(340208) }}</li>
+ <li><a class="external" href="http://en.wikipedia.org/wiki/Data:_URI_scheme"><code>data:</code> URI scheme</a></li>
+ <li><a class="external" href="http://www.7is7.com/software/firefox/opensearch.html">OpenSearch Plugin Generator</a></li>
+ <li><a class="external" href="http://web.archive.org/web/20140110235956/http://searchplugins.net/">searchplugins.net</a> - create OpenSearch plugins for use with Firefox 2. <a class="external" href="http://web.archive.org/web/20131105052418/http://www.searchplugins.net/pluginlist.aspx">List of generated search plugins</a></li>
+ <li><a class="external" href="http://ready.to/search/en">Ready2Search</a> - create OpenSearch plugins. <a class="external" href="http://ready.to/search/make/en_make_plugin.htm">Customized Search through Ready2Search</a></li>
+</ul>
diff --git a/files/pt-br/mozilla/add-ons/enviando-um-complemento-para-o-amo/index.html b/files/pt-br/mozilla/add-ons/enviando-um-complemento-para-o-amo/index.html
new file mode 100644
index 0000000000..500f5ea50e
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/enviando-um-complemento-para-o-amo/index.html
@@ -0,0 +1,24 @@
+---
+title: Enviando um Complemento para o AMO
+slug: Mozilla/Add-ons/Enviando-um-complemento-para-o-AMO
+translation_of: Mozilla/Add-ons/Distribution
+---
+<p>Once you've developed a new add-on for a Mozilla-based product (Firefox, Thunderbird, or the Mozilla Suite), you'll want to make sure people can find out about and download it.</p>
+<p>Mozilla provides the <a class="external" href="http://addons.mozilla.org" rel="freelink">http://addons.mozilla.org</a> (AMO) web site to provide a repository for add-ons for Mozilla software. When users click the "Get Extensions" link in the <strong>Add-ons</strong> window in Firefox, for example, they are directed to this site.</p>
+<p>That makes AMO a great way to get your add-ons to the public. This article provides details on how to submit your article to AMO for distribution.</p>
+<div class="note">
+ <strong>Not</strong><strong>e:</strong> Attaching your add-on to articles on the Mozilla Developer Center web site won't do you a lot of good, as we delete them.  This is not the right place to post your add-ons; please follow the instructions here instead.</div>
+<h2 id="Step_1:_Write_your_add-on" name="Step_1:_Write_your_add-on">1º Passo: Escreva seu complemento</h2>
+<p>This is important. It's hard to get an add-on accepted into AMO if you don't write it first. Really hard.</p>
+<h2 id="Step_2:_Test_your_add-on" name="Step_2:_Test_your_add-on">2º Passo: Teste seu complemento</h2>
+<p>Make sure it works before you submit it. You should try it out on every product you claim to support. In other words, you don't want to advertise that it works in both Firefox and Thunderbird if you haven't tested it in both. Make sure it works in every version you claim to support, too.</p>
+<h2 id="Step_3:_Package_your_add-on" name="Step_3:_Package_your_add-on">3º Passo: Embale seu complemento</h2>
+<p>Add-ons distributed by AMO need to be packaged properly as XPI files. See <a href="/en/Extension_Packaging" title="en/Extension_Packaging">Extension Packaging</a> for information on how to do this.</p>
+<h2 id="Step_4:_Get_an_AMO_account" name="Step_4:_Get_an_AMO_account">4º Passo: Crie uma conta AMO</h2>
+<p>You'll need to have an AMO account so that you can make submissions. To get one, visit the <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/users/register">Register</a> link at the top of any page on the AMO website. Fill out the form and follow the instructions to activate your account.</p>
+<p>Obviously, you can skip this step if you already have an AMO account.</p>
+<h2 id="Step_5:_Submit_your_add-on" name="Step_5:_Submit_your_add-on">5º Passo: Envie seu complemento</h2>
+<p>To submit an add-on, go to the <a class="link-https" href="https://addons.mozilla.org/developers" title="https://addons.mozilla.org/developers">Developer Control Panel</a>.</p>
+<p>You will then be asked to supply a file, as well as information about the add-on.</p>
+<p>Once the add-on has been reviewed, it will be made available for downloading. Reviews can take a varying amount of time depending on how many pending submissions there are and the availability of people to perform the reviews.</p>
+<p>{{ languages( { "fr": "fr/Soumettre_un_module_sur_AMO" } ) }}</p>
diff --git a/files/pt-br/mozilla/add-ons/gerenciador_de_add-on/index.html b/files/pt-br/mozilla/add-ons/gerenciador_de_add-on/index.html
new file mode 100644
index 0000000000..3d2cca173d
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/gerenciador_de_add-on/index.html
@@ -0,0 +1,61 @@
+---
+title: Gerenciador de Complementos
+slug: Mozilla/Add-ons/Gerenciador_de_Add-on
+translation_of: Mozilla/JavaScript_code_modules/Add-on_Manager
+---
+<p>{{ gecko_minversion_header("2.0") }}</p>
+
+<p>O Gerenciador de Add-on (Add-on Manager) é responsável por gerenciar todos os add-ons instalados no aplicativo. Através de suas APIs, informação sobre todos os add-ons instalados pode ser recuperada e novos add-ons podem ser instalados. As APIs foram projetadas para serem genéricas e suportar muitos tipos diferentes de add-ons.</p>
+
+<p>Muitas funções na interface do Gerenciador de Add-on operam de modo assíncrono, retornando os resultados através de callbacks (funções de retrochamadas) passadas para as funções. As callbacks podem ser chamadas imediatamente enquanto as funções iniciais ainda estão em execução ou pouco tempo após, dependendo de quando os dados da requisição se tornem disponíveis.</p>
+
+<h2 id="Acessando_os_add-ons_instalados">Acessando os add-ons instalados</h2>
+
+<p>Informação sobre os add-ons instalados podem ser recuperadas através da  API principal <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonManager" title="AddonManager">AddonManager</a></code>. Todas as suas funções são assíncronas, isso significa que uma função de callback deve ser passada para receber as instâncias de <code><a href="/pt-BR/Add-ons/Add-on_Manager/Addon" title="Addon">Addon</a></code>. A função de callback pode muito bem ser chamada somente após a função da API retornar. Por exemplo:</p>
+
+<pre class="brush: js">Components.utils.import("resource://gre/modules/AddonManager.jsm");
+
+AddonManager.getAllAddons(function(aAddons) {
+  // Aqui aAddons é um array de objetos <code><a href="/pt-BR/Add-ons/Add-on_Manager/Addon" title="Addon">Addon</a></code>
+});
+// Esse código será executado antes do código dentro da callback
+</pre>
+
+<p>Notificações sobre mudanças nos add-ons instalados são dispachadas para quaisquer <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonListener" title="AddonListener">AddonListener</a></code>s. registrado Eles devem ser registrados através do método <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonManager#addAddonListener()" title="AddonManager.addAddonListener()">addAddonListener()</a></code>.</p>
+
+<h2 id="Instalando_novos_add-ons">Instalando novos add-ons</h2>
+
+<p>Novos add-ons podem ser instalados usando os métodos <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonManager#getInstallForFile()" title="AddonManager.getInstallForFile()">getInstallForFile()</a></code> ou <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonManager#getInstallForURL()" title="AddonManager.getInstallForURL()">getInstallForURL()</a></code> do objeto <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonManager" title="AddonManager">AddonManager</a></code>. Essas passsarão uma instância de <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonInstall" title="AddonInstall">AddonInstall</a></code> para a função de callback, que pode, então, ser usada para instalar o add-on:</p>
+
+<pre class="brush: js">Components.utils.import("resource://gre/modules/AddonManager.jsm");
+
+AddonManager.getInstallForURL("http://www.foo.com/test.xpi", function(aInstall) {
+  // aInstall é uma instância de <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonInstall" title="AddonInstall">AddonInstall</a></code>
+  aInstall.install();
+}, "application/x-xpinstall");
+</pre>
+
+<p>O progresso de <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonInstall" title="AddonInstall">AddonInstall</a></code> pode ser monitorado usando um <code><a href="/pt-BR/Add-ons/Add-on_Manager/InstallListener" title="InstallListener">InstallListener</a></code>. Um listener pode ser registgrado quer para uma instalação em particular usando o método <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonInstall#addListener()" title="AddonInstall.addListener()">addListener()</a></code> ou para todas as instalações usando o método <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonManager#addInstallListener()" title="AddonManager.addInstallListener()">addInstallListener()</a></code>.</p>
+
+<h2 id="Encontrando_atualizações">Encontrando atualizações</h2>
+
+<p>Pode-se verificar a existência de atualizações para Add-ons usando o método <code><a href="/pt-BR/Add-ons/Add-on_Manager/Addon#findUpdates()" title="Addon.findUpdates()">findUpdates()</a></code>. Deve-se lhe passar um <code><a href="/pt-BR/Add-ons/Add-on_Manager/UpdateListener" title="UpdateListener">UpdateListener</a></code> para receber informações sobre compatibilidade e informação de nova atualização. Qualquer atualização disponível é retornada  como um <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonInstall" title="AddonInstall">AddonInstall</a></code>, pronto para ser baixado e instalado.</p>
+
+<p>{{ h1_gecko_minversion("Detectando mudanças nos add-ons", "7.0") }}</p>
+
+<p>Você também pode conseguir listas de add-ons que, na inicialização, foram modificados de diversos modos. O método  <code><a href="/pt-BR/Add-ons/Add-on_Manager/AddonManager#getStartupChanges()" title="AddonManager.getStartupChanges()">getStartupChanges()</a></code> lhe permite descobir quais add-ons foram instalados, removidos, atualizados, habilitados ou desabilitados durante a inicialização do aplicativo.</p>
+
+<p>Por exemplo, para dar uma olhada nos add-ons que foram desabilitados durante a inicialização:</p>
+
+<pre class="brush: js">Components.utils.import("resource://gre/modules/AddonManager.jsm");
+
+let addonIDs = AddonManager.getStartupChanges(AddonManager.STARTUP_CHANGE_DISABLED);
+if (addonIDs.length &gt; 0) {
+  // addonIDs agora é um array das IDs dos  add-on que foram desabilitados
+alert("Nota: " + addonIDs.length + " add-ons foram desabilitados.");
+}
+</pre>
+
+<h2 id="Veja_também">Veja também</h2>
+
+<p>{{ ListSubpages() }}</p>
diff --git a/files/pt-br/mozilla/add-ons/index.html b/files/pt-br/mozilla/add-ons/index.html
new file mode 100644
index 0000000000..9b1b760481
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/index.html
@@ -0,0 +1,94 @@
+---
+title: Complementos
+slug: Mozilla/Add-ons
+tags:
+  - Add-ons
+  - Precisa de Tradução
+  - TopicStub
+translation_of: Mozilla/Add-ons
+---
+<div>{{AddonSidebar}}</div>
+<div class="summary">Modifique e amplie os aplicativos da Mozilla</div>
+
+<p><strong>Complementos</strong> acrescentam novas funcionalidades para os aplicativos baseados no <a href="/pt-BR/docs/Mozilla/Gecko" title="Informações do Gecko">Gecko</a> tais como Firefox, SeaMonkey e Thunderbird. Há dois tipos de complementos principais <a href="/pt-BR/docs/Mozilla/Add-ons/Gerenciador_de_Add-on#Extensoes">Extensões</a> adicionam novas características para o aplicativo, enquanto <a href="/pt-BR/docs/Mozilla/Add-ons/Temas">Temas</a> modificam a interface do aplicativo do usuário.</p>
+
+<p>Para ambos, extensões e temas, a Mozilla opera o repositório em <a href="https://addons.mozilla.org" title="Ir para a página de Complementos">addons.mozilla.org</a>, também conhecido como AMO. Quando você <a href="/pt-BR/docs/Mozilla/Add-ons/Enviando-um-complemento-para-o-AMO" title="Enviando seu complemento">Envia complementos para o AMO</a> eles são revisados e depois de passados na revisão, são disponibilizados aos usuários. Você não tem que enviar complementos para AMO, mas se enviar, os usuários terão mais confiança no fato de que eles foram revisados, e você pode se beneficiar da visibilidade AMO como uma fonte confiável para complementos úteis.</p>
+
+<p>O termo "complemento"(Add-ons) inclui plugins, extensões, temas, e plug-ins de mecanismos de busca (tal como google, bing, etc.).</p>
+
+<p>O <a href="/pt-BR/docs/Mozilla/Add-ons/Gerenciador_de_Add-on" title="Addons/Add-on Manager">Gerenciador de complementos</a> pode afetar o comportamento do aplicativo que o hospeda. Nós desenvolvemos <a href="/pt-BR/docs/Mozilla/Add-ons/Orientacoes-de-complementos" title="/Add-ons/Orientacoes-de-complementos">orientações de complementos</a> para ajudar a garantir que eles proveriam uma boa experiência para os usuários. Estas orientações se aplicam em todos tipos de complementos, mesmo se eles são hospedados em <a href="https://addons.mozilla.org" title="Ir para a página de Complementos">addons.mozilla.org</a> ou não.</p>
+
+<p>O <a href="/pt-BR/docs/Mozilla/Add-ons/Gerenciador_de_Add-on" title="Addons/Add-on Manager">Gerenciador de complementos</a> dá acesso aos complementos a fim de determinar o que está disponível, instalar, remover, desativar e atualizar.</p>
+
+<hr>
+<h2 id="Extensões_2"><a name="Extensões">Extensões</a></h2>
+
+<p>Extensões adicionam novas funcionalidades para aplicativos da Mozilla como Firefox e Thunderbird. Eles podem adicionar novos recursos ao navegador, como um jeito diferente de gerenciar as abas, e eles podem modificar o conteúdo da web para aperfeiçoar a usabilidade ou segurança sites específicos.</p>
+
+<p>Há três tipos de técnicas diferentes que você pode utilizar para construir uma extensão: Add-on baseado em extensões SDK, extensões <em>restartless</em> inicializadas manualmente e extensões overlay.</p>
+
+<ul class="card-grid">
+ <li>Desenvolva extensões que não requer a reinicialização do navegador utilizando um conjunto JavaScript APIs de alto nível.</li>
+ <li><a href="https://developer.mozilla.org/en-US/Add-ons/Bootstrapped_extensions">Extensões <em>Restartless</em></a><br>
+  Desenvolva extensões que não requer a reinicialização do navegador.</li>
+ <li><a href="https://developer.mozilla.org/en-US/Add-ons/Overlay_Extensions"><span>Extensões Overlay</span></a><br>
+  Extensões que requerem a reinicialização do navegador para instalar, geralmente usando <a href="https://developer.mozilla.org/pt-BR/docs/Mozilla/Tech/XUL/Overlays">overlays XUL</a>.</li>
+</ul>
+
+<p>Se você puder, é aconselhável utilizar o Add-on SDK, que usa o mecanismo de extensão restartless mas simplifica determinadas tarefas e limpa depois de si mesmo. Se o Add-on SDK não é suficiente para as suas necessidades, implemente uma extensão restartless manual no lugar.</p>
+
+<p>Para obter mais informações sobre como escolher qual a técnica de usar, leia esta <a href="https://developer.mozilla.org/en-US/Add-ons/Comparing_Extension_Toolchains">comparação</a>.</p>
+
+<div class="column-container">
+<div class="column-half">
+<h3 id="Práticas_Recomendadas">Práticas Recomendadas</h3>
+
+<p>Não importa como você desenvolve uma extensão, existem algumas orientações que você pode seguir para ajudar a garantir que sua extensão fornece uma experiência tão boa para o usuário o quão possível.</p>
+
+<dl>
+ <dt><a href="https://developer.mozilla.org/en-US/Add-ons/Performance_best_practices_in_extensions">Desempenho</a></dt>
+ <dd>Assegurando que sua extensão é rápida, responsiva e eficiente para a memória.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/Add-ons/Security_best_practices_in_extensions">Segurança</a></dt>
+ <dd>Assegurando que sua extensão não exponha o usuário para websites maliciosos.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/Add-ons/Extension_etiquette">Etiqueta</a></dt>
+ <dd>Assegurando que sua extensão funcione bem com outras extensões.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<h3 id="Aplicativo_específico">Aplicativo específico</h3>
+
+<p>A maioria das documentações assume que você está desenvolvendo para o Firefox Desktop. Se você está desenvolvendo para algum outro aplicativo baseado no Gecko, há diferenças importantes que você precisa saber sobre.</p>
+
+<dl>
+ <dt><a href="https://developer.mozilla.org/en-US/Add-ons/Thunderbird">Thunderbird</a></dt>
+ <dd>Desenvolvendo extensões para o Thunderbird mail client.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/Add-ons/Firefox_for_Android">Firefox para Android</a></dt>
+ <dd>Desenvolvendo extensões para Firefox para Android.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/Add-ons/SeaMonkey_2">SeaMonkey</a></dt>
+ <dd>Desenvolvendo extensões para <a href="http://www.seamonkey-project.org/">SeaMonkey</a> <span class="short_text" id="result_box" lang="pt"><span class="hps">suíte de</span> <span class="hps">software.</span></span></dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h2 id="Temas"><a name="Themes">Temas</a></h2>
+
+<p>Os temas são add-ons que personalizam a IU do aplicativo. Existem dois tipos de temas: temas leves e temas completos.</p>
+
+<div class="column-container">
+<div class="column-half">
+<p><a href="https://addons.mozilla.org/en-US/developers/docs/themes">Temas Leves</a> são muito mais simples de implementar do que temas completos, mas fornece a personalização muito limitada.</p>
+</div>
+
+<div class="column-half">
+<p><span id="result_box" lang="pt">Com <a href="https://developer.mozilla.org/en-US/docs/Themes">Temas Completos</a> você pode fazer modificações mais profundas na IU. A documentação para temas completos é fora da data, mas está ligada a aqui como uma possível base para a documentação atualizada.</span></p>
+</div>
+</div>
+
+<hr>
+<h2 id="Outros_tipos_de_complementos">Outros tipos de complementos</h2>
+
+<p><span id="result_box" lang="pt"><a href="/pt-BR/docs/Mozilla/Add-ons/Creating_OpenSearch_plugins_for_Firefox">Plugins de Search Engine</a> são um tipo simples e muito específico de add-on: eles adicionam novos mecanismos de busca para barra de pesquisa do navegador.<br>
+ <br>
+ <a href="https://developer.mozilla.org/en-US/docs/Plugins">Plugins</a> ajuda a aplicação a entender o conteúdo web que não é suportado nativamente. Plugins NPAPI são uma tecnologia antiga e os novos sites não devem usá-las. Em geral, os plugins não estão disponíveis na maioria dos sistemas móveis modernos, e os sites devem evitar usar plugins.</span></p>
diff --git a/files/pt-br/mozilla/add-ons/interface-com-o-repositorio_add-on/index.html b/files/pt-br/mozilla/add-ons/interface-com-o-repositorio_add-on/index.html
new file mode 100644
index 0000000000..8b1970eb97
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/interface-com-o-repositorio_add-on/index.html
@@ -0,0 +1,96 @@
+---
+title: Interface com o Repositório de Complementos
+slug: Mozilla/Add-ons/Interface-com-o-Repositorio_Add-on
+translation_of: Mozilla/JavaScript_code_modules/Interfacing_with_the_Add-on_Repository
+---
+<p>{{ gecko_minversion_header("2.0") }}</p>
+<p>The <a href="/en/Addons/Add-on_Repository" title="en/Addons/Add-on Repository">Add-on Repository</a> JavaScript code module makes it easy for your extension to interface with the AMO repository. You an use the code module to get lists of add-ons and even install new add-ons. This article provides some sample code that queries the recommended add-ons list on AMO and lets the user click a button to install an add-on from the list.</p>
+<h2 id="Importando_o_módulo_de_código_do_repositório">Importando o módulo de código do repositório</h2>
+<p>Before you can use the Add-on Repository API, you need to import the code module:</p>
+<pre>Components.utils.import("resource://gre/modules/AddonRepository.jsm");
+</pre>
+<p>Having done this, you can then access the API through the resulting <code>AddonRepository</code> object.</p>
+<h2 id="Habilitando_as_características_recomendadas">Habilitando as características recomendadas</h2>
+<p>In current builds of Firefox 4, the recommendation API doesn't work because the preference for the URL to query to get recommended add-ons is not included by default; see {{ bug(628785) }}. To make the service work for the time being, you can use code like this when your extension starts up:</p>
+<pre class="brush: js">var prefsService = Components.classes["@mozilla.org/preferences-service;1"]
+                        .getService(Components.interfaces.nsIPrefService);
+var prefBranch = prefsService.getBranch("extensions.");
+
+var recUrl = "";
+
+try {
+  recUrl = prefBranch.getCharPref("getAddons.recommended.url");
+} catch(e) {
+  recurl = "";
+}
+
+if (recUrl == "") {
+  prefBranch.setCharPref("getAddons.recommended.url",
+                    "https://services.addons.mozilla.org/%LOCALE%/%APP%/api/%API_VERSION%/list/recommended/all/%MAX_RESULTS%/%OS%/%VERSION%?src=firefox");
+  prefsService.savePrefFile(null);
+}
+</pre>
+<p>This fetches the value of the <code>extensions.getAddons.recommended.url</code> preference, and, if the preference doesn't exist or has no value, sets the value of the preference to the correct one for the AMO site.</p>
+<h2 id="Iniciando_uma_requisição">Iniciando uma requisição</h2>
+<p>To start a search of the repository, you can use either of the following methods:</p>
+<dl>
+ <dt>
+  <code>searchAddons()</code></dt>
+ <dd>
+  Queries the add-on repository for add-ons matching given search criteria.</dd>
+ <dt>
+  <code>retrieveRecommendedAddons()</code></dt>
+ <dd>
+  Retrieves a list of recommended add-ons, as determined by the AMO site administrators.</dd>
+</dl>
+<p>This example will use the latter, in order to randomly select a recommended add-on and offer to install it. However, the code to perform a search term based query would be very similar.</p>
+<p>When the user clicks a toolbar button to initiate the query, the following code gets run to start the request:</p>
+<pre>AddonRepository.retrieveRecommendedAddons(10, this);
+</pre>
+<p>This asks the repository to fetch up to 10 add-ons, using the object <code>this</code> as the target for callbacks. The callback object needs to implement the <a href="/en/Addons/Add-on_Repository/SearchCallback" title="en/Addons/Add-on Repository/SearchCallback"><code>SearchCallback</code></a> interface, providing the methods that get called when a search either fails or completes successfully.</p>
+<h2 id="Manipulando_falsas_requisições">Manipulando falsas requisições</h2>
+<p>The callback object must have a <a href="/en/Addons/Add-on_Repository/SearchCallback#searchFailed()" title="en/Addons/Add-on Repository/SearchCallback#searchFailed()"><code>searchFailed()</code></a> method; this gets called when a repository search fails to execute. The most common cause of failure (other than the search URL preference being incorrect) is if there is already a pending request, since only one request can be in progress at a time. For example:</p>
+<pre class="brush: js">searchFailed: function() {
+  this.showNotification("I have no recommendations for you right now!",
+          "Oh noes!", null);
+},
+</pre>
+<p>Here, we call a <code>showNotification()</code> method with some parameters that we'll look at shortly when we get to our <code>showNotification()</code> method below. The important thing to note is that this will handle the failure case.</p>
+<h2 id="Manipulando_requisições_de_sucesso">Manipulando requisições de sucesso</h2>
+<p>The callback object's searchSucceeded() method gets called when a search completes successfully. It receives a list of the matching addons, the number of add-ons returned, and the total number of add-ons that matched the query (in case the returned number is smaller than the requested number, for example).</p>
+<p>For example:</p>
+<pre class="brush: js">searchSucceeded: function(addons, addonCount, totalResults) {
+  var num = Math.floor(Math.random() * addonCount);
+
+  this.showNotification("Would you like to try the " + addons[num].name + " addon?",
+          "Install", addons[num].install);
+},
+</pre>
+<p>This routine randomly selects one of the returned add-ons, then calls the previously mentioned <code>showNotification()</code> routine, passing in as parameters a prompt including the name of the returned add-on, a label for the button to show in the notification ("Install"), and the <a href="/en/Addons/Add-on_Manager/AddonInstall" title="en/Addons/Add-on Manager/AddonInstall"><code>AddonInstall</code></a> object that can be used with the Add-on Manager API to install the add-on.</p>
+<h2 id="Instalando_Extensões">Instalando Extensões</h2>
+<p>The <code>showNotification()</code> routine displays a notification box offering to install the recommended add-on, if one was found, or reports an error if the search failed:</p>
+<pre class="brush: js">showNotification: function(prompt, button, installObj) {
+  this.install = installObj;
+  var box = PopupNotifications.show(gBrowser.selectedBrowser, "sample-popup",
+          prompt,
+          null, /* anchor ID */
+          {
+            label: button,
+            accessKey: "I",
+            callback: function() {
+              if (popupnotifications.install) {
+                popupnotifications.install.install();
+              } else {
+                PopupNotifications.remove(box);
+              }
+            }
+          },
+          null  /* secondary action */
+          );
+}
+</pre>
+<p>The code here starts by stashing the passed-in <a href="/en/Addons/Add-on_Manager/AddonInstall" title="en/Addons/Add-on Manager/AddonInstall"><code>AddonInstall</code></a> object for later use, then creates and displays the <a href="/en/JavaScript_code_modules/PopupNotifications.jsm" title="en/JavaScript code modules/PopupNotifications.jsm">pop-up notification</a> box with the text and button label passed into the method.</p>
+<p><img alt="popup.png" class="internal default" src="/@api/deki/files/4918/=popup.png"></p>
+<p>The pop-up callback function that gets called when the user clicks the button looks to see if there's a non-null <a href="/en/Addons/Add-on_Manager/AddonInstall" title="en/Addons/Add-on Manager/AddonInstall"><code>AddonInstall</code></a> object reference; if it's <code>null</code>, then the pop-up is displaying an error notification, so clicking the button simply dismisses the pop-up. Otherwise, the <a href="/en/Addons/Add-on_Manager/AddonInstall" title="en/Addons/Add-on Manager/AddonInstall"><code>AddonInstall</code></a> object's <a href="/en/Addons/Add-on_Manager/AddonInstall#install()" title="en/Addons/Add-on Manager/AddonInstall#install()"><code>install()</code></a> method is called to install the add-on.</p>
+<p>This doesn't display any UI showing that the install is taking place; however, if you go to the Add-on Manager panel, you'll see the pending install listed among your add-ons.</p>
+<p><img alt="install.png" class="internal default" src="/@api/deki/files/4919/=install.png"></p>
diff --git a/files/pt-br/mozilla/add-ons/orientacoes-de-complementos/index.html b/files/pt-br/mozilla/add-ons/orientacoes-de-complementos/index.html
new file mode 100644
index 0000000000..fe51cb25a2
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/orientacoes-de-complementos/index.html
@@ -0,0 +1,117 @@
+---
+title: Orientações de complementos
+slug: Mozilla/Add-ons/Orientacoes-de-complementos
+translation_of: 'https://extensionworkshop.com/documentation/publish/add-on-policies/'
+---
+<p>These add-on guidelines were created to foster an open and diverse add-on developer community while ensuring an excellent user experience. They apply to all add-ons and add-on updates regardless of where they are hosted, and also apply to customizations performed by installers that configure Firefox without using an add-on. Add-ons hosted on <a class="external text" href="https://addons.mozilla.org/" rel="nofollow">AMO</a> are subject to <a href="https://addons.mozilla.org/developers/docs/policies" title="https://addons.mozilla.org/developers/docs/policies">additional policies</a>.</p>
+<h2 id="Ser_Transparente">Ser Transparente</h2>
+<ul>
+ <li>Add-ons must either be installed using the add-on web install system, or be approved by the user using the <a class="external text" href="https://blog.mozilla.org/addons/2011/08/11/strengthening-user-control-of-add-ons/" rel="nofollow">install opt-in dialog</a>.
+  <ul>
+   <li>We want our users to know what they are installing so that they are not unpleasantly surprised by changes they did not expect. We also want them to know what to remove if they decide not to keep it.</li>
+   <li>Add-ons installed through application installers should <a class="external text" href="/en-US/docs/Adding_Extensions_using_the_Windows_Registry" rel="nofollow">use the Windows Registry</a> or equivalent global install methods so that Firefox displays the opt-in screen. The opt-in screen must not be tampered with in any way, including overlaying additional information or images on top of it.</li>
+  </ul>
+ </li>
+ <li>Add-ons must always be possible to uninstall or disable from the Add-ons Manager.
+  <ul>
+   <li>Add-ons installed globally using the Windows registry or global extension directories cannot be uninstalled (<a class="external text" href="https://bugzilla.mozilla.org/show_bug.cgi?id=640775" rel="nofollow">bug 640775</a>), but they can be disabled to the same effect.</li>
+  </ul>
+ </li>
+ <li>Add-ons must use a <a class="external text" href="/en-US/docs/Install_manifests#id" rel="nofollow">single unique ID</a> during their entire lifetime.
+  <ul>
+   <li>Using the same ID for multiple products, or multiple IDs for a single product, can lead to problems with automatic updates as well as blocklisting conflicts. Add-ons may change their IDs due to ownership changes, as they commonly use an email address-like format (
+    <i>
+     e.g.,</i>
+    personasplus@mozilla.com).</li>
+  </ul>
+ </li>
+ <li>Add-ons must not use brand names, trademarks, or other terms in ways that deceive users. Using Mozilla trademarks must follow <a class="external text" href="http://www.mozilla.org/foundation/trademarks/policy.html" rel="nofollow">our trademark policy</a>.</li>
+ <li>Add-ons should clearly communicate their intended purpose and active features, including features introduced through updates.
+  <ul>
+   <li>While we understand and support add-on developers who choose to monetize their products, this should not come at the expense of users' browsing experience. If an add-on inserts advertisements, affiliate codes, sponsored search results, or the like, into web pages, the user should be made aware of this when the add-on is installed. Likewise, if some features require payment to use, or require payment to remain active after a trial period, users should be made aware of this.</li>
+  </ul>
+ </li>
+</ul>
+<h2 id="Respeitar_os_Usuários">Respeitar os Usuários</h2>
+<ul>
+ <li>Add-ons must remove all introduced code, executables, and application configuration changes when they are uninstalled.
+  <ul>
+   <li>Uninstalling an add-on using the regular uninstall process should generally suffice. This guideline primarily applies to changes made to preferences such as the homepage, default search URL, network settings, and so forth. These preferences should be restored to their previous values when the add-on is uninstalled. Most add-ons can easily accomplish this by making such changes via a <a class="external text" href="/en-US/docs/Building_an_Extension#Defaults_Files" rel="nofollow">default preferences file</a>.</li>
+  </ul>
+ </li>
+ <li>Add-ons must respect the users' choices and not make unexpected changes, or limit users' ability to revert them.
+  <ul>
+   <li>For instance, users generally do not expect an add-on to change the Firefox homepage. Asking users to opt-in to such extra changes is recommended.</li>
+   <li>Making settings changes difficult or impossible to revert is prohibited. It's not allowed to block users or other add-ons or installers from changing any settings.</li>
+  </ul>
+ </li>
+ <li>Add-ons should make it clear how private user data is being used.
+  <ul>
+   <li>Add-ons which send user data over the Internet should generally provide a Privacy Policy, ideally concise and easily readable.</li>
+  </ul>
+ </li>
+ <li>Add-on developers should provide a mechanism for them to be contacted.
+  <ul>
+   <li>While developers are not required to provide a support channel for users, it is recommended. All add-on developers should have a contact form or public email address so that they can be contacted in case of emergencies, such as guideline violations that could lead to blocklisting.</li>
+  </ul>
+ </li>
+</ul>
+<h2 id="Ser_Seguro">Ser Seguro</h2>
+<ul>
+ <li>Add-ons must not cause harm to users' data, system, or online identities.</li>
+ <li>Add-ons must not transmit users' private data unsafely, or expose it to third parties unnecessarily.
+  <ul>
+   <li>Private data should always be sent over a secure connection. This includes browsing data such as visited URLs and bookmarks.</li>
+   <li>Making the browser easier to fingerprint by adding text to the User-Agent string or adding custom headers is also a privacy concern, and should be avoided.</li>
+  </ul>
+ </li>
+ <li>Add-ons must not create or expose application or system vulnerabilities.
+  <ul>
+   <li>Security bugs happen, but once discovered they need to be addressed immediately. A popular add-on with a security vulnerability is a valuable attack vector for hackers, and in such cases we will move quickly to blocklist the add-on if there is no prompt response from the developer.</li>
+  </ul>
+ </li>
+ <li>Add-ons must not tamper with the application or blocklist update systems.</li>
+ <li>Add-ons should not store any browsing data while in Private Browsing Mode.
+  <ul>
+   <li>It's worth stressing that PBM is about avoiding storing
+    <i>
+     local</i>
+    data while browsing, not about sending data elsewhere. To learn more about PBM we recommend reading <a class="external text" href="http://ehsanakhgari.org/tag/privatebrowsing" rel="nofollow">Ehsan's blog posts</a> about it.</li>
+  </ul>
+ </li>
+</ul>
+<h2 id="Ser_Estável">Ser Estável</h2>
+<ul>
+ <li>Add-ons must not cause hangs or crashes.</li>
+ <li>Add-ons should not break or disable core application features.
+  <ul>
+   <li>This includes features like tabbed browsing, Private Browsing Mode, and the location bar. Add-ons that are specifically meant to do this are exempt.</li>
+  </ul>
+ </li>
+ <li>Add-ons should not cause memory leaks, or unnecessarily consume large amounts of memory.</li>
+ <li>Add-ons should not slow down the application or system significantly.</li>
+ <li>Add-ons should not consume network resources to an extent that affects regular application usage.
+  <ul>
+   <li>Downloading large amounts of data without user awareness can significantly disrupt regular browsing, and may result in unexpected charges for users who have network usage limitations (notably on mobile).</li>
+  </ul>
+ </li>
+</ul>
+<h2 id="Exceções">Exceções</h2>
+<ul>
+ <li>Add-ons can break some of these guidelines if that's their intended purpose and there isn't malicious intent (
+  <i>
+   e.g.,</i>
+  a security exploit proof of concept).</li>
+ <li>Add-ons deployed by administrators within workplaces, schools, kiosks, and so forth, are exempt from most guidelines.</li>
+ <li>As add-ons can only run clean up code if they are uninstalled while Firefox is running and they are enabled, we do not require that they attempt to clean up after themselves when they are uninstalled under other circumstances. Application installers that configure Firefox without add-ons should revert any changes when uninstalled.</li>
+ <li>Add-ons may leave behind preferences changes in private preference branches which do not affect Firefox when the add-on is not active, so that any previous add-on configuration is not lost if the user decides to re-install the add-on in the future.</li>
+</ul>
+<p>Other exceptions may apply.</p>
+<h2 id="Aplicação">Aplicação</h2>
+<p>Add-ons that do not follow these guidelines may qualify for blocklisting, depending on the extent of the violations. Guidelines qualified with the word
+ <i>
+  must</i>
+ are especially important, and violations thereof will most likely result in a blocklisting nomination.</p>
+<p>The Add-ons Team will do their best to contact the add-on's developers and provide a reasonable time frame for the problems to be corrected before a block is put in place. If an add-on is considered malicious or its developers have proven unreachable or unresponsive, or in case of repeat violations, blocklisting may be immediate.</p>
+<p>Guideline violations should be <a class="external text" href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Tech%20Evangelism&amp;component=Add-ons" rel="nofollow">reported via Bugzilla</a>, under Tech Evangelism &gt; Add-ons. Questions can be posted in the <a class="external text" href="irc://irc.mozilla.org/addons" rel="nofollow">#addons IRC channel</a>.</p>
+<p>These guidelines may change in the future. All updates will be announced in the <a class="external text" href="https://blog.mozilla.org/addons/" rel="nofollow">Add-ons Blog</a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/overlay_extensions/index.html b/files/pt-br/mozilla/add-ons/overlay_extensions/index.html
new file mode 100644
index 0000000000..6b6ac40112
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/overlay_extensions/index.html
@@ -0,0 +1,71 @@
+---
+title: Overlay extensions
+slug: Mozilla/Add-ons/Overlay_Extensions
+tags:
+  - Add-ons
+  - Extensions
+  - Landing
+  - NeedsTranslation
+  - TopicStub
+translation_of: Archive/Add-ons/Overlay_Extensions
+---
+<p>This page contains links to documentation for the approach to developing extensions for Gecko-based applications which uses:</p>
+<ul>
+ <li>XUL overlays to specify the interface</li>
+ <li>APIs available to privileged code such as <a href="/en-US/docs/XUL/tabbrowser"><code>tabbrowser</code></a> and <a href="/en-US/docs/Mozilla/JavaScript_code_modules">JavaScript modules</a> to interact with the application and content.</li>
+</ul>
+<p>Before Gecko 2.0 was released this was the only way to develop extensions. Now there are two alternative techniques: <a href="/en-US/docs/Extensions/Bootstrapped_extensions">restartless extensions</a> and <a href="https://addons.mozilla.org/en-US/developers/docs/sdk/latest/">Add-on SDK-based extensions</a>. The privileged JavaScript APIs described here can still be used by the newer techniques.</p>
+<h2 id="XUL_School">XUL School</h2>
+<p><a href="/en-US/Add-ons/Overlay_Extensions/XUL_School">XUL School</a> is a comprehensive add-on development tutorial, focusing on Firefox extension development but mostly applicable to other Gecko-based applications.</p>
+<h2 id="More_resources">More resources</h2>
+<div class="column-container">
+ <div class="column-half">
+  <dl>
+   <dt>
+    <a href="/en-US/Mozilla/Add-ons/Setting_up_extension_development_environment">Setting up your environment</a></dt>
+   <dd>
+    Setting up the application for extension development.</dd>
+   <dt>
+    <a href="/en-US/docs/XUL">XUL</a></dt>
+   <dd>
+    Tutorials and reference for the user interface language used by XUL extensions.</dd>
+   <dt>
+    <a href="/en-US/Mozilla/Add-ons/Code_snippets">Code snippets</a></dt>
+   <dd>
+    Sample code for many of the things you'll want to do.</dd>
+   <dt>
+    <a href="/en-US/Mozilla/Add-ons/Installing_extensions">Installing extensions</a></dt>
+   <dd>
+    How to install an extension by copying the extension files into the application's install directory.</dd>
+   <dt>
+    <a href="/en-US/Add-ons/Overlay_extensions/Firefox_addons_developer_guide">Firefox add-ons developer guide</a></dt>
+   <dd>
+    A guide to developing overlay extensions.</dd>
+  </dl>
+ </div>
+ <div class="column-half">
+  <dl>
+   <dt>
+    <a href="/en-US/docs/Mozilla/JavaScript_code_modules">JavaScript code modules</a></dt>
+   <dd>
+    JavaScript modules available to extension developers.</dd>
+   <dt>
+    <a href="/en-US/Mozilla/Add-ons/Inline_Options">Extension preferences</a></dt>
+   <dd>
+    How to specify the preferences for your extension that will appear in the Add-ons Manager.</dd>
+   <dt>
+    <a href="/en-US/Mozilla/Add-ons/Extension_Frequently_Asked_Questions">Frequently Asked Questions</a></dt>
+   <dd>
+    Common issues with extension development.</dd>
+   <dt>
+    <a href="/en-US/Mozilla/Add-ons/Extension_Packaging">Extension packaging</a></dt>
+   <dd>
+    How extensions are packaged and installed.</dd>
+   <dt>
+    <a href="/en-US/Mozilla/Add-ons/Creating_Custom_Firefox_Extensions_with_the_Mozilla_Build_System">Binary Firefox extensions</a></dt>
+   <dd>
+    Creating binary extensions for Firefox.</dd>
+  </dl>
+ </div>
+</div>
+<p> </p>
diff --git a/files/pt-br/mozilla/add-ons/repositorio_add-on/index.html b/files/pt-br/mozilla/add-ons/repositorio_add-on/index.html
new file mode 100644
index 0000000000..cb3210e93a
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/repositorio_add-on/index.html
@@ -0,0 +1,155 @@
+---
+title: Repositório Add-on
+slug: Mozilla/Add-ons/Repositorio_Add-on
+translation_of: Mozilla/JavaScript_code_modules/Add-on_Repository
+---
+<p>{{ gecko_minversion_header("2") }}{{LegacyAddonsNotice}}</p>
+
+<p>The Add-on Repository is responsible for finding available add-ons; it provides an interface for interacting with the <a class="external" href="http://addons.mozilla.org" title="http://addons.mozilla.org/">addons.mozilla.org</a> (AMO) site. Its API provides URLs that can be visited to browse the repository's add-ons. The API also offers two ways to search for and retrieve an array of <a href="/pt-BR/docs/Mozilla/Add-ons/Add-on_Manager/Addon">Addon</a> instances: {{ manch("retrieveRecommendedAddons") }}, which returns a list of recommended add-ons, and {{ manch("searchAddons") }}, which performs a search of the repository.</p>
+
+<p>These searches are asynchronous; results are passed to the provided <code><a href="/en/Addons/Add-on_Repository/SearchCallback" title="en/Addons/Add-on Repository/SearchCallback">SearchCallback</a></code> object when the search is completed. Results passed to the <code><a href="/en/Addons/Add-on_Repository/SearchCallback" title="en/Addons/Add-on Repository/SearchCallback">SearchCallback</a></code> object only include add-ons that are compatible with the current application and are not already installed or in the process of being installed. <code>AddonRepository</code> can only process one search at a time. A new search will immediately fail if the <code>AddonRepository</code> is already handling another search request.</p>
+
+<p>To import the Add-on Repository code module, use:</p>
+
+<pre>Components.utils.import("resource://gre/modules/AddonRepository.jsm");
+</pre>
+
+<h2 id="Method_overview">Method overview</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><code>string <a href="#getRecommendedURL()">getRecommendedURL</a>()</code></td>
+  </tr>
+  <tr>
+   <td><code>string <a href="#getSearchURL()">getSearchURL</a>(in string searchTerms)</code></td>
+  </tr>
+  <tr>
+   <td><code>void <a href="#cancelSearch()">cancelSearch</a>()</code></td>
+  </tr>
+  <tr>
+   <td><code>void <a href="#retrieveRecommendedAddons()">retrieveRecommendedAddons</a>(in integer maxResults, in <a href="/en/Addons/Add-on_Repository/SearchCallback" title="en/Addons/Add-on Repository/SearchCallback">SearchCallback</a> callback)</code></td>
+  </tr>
+  <tr>
+   <td><code>void <a href="#searchAddons()">searchAddons</a>(in string searchTerms, in integer maxResults, in <a href="/en/Addons/Add-on_Repository/SearchCallback" title="en/Addons/Add-on Repository/SearchCallback">SearchCallback</a> callback)</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Properties">Properties</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Property</td>
+   <td class="header">Type</td>
+   <td class="header">Description</td>
+  </tr>
+  <tr>
+   <td><code>homepageURL</code></td>
+   <td><code>string</code></td>
+   <td>The URL of the repository site's home page.</td>
+  </tr>
+  <tr>
+   <td><code>isSearching</code></td>
+   <td><code>boolean</code></td>
+   <td><code>true</code> if a search is currently in progress; otherwise <code>false</code>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Methods">Methods</h2>
+
+<h3 id="getRecommendedURL()">getRecommendedURL()</h3>
+
+<p>Returns the URL that can be visited to see recommended add-ons.</p>
+
+<pre>string getRecommendedURL();</pre>
+
+<h6 id="Parameters">Parameters</h6>
+
+<p>None.</p>
+
+<h6 id="Return_value">Return value</h6>
+
+<p>An URL indicating the repository's page of recommended add-ons.</p>
+
+<h3 id="getSearchURL()">getSearchURL()</h3>
+
+<p>Returns an URL of a web page that can be visited to see search results for the specified search terms.</p>
+
+<pre>string getSearchURL(
+  in string searchTerms
+);</pre>
+
+<h6 id="Parameters_2">Parameters</h6>
+
+<dl>
+ <dt><code>searchTerms</code></dt>
+ <dd>Search terms used to search the repository.</dd>
+</dl>
+
+<h6 id="Return_value_2">Return value</h6>
+
+<p>The URL of the search results page for the specified search terms.</p>
+
+<h3 id="cancelSearch()">cancelSearch()</h3>
+
+<p>Cancels the search in progress. Does nothing if there is no search in progress.</p>
+
+<pre>void cancelSearch();</pre>
+
+<h6 id="Parameters_3">Parameters</h6>
+
+<p>None.</p>
+
+<h3 id="retrieveRecommendedAddons()">retrieveRecommendedAddons()</h3>
+
+<p>Begins a search for recommended add-ons in the repository. The list of recommended add-ons frequently changes. Results will be passed to the given <code><a href="/en/Addons/Add-on_Repository/SearchCallback" title="en/Addons/Add-on Repository/SearchCallback">SearchCallback</a></code> callback.</p>
+
+<pre>void retrieveRecommendedAddons(
+  in integer maxResults,
+  in SearchCallback callback
+);</pre>
+
+<h6 id="Parameters_4">Parameters</h6>
+
+<dl>
+</dl>
+
+<dl>
+ <dt><code>maxResults</code></dt>
+ <dd>The maximum number of results to return.</dd>
+ <dt><code>callback</code></dt>
+ <dd>The <code><a href="/en/Addons/Add-on_Repository/SearchCallback" title="en/Addons/Add-on Repository/SearchCallback">SearchCallback</a></code> callback to which results will be delivered.</dd>
+</dl>
+
+<h3 id="searchAddons()">searchAddons()</h3>
+
+<p>Begins a search for add-ons in this repository. Results will be passed to the given callback.</p>
+
+<pre>string searchAddons(
+  in string searchTerms,
+  in integer maxResults,
+  in SearchCallback callback
+);</pre>
+
+<h6 id="Parameters_5">Parameters</h6>
+
+<dl>
+</dl>
+
+<dl>
+ <dt><code>searchTerms</code></dt>
+ <dd>The search terms to pass to AMO. The results will match what you would get if you typed this string in the search box on the AMO web site.</dd>
+ <dt><code>maxResults</code></dt>
+ <dd>The maximum number of results to return.</dd>
+ <dt><code>callback</code></dt>
+ <dd>The <code><a href="/en/Addons/Add-on_Repository/SearchCallback" title="en/Addons/Add-on Repository/SearchCallback">SearchCallback</a></code> callback to pass results to.</dd>
+</dl>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en/Addons/Interfacing_with_the_Add-on_Repository" title="en/Addons/Interfacing with the Add-on Repository">Interfacing with the Add-on Repository</a></li>
+</ul>
diff --git a/files/pt-br/mozilla/add-ons/sdk/guides/index.html b/files/pt-br/mozilla/add-ons/sdk/guides/index.html
new file mode 100644
index 0000000000..1f7e439322
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/guides/index.html
@@ -0,0 +1,367 @@
+---
+title: Guides
+slug: Mozilla/Add-ons/SDK/Guides
+tags:
+  - Add-on SDK
+  - NeedsTranslation
+  - TopicStub
+translation_of: Archive/Add-ons/Add-on_SDK/Guides
+---
+<p> </p>
+
+<div class="warning">
+<p>Support for extensions using XUL/XPCOM or the Add-on SDK was removed in Firefox 57, released November 2017. As there is no supported version of Firefox enabling these technologies, this page will be removed by December 2020.</p>
+
+<p>Add-ons using the techniques described in this document are considered a legacy technology in Firefox. Don't use these techniques to develop new add-ons. Use <a href="/en-US/Add-ons/WebExtensions">WebExtensions</a> instead. If you maintain an add-on which uses the techniques described here, consider migrating it to use WebExtensions.</p>
+
+<p><strong>Starting from <a href="https://wiki.mozilla.org/RapidRelease/Calendar">Firefox 53</a>, no new legacy add-ons will be accepted on addons.mozilla.org (AMO) for desktop Firefox and Firefox for Android.</strong></p>
+
+<p><strong>Starting from <a href="https://wiki.mozilla.org/RapidRelease/Calendar">Firefox 57</a>, only extensions developed using WebExtensions APIs will be supported on Desktop Firefox and Firefox for Android. </strong></p>
+
+<p>Even before Firefox 57, changes coming up in the Firefox platform will break many legacy extensions. These changes include multiprocess Firefox (e10s), sandboxing, and multiple content processes. Legacy extensions that are affected by these changes should migrate to use WebExtensions APIs if they can. See the <a href="https://blog.mozilla.org/addons/2017/02/16/the-road-to-firefox-57-compatibility-milestones/">"Compatibility Milestones" document</a> for more information.</p>
+
+<p>A wiki page containing <a href="https://wiki.mozilla.org/Add-ons/developer/communication">resources, migration paths, office hours, and more</a>, is available to help developers transition to the new technologies.</p>
+</div>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions"><strong>Browser extensions</strong></a></li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions#Getting_started">Getting started</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/What_are_WebExtensions">What are extensions?</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension">Your first extension</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_second_WebExtension">Your second extension</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">Anatomy of an extension</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Examples">Example extensions</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/What_next_">What next?</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions#Concepts">Concepts</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Using_the_JavaScript_APIs">Using the JavaScript APIs</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_scripts">Content scripts</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Match_patterns">Match patterns</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Working_with_files">Working with files</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Internationalization">Internationalization</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Security_best_practices">Security best practices</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_Security_Policy">Content Security Policy</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Native_messaging">Native messaging</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions#User_Interface">User interface</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface">User Interface</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Browser_action">Toolbar button</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Page_actions">Address bar button</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Sidebars">Sidebars</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Context_menu_items">Context menu items</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Options_pages">Options page</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Extension_pages">Extension pages</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Notifications">Notifications</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Omnibox">Address bar suggestions</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/devtools_panels">Developer tools panels</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions#How_to">How to</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Intercept_HTTP_requests">Intercept HTTP requests</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Modify_a_web_page">Modify a web page</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Safely_inserting_external_content_into_a_page">Insert external content</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Add_a_button_to_the_toolbar">Add a button to the toolbar</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Implement_a_settings_page">Implement a settings page</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Working_with_the_Tabs_API">Work with the Tabs API</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Work_with_the_Bookmarks_API">Work with the Bookmarks API</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Work_with_the_Cookies_API">Work with the Cookies API</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Work_with_contextual_identities">Work with contextual identities</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions#Porting">Porting</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension">Porting a Google Chrome extension</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Porting_a_legacy_Firefox_add-on">Porting a legacy Firefox extension</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Embedded_WebExtensions">Embedded WebExtensions</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Comparison_with_the_Add-on_SDK">Comparison with the Add-on SDK</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Comparison_with_XUL_XPCOM_extensions">Comparison with XUL/XPCOM extensions</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Chrome_incompatibilities">Chrome incompatibilities</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Differences_between_desktop_and_Android">Differences between desktop and Android</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions#Firefox_workflow">Firefox workflow</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/User_experience_best_practices">User Experience</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">Temporary Installation in Firefox</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Debugging">Debugging</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Testing_persistent_and_restart_features">Testing persistent and restart features</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Developing_WebExtensions_for_Firefox_for_Android">Developing for Firefox for Android</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Getting_started_with_web-ext">Getting started with web-ext</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/web-ext_command_reference">web-ext command reference</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/WebExtensions_and_the_Add-on_ID">Extensions and the Add-on ID</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Request_the_right_permissions">Request the right permissions</a></li>
+  </ol>
+ </li>
+ <li data-default-state="closed"><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API">JavaScript APIs</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs">Browser support for JavaScript APIs</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/alarms">alarms</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/bookmarks">bookmarks</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">browserAction</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserSettings">browserSettings</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browsingData">browsingData</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/clipboard">clipboard</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/commands">commands</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/contentScripts">contentScripts</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/contextualIdentities">contextualIdentities</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/cookies">cookies</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow">devtools.inspectedWindow</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/devtools.network">devtools.network</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/devtools.panels">devtools.panels</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/dns">dns</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/downloads">downloads</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/events">events</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/extension">extension</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/extensionTypes">extensionTypes</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/find">find</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/history">history</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/i18n">i18n</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/identity">identity</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/idle">idle</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/management">management</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/menus">menus</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/notifications">notifications</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/omnibox">omnibox</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/pageAction">pageAction</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/permissions">permissions</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/pkcs11">pkcs11</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/privacy">privacy</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/proxy">proxy</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/runtime">runtime</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/search">search</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/sessions">sessions</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/sidebarAction">sidebarAction</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/storage">storage</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs">tabs</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/theme">theme</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/topSites">topSites</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/types">types</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/webNavigation">webNavigation</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/webRequest">webRequest</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/windows">windows</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json">Manifest keys</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications">applications</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/author">author</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/background">background</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/chrome_settings_overrides">chrome_settings_overrides</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/chrome_url_overrides">chrome_url_overrides</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/commands">commands</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/content_scripts">content_scripts</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/content_security_policy">content_security_policy</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/default_locale">default_locale</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/description">description</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/developer">developer</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/devtools_page">devtools_page</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/homepage_url">homepage_url</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/icons">icons</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/incognito">incognito</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/manifest_version">manifest_version</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/name">name</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/omnibox">omnibox</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/optional_permissions">optional_permissions</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/options_ui">options_ui</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/page_action">page_action</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissions</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/protocol_handlers">protocol_handlers</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/short_name">short_name</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/sidebar_action">sidebar_action</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/theme">theme</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/version">version</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/version_name">version_name</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources">web_accessible_resources</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/Themes"><strong>Themes</strong></a></li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/Themes/Theme_concepts">Browser themes</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/Themes/Theme_concepts">Browser theme concepts</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/Themes/Lightweight_themes">Lightweight themes</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/Themes/Lightweight_themes">Lightweight themes</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/Themes/Lightweight_Themes/FAQ">Lightweight themes FAQ</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/Distribution"><strong>Publishing and Distribution</strong></a></li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/Distribution">Publishing add-ons</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/Distribution">Signing and distribution overview</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Package_your_extension_">Package your extension</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/Distribution/Submitting_an_add-on">Submit an add-on</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/Source_Code_Submission">Source code submission</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/Distribution/Resources_for_publishers">Resources for publishers</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/Listing">Creating an appealing listing</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/AMO/Policy/Reviews">Review policies</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/AMO/Policy/Agreement">Developer agreement</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/AMO/Policy/Featured">Featured add-ons</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/Distribution/Retiring_your_extension">Retiring your extension</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Alternative_distribution_options">Distributing add-ons</a>
+  <ol>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Alternative_distribution_options/Sideloading_add-ons">For sideloading</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Alternative_distribution_options/Add-ons_for_desktop_apps">For desktop apps</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Alternative_distribution_options/Add-ons_in_the_enterprise">For an enterprise</a></li>
+  </ol>
+ </li>
+ <li><a href="https://discourse.mozilla.org/c/add-ons"><strong>Community and Support</strong></a></li>
+ <li><a href="#">Channels</a>
+  <ol>
+   <li><a href="https://blog.mozilla.org/addons">Add-ons blog</a></li>
+   <li><a href="https://discourse.mozilla.org/c/add-ons">Add-on forums</a></li>
+   <li><a href="http://stackoverflow.com/questions/tagged/firefox-addon">Stack Overflow</a></li>
+   <li><a href="/en-US/docs/Mozilla/Add-ons/#Contact_us">Contact us</a></li>
+  </ol>
+ </li>
+</ol>
+</section>
+
+<p> </p>
+
+<p>This page lists more theoretical in-depth articles about the SDK.</p>
+
+<hr>
+<h3 id="Contributor's_guide"><a name="contributors-guide">Contributor's guide</a></h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="Guides/Getting_Started">Getting Started</a></dt>
+ <dd>Learn how to contribute to the SDK: getting the code, opening/taking a bug, filing a patch, getting reviews, and getting help.</dd>
+ <dt><a href="Guides/Modules">Modules</a></dt>
+ <dd>Learn about the module system used by the SDK (which is based on the CommonJS specification), how sandboxes and compartments can be used to improve security, and about the built-in SDK module loader, known as Cuddlefish.</dd>
+ <dt><a href="Guides/Classes_and_Inheritance">Classes and Inheritance</a></dt>
+ <dd>Learn how classes and inheritance can be implemented in JavaScript, using constructors and prototypes, and about the helper functions provided by the SDK to simplify this.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="Guides/Private_Properties">Private Properties</a></dt>
+ <dd>Learn how private properties can be implemented in JavaScript using prefixes, closures, and WeakMaps, and how the SDK supports private properties by using namespaces (which are a generalization of WeakMaps).</dd>
+ <dt><a href="Guides/Content_Processes">Content Processes</a></dt>
+ <dd>The SDK was designed to work in an environment where the code to manipulate web content runs in a different process from the main add-on code. This article highlights the main features of that design.</dd>
+ <dt><a href="Guides/Testing_the_Add-on_SDK">Testing the Add-on SDK</a></dt>
+ <dd>Learn how to run the Add-on SDK test suites.</dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h3 id="SDK_infrastructure"><a name="sdk-infrastructure">SDK infrastructure</a></h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="Guides/Module_structure_of_the_SDK">Module structure of the SDK</a></dt>
+ <dd>The SDK, and add-ons built using it, are of composed from reusable JavaScript modules. This explains what these modules are, how to load modules, and how the SDK's module tree is structured.</dd>
+ <dt><a href="Guides/SDK_API_Lifecycle">SDK API lifecycle</a></dt>
+ <dd>Definition of the lifecycle for the SDK's APIs, including the stability ratings for APIs.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="Guides/Program_ID">Program ID</a></dt>
+ <dd>The Program ID is a unique identifier for your add-on. This guide explains how it's created, what it's used for and how to define your own.</dd>
+ <dt><a href="Guides/Firefox_Compatibility">Firefox compatibility</a></dt>
+ <dd>Working out which Firefox releases a given SDK release is compatible with, and dealing with compatibility problems.</dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h3 id="SDK_idioms"><a name="sdk-idioms">SDK idioms</a></h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="Guides/Working_with_Events">Working With Events</a></dt>
+ <dd>Write event-driven code using the the SDK's event emitting framework.</dd>
+ <dt><a href="Guides/Content_Scripts">Content scripts guide</a></dt>
+ <dd>An overview of content scripts, including: what they are, what they can do, how to load them, how to communicate with them.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="Guides/Two_Types_of_Scripts">Two Types of Scripts</a></dt>
+ <dd>This article explains the differences between the APIs available to your main add-on code and those available to content scripts.</dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h3 id="XUL_migration"><a name="xul-migration">XUL migration</a></h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="Guides/XUL_Migration_Guide">XUL Migration Guide</a></dt>
+ <dd>Techniques to help port a XUL add-on to the SDK.</dd>
+ <dt><a href="Guides/XUL_vs_SDK">XUL versus the SDK</a></dt>
+ <dd>A comparison of the strengths and weaknesses of the SDK, compared to traditional XUL-based add-ons.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="Guides/Porting_the_Library_Detector">Porting Example</a></dt>
+ <dd>A walkthrough of porting a relatively simple XUL-based add-on to the SDK.</dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h3 id="Multiprocess_Firefox"><a name="multiprocess-firefox">Multiprocess Firefox</a></h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="Guides/Multiprocess_Firefox_and_the_SDK">Multiprocess Firefox and the SDK</a></dt>
+ <dd>How to check whether your add-on is compatible with multiprocess Firefox, and fix it if it isn't.</dd>
+</dl>
+</div>
+
+<div class="column-half"> </div>
+</div>
+
+<hr>
+<div>
+<div class="overheadIndicator communitybox" dir="ltr">
+<div class="column-container">
+<h2 id="Join_the_Add-on_SDK_community">Join the Add-on SDK community</h2>
+
+<div class="column-half">
+<div class="communitysubhead">Choose your preferred method for joining the discussion:</div>
+
+<ul class="communitymailinglist">
+ <li><a href="https://lists.mozilla.org/listinfo/">Mailing list</a></li>
+ <li><a href="https://twitter.com/mozillajetpack">Twitter</a></li>
+ <li><a href="http://stackoverflow.com/questions/tagged/firefox-addon-sdk">Stack Overflow</a></li>
+ <li><a href="http://groups.google.com/group/mozilla-labs-jetpack">Newsgroup</a></li>
+ <li><a href="http://groups.google.com/group/mozilla-labs-jetpack/feeds">RSS feed</a></li>
+</ul>
+</div>
+
+<div class="column-half">
+<ul class="communitycontact">
+ <li><strong>IRC: </strong><a href="irc://irc.mozilla.org/jetpack">#jetpack</a> <span class="smaller">(<a href="https://wiki.mozilla.org/IRC">learn more</a>)</span></li>
+ <li><strong>Team info: </strong><a href="https://wiki.mozilla.org/Jetpack" title="Designs and plans for the SDK tools">Jetpack Wiki</a></li>
+</ul>
+</div>
+</div>
+</div>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/sdk/guides/working_with_events/index.html b/files/pt-br/mozilla/add-ons/sdk/guides/working_with_events/index.html
new file mode 100644
index 0000000000..9c51d1328f
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/guides/working_with_events/index.html
@@ -0,0 +1,154 @@
+---
+title: Trabalhando com Eventos
+slug: Mozilla/Add-ons/SDK/Guides/Working_with_Events
+translation_of: Archive/Add-ons/Add-on_SDK/Guides/Working_with_Events
+---
+<p>O Add-on SDK suporta programação dirigida a evento.</p>
+
+<p>Objetos emitem eventos sobre mudança de estados que devem ser interessantes ao código do add-on, tais como abertura de janelas, carregamento de páginas, requisições de rede completas, e cliques de mouse. Pelo registro de uma função de escuta para um emissor de evento um add-on pode receber notificações destes eventos.</p>
+
+<p><span>Nós falamos sobre scripts de conteúdo em mais detalhes no guia <a href="/en-US/Add-ons/SDK/Guides/Content_Scripts">Working with Content Scripts</a>.</span></p>
+
+<p>Adicionalmente, se você está usando scripts de conteúdo para interagir com o conteúdo web, você pode definir seus próprios eventos e usá-los para comunicar entre o código principal do add-on e os scripts de conteúdo. <span id="result_box" lang="pt"><span class="hps">Neste caso,</span> <span class="hps">uma extremidade</span> <span class="hps">da conversa</span> <span class="hps">emite</span> <span class="hps">os</span> <span class="hps">eventos</span><span>,</span> <span class="hps">e</span> <span class="hps">a outra extremidade</span> <span class="hps">ouve</span></span>.</p>
+
+<p>Portanto, há dois modos principais que você interagirá com o framework emissor de eventos:</p>
+
+<ul>
+ <li>
+  <p><strong>escutando eventos embutidos</strong> emitidos pelos objetos no SDK, tais como abertura de tab, carregamento de páginas, cliques de mouse</p>
+ </li>
+ <li>
+  <p><strong>enviando e recebendo eventos definidos pelos usuários</strong> entre scripts de conteúdo e o código do add-on</p>
+ </li>
+</ul>
+
+<p>Este guia cobre somente o primeiro destes; o segundo é explicado no guia <a href="/en-US/Add-ons/SDK/Guides/Content_Scripts">Working with Content Scripts</a>.</p>
+
+<h2 id="Adicionando_Escutadores">Adicionando Escutadores</h2>
+
+<p>Você pode adicionar um escutador para um emissor de evento pela chamada ao seu método<code> on(type, listener)</code>.</p>
+
+<p>Ele leva dois parâmetros:</p>
+
+<ul>
+ <li>
+  <p><strong><code>type</code></strong>: o tipo de evento que nós estamos interessado, identificado por uma string. Muitos emissores de evento devem emitir mais do que um tipo de evento: por exemplo, a janela do navegador deve emitir ambos os eventos <code>open</code> e <code>close</code>. A lista de tipos de eventos válidos é específica a cada emissor de evento e é incluída em sua documentação.</p>
+ </li>
+ <li>
+  <p><strong><code>listener</code></strong>: o escutador em si. Esta é uma função que será chamada sempre que o evento ocorrer. O argumento que será passado para o escutador é específico a um tipo de evento e é documentado com o emissor de evento.</p>
+ </li>
+</ul>
+
+<p>Por exemplo, o seguinte add-on registra uma escuta com o módulo <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs"><code>tabs</code></a> para esperar pelo evento <code>ready</code>, e registra uma string no console reportando o evento:</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+
+tabs.on("ready", function () {
+  console.log("tab loaded");
+});
+</pre>
+
+<p>Não é possível enumerar o conjunto de escutas para um dado evento.</p>
+
+<p>O valor de <code>this</code> na função de escuta é o objeto que emitiu o evento.</p>
+
+<h3 id="Escutando_Todos_os_Eventos">Escutando Todos os Eventos</h3>
+
+<p>Você pode passar o curinga "*" como o argumento <code>type</code>. Se você fizer isso, a escuta será chamada para qualquer evento emitido por qualquer objeto, e seu argumento será o nome do evento:</p>
+
+<pre class="brush: js">var ui = require("sdk/ui");
+var panels = require("sdk/panel");
+var self = require("sdk/self");
+
+var panel = panels.Panel({
+  contentURL: self.data.url("panel.html")
+});
+
+panel.on("*", function(e) {
+  console.log("event " + e + " was emitted");
+});
+
+var button = ui.ActionButton({
+  id: "my-button",
+  label: "my button",
+  icon: "./icon-16.png",
+  onClick: handleClick
+});
+
+function handleClick(state) {
+  panel.show({
+    position: button
+  });
+}</pre>
+
+<p>Esta característica do curinga não funciona ainda nos módulos<a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs"><code> tabs</code></a> ou <a href="/en-US/Add-ons/SDK/High-Level_APIs/windows"><code>window</code></a>.</p>
+
+<h3 id="Adicionando_escutas_em_construtores">Adicionando escutas em construtores</h3>
+
+<p>Emissores de evento podem ser módulos como no caso do evento <code>ready</code> acima, ou eles podem ser objetos retornados pelos construtores.</p>
+
+<p>No último caso o objeto <code>options</code> passado para o construtor tipicamente define propriedades cujos nomes são nomes de tipos de eventos suportados prefixados com "on": por exemplo, "onOpen", "onReady" e assim por diante. Então o construtor pode atribuir uma função de escuta para aquela propriedade como uma alternativa a chamada do método do objeto <code>on()</code>.</p>
+
+<p>Por exemplo: o objeto <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action"><code>ActionButton</code></a> emite um evento quando o botão é clicado.</p>
+
+<p>O add-on a seguir cria um botão e atribui uma escuta para a propriedade <code>onClick</code> do objeto fornecida no <code>options</code> do construtor do objeto botão. A escuta carrega https://developer.mozilla.org/:</p>
+
+<pre class="brush: js">require("sdk/ui/button/action").ActionButton({
+  id: "visit-mozilla",
+  label: "Visit Mozilla",
+  icon: "./icon-16.png",
+  onClick: function() {
+    require("sdk/tabs").open("https://developer.mozilla.org/");
+  }
+});
+</pre>
+
+<p>Isto é exatamente equivalente a construir o botão e então chamar o método <code>on()</code> do botão</p>
+
+<pre class="brush: js">var button = require("sdk/ui/button/action").ActionButton({
+  id: "visit-mozilla",
+  label: "Visit Mozilla",
+  icon: "./icon-16.png"
+});
+
+button.on("click", function() {
+  require("sdk/tabs").open("https://developer.mozilla.org/");
+});
+</pre>
+
+<h2 id="Removendo_Escutas_de_Evento">Removendo Escutas de Evento</h2>
+
+<p>Escutas de evento pode ser removidos pela chamada de <code>removeListener(type, listener)</code>, fornecendo o tipo do evento e escuta a remover.</p>
+
+<p>A escuta deve ter sido previamente adicionada usando um dos métodos descritos acima.</p>
+
+<p>No add-on a seguir, nós adicionamos duas escutas para o <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/tabs#ready">evento <code>ready</code> do módulo<code> tab</code></a>. Uma das funções de manipulação remove a escuta.</p>
+
+<p>Então nós abrimos duas abas.</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+
+function listener1() {
+  console.log("Listener 1");
+  tabs.removeListener("ready", listener1);
+}
+
+function listener2() {
+  console.log("Listener 2");
+}
+
+tabs.on("ready", listener1);
+tabs.on("ready", listener2);
+
+tabs.open("https://www.mozilla.org");
+tabs.open("https://www.mozilla.org");
+</pre>
+
+<p>Nós devemos ver a saída como esta:</p>
+
+<pre>info: tabevents: Listener 1
+info: tabevents: Listener 2
+info: tabevents: Listener 2
+</pre>
+
+<p>As escutas serão removidas automaticamente quando o add-on for descarregado.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/high-level_apis/index.html b/files/pt-br/mozilla/add-ons/sdk/high-level_apis/index.html
new file mode 100644
index 0000000000..2537723562
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/high-level_apis/index.html
@@ -0,0 +1,11 @@
+---
+title: High-Level APIs
+slug: Mozilla/Add-ons/SDK/High-Level_APIs
+tags:
+  - Add-on SDK
+  - NeedsTranslation
+  - TopicStub
+translation_of: Archive/Add-ons/Add-on_SDK/High-Level_APIs
+---
+<p>Modules listed on this page implement high-level APIs for building add-ons: creating user interfaces, interacting with the web, and interacting with the browser.</p>
+<p>Unless the documentation explicitly says otherwise, all these modules are "Stable": we'll avoid making incompatible changes to them. {{ LandingPageListSubpages ("/en-US/Add-ons/SDK/High-Level_APIs", 5) }}</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/high-level_apis/request/index.html b/files/pt-br/mozilla/add-ons/sdk/high-level_apis/request/index.html
new file mode 100644
index 0000000000..01937e2036
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/high-level_apis/request/index.html
@@ -0,0 +1,214 @@
+---
+title: request
+slug: Mozilla/Add-ons/SDK/High-Level_APIs/request
+translation_of: Archive/Add-ons/Add-on_SDK/High-Level_APIs/request
+---
+<div class="note">
+<p>Stable</p>
+</div>
+
+<p><span class="seoSummary">Faça requesições simples de rede. Para uso mais avançado, cheque os módulos</span> <a href="/en-US/Add-ons/SDK/Low-Level_APIs/net_xhr">net/xhr</a>, baseado no objeto <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a> do navegador.</p>
+
+<h2 id="Globals">Globals</h2>
+
+<h3 id="Constructors">Constructors</h3>
+
+<h4 class="addon-sdk-api-name" id="Request(options)"><code>Request(options)</code></h4>
+
+<p>Este construtor cria um objeto request que pode ser usado para fazer requisições de rede. O construtor leva um único parâmetro <code>options</code> que é usado para configurar várias propriedades no resultado do <code>Request</code>.</p>
+
+<h5 id="Parâmetros">Parâmetros</h5>
+
+<p><strong>options : object</strong><br>
+ Opções opcionais:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>url</td>
+   <td>string,url</td>
+   <td>
+    <p>This is the url to which the request will be made. Can either be a <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/String">String</a> or an instance of the SDK's <a href="/en-US/Add-ons/SDK/High-Level_APIs/url">URL</a>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onComplete</td>
+   <td>function</td>
+   <td>
+    <p>This function will be called when the request has received a response (or in terms of XHR, when <code>readyState == 4</code>). The function is passed a <code>Response</code> object.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>headers</td>
+   <td>object</td>
+   <td>
+    <p>An unordered collection of name/value pairs representing headers to send with the request.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>content</td>
+   <td>string,object</td>
+   <td>
+    <p>The content to send to the server. If <code>content</code> is a string, it should be URL-encoded (use <code>encodeURIComponent</code>). If <code>content</code> is an object, it should be a collection of name/value pairs. Nested objects &amp; arrays should encode safely.</p>
+
+    <p>For <code>GET</code> <span style="line-height: 1.5;">and </span><code style="font-style: normal; line-height: 1.5;">HEAD</code><span style="line-height: 1.5;"> requests, the query string (</span><code style="font-style: normal; line-height: 1.5;">content</code><span style="line-height: 1.5;">) will be appended to the URL. For </span><code style="font-style: normal; line-height: 1.5;">POST</code><span style="line-height: 1.5;"> and </span><code style="font-style: normal; line-height: 1.5;">PUT</code><span style="line-height: 1.5;"> requests, it will be sent as the body of the request.</span></p>
+   </td>
+  </tr>
+  <tr>
+   <td>contentType</td>
+   <td>string</td>
+   <td>
+    <p>The type of content to send to the server. This explicitly sets the <code>Content-Type</code> header. The default value is <code>application/x-www-form-urlencoded</code>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>overrideMimeType</td>
+   <td>string</td>
+   <td>
+    <p>Use this string to override the MIME type returned by the server in the response's Content-Type header. You can use this to treat the content as a different MIME type, or to force text to be interpreted using a specific character.</p>
+
+    <p>For example, if you're retrieving text content which was encoded as ISO-8859-1 (Latin 1), it will be given a content type of "utf-8" and certain characters will not display correctly. To force the response to be interpreted as Latin-1, use <code>overrideMimeType</code>:</p>
+
+    <pre class="brush: js">
+var Request = require("sdk/request").Request;
+var quijote = Request({
+  url: "http://www.latin1files.org/quijote.txt",
+  overrideMimeType: "text/plain; charset=latin1",
+  onComplete: function (response) {
+    console.log(response.text);
+  }
+});
+
+quijote.get();</pre>
+   </td>
+  </tr>
+  <tr>
+   <td>anonymous</td>
+   <td>boolean</td>
+   <td>If <code>true</code>, the request will be sent without cookies or authentication headers. This option sets the <a href="/en/docs/Web/API/XMLHttpRequest#Non-standard_properties"><code>mozAnon</code></a> property in the underlying XMLHttpRequest object. Defaults to <code>false</code>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Request">Request</h2>
+
+<p>The <code>Request</code> object is used to make <code>GET</code>, <code style="font-style: normal; line-height: 1.5;"><code style="font-style: normal;">HEAD</code></code>, <code style="font-style: normal; line-height: 1.5;"><code style="font-style: normal;">POST</code></code><span style="line-height: 1.5;">, </span><code style="font-style: normal; line-height: 1.5;">PUT</code><span style="line-height: 1.5;">,</span><span style="line-height: 1.5;"> </span><span style="line-height: 1.5;">or </span><code style="font-style: normal; line-height: 1.5;">DELETE</code><span style="line-height: 1.5;"> network requests. It is constructed with a URL to which the request is sent. Optionally the user may specify a collection of headers and content to send alongside the request and a callback which will be executed once the request completes.</span></p>
+
+<p>Once a <code>Request</code> object has been created a <code>GET</code> request can be executed by calling its <code>get()</code> method, a <code>POST</code> request by calling its <code>post()</code> method, and so on.</p>
+
+<p>When the server completes the request, the <code>Request</code> object emits a "complete" event. Registered event listeners are passed a <code>Response</code> object.</p>
+
+<p>Each <code>Request</code> object is designed to be used once. Attempts to reuse them will throw an error.</p>
+
+<p>Since the request is not being made by any particular website, requests made here are not subject to the same-domain restriction that requests made in web pages are subject to.</p>
+
+<p>With the exception of <code>response</code>, all of a <code>Request</code> object's properties correspond with the options in the constructor. Each can be set by simply performing an assignment. However, keep in mind that the same validation rules that apply to <code>options</code> in the constructor will apply during assignment. Thus, each can throw if given an invalid value.</p>
+
+<p>The example below shows how to use Request to get the most recent tweet from the <a href="https://twitter.com/mozhacks">@mozhacks</a> account:</p>
+
+<pre class="brush: js">var Request = require("sdk/request").Request;
+var latestTweetRequest = Request({
+  url: "https://api.twitter.com/1/statuses/user_timeline.json?screen_name=mozhacks&amp;count=1",
+  onComplete: function (response) {
+    var tweet = response.json[0];
+    console.log("User: " + tweet.user.screen_name);
+    console.log("Tweet: " + tweet.text);
+  }
+});
+
+// Be a good consumer and check for rate limiting before doing more.
+Request({
+  url: "http://api.twitter.com/1/account/rate_limit_status.json",
+  onComplete: function (response) {
+    if (response.json.remaining_hits) {
+      latestTweetRequest.get();
+    } else {
+      console.log("You have been rate limited!");
+    }
+  }
+}).get();</pre>
+
+<h3 id="Methods">Methods</h3>
+
+<h4 class="addon-sdk-api-name" id="get()"><code>get()</code></h4>
+
+<p>Make a <code>GET</code> request.</p>
+
+<h4 class="addon-sdk-api-name" id="head()" style="line-height: 18px; font-size: 1.28571428571429rem;"><code>head()</code></h4>
+
+<p>Make a <code>HEAD</code> request.</p>
+
+<h4 class="addon-sdk-api-name" id="post()"><code>post()</code></h4>
+
+<p>Make a <code>POST</code> request.</p>
+
+<h4 class="addon-sdk-api-name" id="put()"><code>put()</code></h4>
+
+<p>Make a <code>PUT</code> request.</p>
+
+<h4 class="addon-sdk-api-name" id="delete()"><span style="font-family: courier new,andale mono,monospace; font-size: 1.28571428571429rem; font-style: inherit; font-weight: inherit;">delete()</span></h4>
+
+<p>Make a <code>DELETE</code> request.</p>
+
+<h3 id="Properties">Properties</h3>
+
+<h4 class="addon-sdk-api-name" id="url"><code>url</code></h4>
+
+<h4 class="addon-sdk-api-name" id="headers"><code>headers</code></h4>
+
+<h4 class="addon-sdk-api-name" id="content"><code>content</code></h4>
+
+<h4 class="addon-sdk-api-name" id="contentType"><code>contentType</code></h4>
+
+<h4 class="addon-sdk-api-name" id="response"><code>response</code></h4>
+
+<h3 id="Events">Events</h3>
+
+<h4 class="addon-sdk-api-name" id="complete"><code>complete</code></h4>
+
+<p>The <code>Request</code> object emits this event when the request has completed and a response has been received.</p>
+
+<h5 id="Arguments">Arguments</h5>
+
+<p><strong>Response</strong> : Listener functions are passed the response to the request as a <code>Response</code> object.</p>
+
+<h2 id="Response">Response</h2>
+
+<p>The Response object contains the response to a network request issued using a <code>Request</code> object. It is returned by the <code>get()</code>, <code style="font-style: normal; line-height: 1.5;">head()</code><span style="line-height: 1.5;">, </span><code style="font-style: normal; line-height: 1.5;">post()</code><span style="line-height: 1.5;">, </span><code style="font-style: normal; line-height: 1.5;">put()</code><span style="line-height: 1.5;"> </span><span style="line-height: 1.5;">or </span><code style="font-style: normal; line-height: 1.5;">delete()</code><span style="line-height: 1.5;"> method of a </span><code style="font-style: normal; line-height: 1.5;">Request</code><span style="line-height: 1.5;"> object.</span></p>
+
+<p>All members of a <code>Response</code> object are read-only.</p>
+
+<h3 id="Properties_2">Properties</h3>
+
+<h4 class="addon-sdk-api-name" id="text"><code>text</code></h4>
+
+<p>The content of the response as plain text.</p>
+
+<h4 class="addon-sdk-api-name" id="json"><code>json</code></h4>
+
+<p>The content of the response as a JavaScript object. The value will be <code>null</code> if the document cannot be processed by <code>JSON.parse</code>.</p>
+
+<h4 class="addon-sdk-api-name" id="status"><code>status</code></h4>
+
+<p>The HTTP response status code (e.g. <em>200</em>).</p>
+
+<h4 class="addon-sdk-api-name" id="statusText"><code>statusText</code></h4>
+
+<p>The HTTP response status line (e.g. <em>OK</em>).</p>
+
+<h4 class="addon-sdk-api-name" id="headers_2"><code>headers</code></h4>
+
+<p>The HTTP response headers represented as key/value pairs.</p>
+
+<p>To print all the headers you can do something like this:</p>
+
+<pre class="brush: js">for (var headerName in response.headers) {
+  console.log(headerName + " : " + response.headers[headerName]);
+}</pre>
diff --git a/files/pt-br/mozilla/add-ons/sdk/high-level_apis/tabs/index.html b/files/pt-br/mozilla/add-ons/sdk/high-level_apis/tabs/index.html
new file mode 100644
index 0000000000..22493dce1d
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/high-level_apis/tabs/index.html
@@ -0,0 +1,671 @@
+---
+title: tabs
+slug: Mozilla/Add-ons/SDK/High-Level_APIs/tabs
+tags:
+  - Guías
+  - Tab
+translation_of: Archive/Add-ons/Add-on_SDK/High-Level_APIs/tabs
+---
+<div class="note">
+<p>Stable</p>
+</div>
+
+<p><span class="seoSummary">Abre, manipula, e acessa tabs, e recebe eventos de tabs</span></p>
+
+<h2 id="Uso">Uso</h2>
+
+<h3 id="Abrir_uma_tab">Abrir uma tab</h3>
+
+<p>Você pode abrir uma nova tab, especificando várias propriedades incluindo localização:</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+tabs.open("http://www.Exemplo.com");</pre>
+
+<h3 id="Rastrear_tabs">Rastrear tabs</h3>
+
+<p>Você pode registrar eventos de escuta para ser notificado quando a tabs abre, fecha, termina o carregamento de conteúdo DOM, ou tornam-se ativa ou inativa:</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+
+// Listen for tab openings.
+tabs.on('open', function onOpen(tab) {
+  myOpenTabs.push(tab);
+});
+
+// Listen for tab content loads.
+tabs.on('ready', function(tab) {
+  console.log('tab is loaded', tab.title, tab.url);
+});</pre>
+
+<h3 id="Accessar_tabs">Accessar tabs</h3>
+
+<p>O módulo por ele mesmo pode ser usado como uma lista de todas as tabs abertas em todos os navegadores. Em particular, você pode enumerá-las:</p>
+
+<pre class="brush: js">var tabs = require('sdk/tabs');
+for (let tab of tabs)
+  console.log(tab.title);</pre>
+
+<p>Você também pode acessar tabs individual pelo índice:</p>
+
+<pre class="brush: js">var tabs = require('sdk/tabs');
+
+tabs.on('ready', function () {
+  console.log('first: ' + tabs[0].title);
+  console.log('last: ' + tabs[tabs.length-1].title);
+});</pre>
+
+<p>Você pode acessar a tab ativa atualmente:</p>
+
+<pre class="brush: js">var tabs = require('sdk/tabs');
+
+tabs.on('activate', function () {
+  console.log('active: ' + tabs.activeTab.url);
+});</pre>
+
+<h3 id="Rastrear_uma_única_tab">Rastrear uma única tab</h3>
+
+<p>Dada uma tab, você pode registrar escutas para eventos serem notificados quando a tab é fechada, ativada ou desativada, ou quando a página hospedad pela tab é carregada ou recuperada do <a href="https://developer.mozilla.org/en-US/docs/Working_with_BFCache">"back-forward cache"</a>:</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+
+function onOpen(tab) {
+  console.log(tab.url + " is open");
+  tab.on("pageshow", logShow);
+  tab.on("activate", logActivate);
+  tab.on("deactivate", logDeactivate);
+  tab.on("close", logClose);
+}
+
+function logShow(tab) {
+  console.log(tab.url + " is loaded");
+}
+
+function logActivate(tab) {
+  console.log(tab.url + " is activated");
+}
+
+function logDeactivate(tab) {
+  console.log(tab.url + " is deactivated");
+}
+
+function logClose(tab) {
+  console.log(tab.url + " is closed");
+}
+
+tabs.on('open', onOpen);</pre>
+
+<h3 id="Manipular_uma_tab">Manipular uma tab</h3>
+
+<p>Você pode conseguir e configurar várias propriedades de tabs (mas note que propriedades relacionadas ao conteúdo da tab, tal como URL, não conterão valores válidos até depois do evento <code>ready</code> disparar). Pela configuração da propriedade <code>url</code> você pode carregar uma nova página na tab:</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+tabs.on('activate', function(tab) {
+  tab.url = "http://www.Exemplo.com";
+});</pre>
+
+<h3 id="Execute_scripts_em_um_tab">Execute scripts em um tab</h3>
+
+<p>Você pode anexar um script de <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Content_Scripts">conteúdo a página</a> hospedad na tab, e usar aquele para acessar e manipular o conteúdo da página (veja o tutorial <a href="/en-US/Add-ons/SDK/Tutorials/Modifying_the_Page_Hosted_by_a_Tab">Modifying the Page Hosted by a Tab</a>):</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+
+tabs.on('activate', function(tab) {
+  var worker = tab.attach({
+    contentScript: 'self.port.emit("html", document.body.innerHTML);'
+  });
+  worker.port.on("html", function(message) {
+    console.log(message)
+  })
+});</pre>
+
+<p>Observe que <code>tab.attach</code> é centrado na tab: se o usuário navegar para uma nova página na mesma tab, então o trabalho e scripts de conteúdo serão reanexados á nova página.</p>
+
+<h3 id="Anexação_de_stylesheets">Anexação de stylesheets</h3>
+
+<div class="geckoVersionNote">
+<p>Novo no Firefox 34.</p>
+</div>
+
+<p>Você não pode anexar folhas de estilo para uma tab usando <code>tab.attach()</code>, mas do Firefox 34 em diante você pode anexar e desanexa-los usando APIs de baixo nível  <a href="/en-US/Add-ons/SDK/Low-Level_APIs/stylesheet_style">stylesheet/style</a> e <a href="/en-US/Add-ons/SDK/Low-Level_APIs/content_mod">content/mod</a>. Aqui está um add-on que usa botões alternados para anexar uma folha de estilo a tab ativa, e desanexar novamente. A folha de estilo é chamada "style.css" e está localizada no diretório "data":</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+var { attach, detach } = require('sdk/content/mod');
+var { Style } = require('sdk/stylesheet/style');
+var { ToggleButton } = require("sdk/ui/button/toggle");
+
+var style = Style({
+  uri: './style.css'
+});
+
+var button = ToggleButton({
+  id: "stylist",
+  label: "stylist",
+  icon: "./icon-16.png",
+  onChange: function(state) {
+    if (state.checked) {
+      attach(style, tabs.activeTab);
+    }
+    else {
+      detach(style, tabs.activeTab);
+    }
+  }
+});</pre>
+
+<h3 id="Janelas_Privadas">Janelas Privadas</h3>
+
+<p>Se o seu add-on não optou por entrar em navegação privada, então você não verá quaisquer tabs pela janela de navegação privada.</p>
+
+<p>Tabs hospedadas por janelas em navegação privada não serão vista se você enumerar o módulo <code>tab</code> por si mesmo, e você não receberá quaisquer eventos deles.</p>
+
+<p>Para aprender mais sobre janelas privadas, como optar por entrar em navegação privada, e como suportar navegação privada, dirija-se à <a href="/en-US/Add-ons/SDK/High-Level_APIs/private-browsing">documentação do módulo para <code>private-browsing</code></a>.</p>
+
+<h3 id="Converção_para_XUL_tabs">Converção para XUL tabs</h3>
+
+<p>Para converter de um objeto <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs#Tab"><code>Tab</code></a> de alto nível usando esta API para um objeto <a href="/en-US/docs/Mozilla/Tech/XUL/tab">XUL <code>tab</code></a> de baixo nível usado na API <a href="/en-US/Add-ons/SDK/Low-Level_APIs/tabs_utils"><code>tabs/utils</code></a> e por add-ons tradicionais, use a função <code>viewFor()</code> exportada pelo móduloa <code>viewFor</code>.</p>
+
+<p>Para converter de volta, de uma <code>tab</code> XUL para um objeto <code>Tab</code> de alto nível, use a função <code>modelFor(),</code> exportada pelo módulo <code>modelFor</code>.</p>
+
+<p>Aqui está um exemplo covertendo de uma <code>Tab </code>de alto nível para uma <code>tab XUL</code> e então converte de volta:</p>
+
+<pre class="brush: js">var { modelFor } = require("sdk/model/core");
+var { viewFor } = require("sdk/view/core");
+
+var tabs = require("sdk/tabs");
+var tab_utils = require("sdk/tabs/utils");
+
+function mapHighLevelToLowLevel(tab) {
+  // get the XUL tab that corresponds to this high-level tab
+  var lowLevelTab = viewFor(tab);
+  // now we can, for Exemplo, access the tab's content directly
+  var browser = tab_utils.getBrowserForTab(lowLevelTab);
+  console.log(browser.contentDocument.body.innerHTML);
+  // get the high-level tab back from the XUL tab
+  var highLevelTab = modelFor(lowLevelTab);
+  console.log(highLevelTab.url);
+}
+
+tabs.on("ready", mapHighLevelToLowLevel);
+</pre>
+
+<p>Observe que acessar objetos XUL diretamente e conteúdo web como este significa que você não está protegido pelas garantias de compatibilidades feitas pelas APIs de alto nível do SDK. Em particular, seu código não deve trabalhar com <a href="http://billmccloskey.wordpress.com/2013/12/05/multiprocess-firefox/">multiprocess Firefox</a>.</p>
+
+<h2 id="Globais">Globais</h2>
+
+<h3 id="Funções">Funções</h3>
+
+<h4 class="addon-sdk-api-name" id="open(opções)"><code>open(opções)</code></h4>
+
+<p>Abre uma nova tab. A nova tab abrirá na janela ativa ou na nova janela, dependendo da opção <code>inNewWindow</code>.</p>
+
+<p><strong>Examplo</strong></p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+
+// Open a new tab on active window and make tab active.
+tabs.open("http://www.mysite.com");
+
+// Open a new tab in a new window and make it active.
+tabs.open({
+  url: "http://www.mysite.com",
+  inNewWindow: true
+});
+
+// Open a new tab on active window in the background.
+tabs.open({
+  url: "http://www.mysite.com",
+  inBackground: true
+});
+
+// Open a new tab as an app tab and do something once it's open.
+tabs.open({
+  url: "http://www.mysite.com",
+  isPinned: true,
+  onOpen: function onOpen(tab) {
+    // do stuff like listen for content
+    // loading.
+  }
+});</pre>
+
+<h5 id="Parâmetros">Parâmetros</h5>
+
+<p><strong>opção: object</strong><br>
+ Opções necessárias:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>url</td>
+   <td>string</td>
+   <td>
+    <p>URL a ser aberta na nova tab. Esta é uma propriedade necessária.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Opções opcionais:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>isPrivate</td>
+   <td>boolean</td>
+   <td>
+    <p>Boolean que determinará se a nova tab deve ser privada ou não. Se seu add-on não suporta navegação privada isto não terá efeito. Veja a documentação de <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/private-browsing">navegação privada</a> para mais informação. O padrão é <code>false</code>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>inNewWindow</td>
+   <td>boolean</td>
+   <td>
+    <p>Se presente e true, uma nova janela de navegação será aberta e na primeira tab naquela janela. Esta é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>inBackground</td>
+   <td>boolean</td>
+   <td>
+    <p>Se presente e true, a nova tab será aberta à direita da tab ativa e não estará ativa. Esta é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>isPinned</td>
+   <td>boolean</td>
+   <td>
+    <p>Se presente e true, a nova tab será anexada como um <a href="http://support.mozilla.com/en-US/kb/what-are-app-tabs">app tab</a>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onOpen</td>
+   <td>function</td>
+   <td>
+    <p>Uma função que será registrada para o evento 'open'. Esta é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onClose</td>
+   <td>function</td>
+   <td>
+    <p>Uma função de callback que será registrada para o evento 'close'. Esta é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onReady</td>
+   <td>function</td>
+   <td>
+    <p>Uma função de callback que será registrada para o evento 'ready'. Esta é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onLoad</td>
+   <td>function</td>
+   <td>
+    <p>Uma função de callback que será registrada para o evento 'load'. Esta é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onPageShow</td>
+   <td>function</td>
+   <td>
+    <p>Uma função de callback que será registrada para o evento 'pageshow'. Esta é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onActivate</td>
+   <td>function</td>
+   <td>
+    <p>Uma função de callback que será registrada para o evento 'activate'. Esta é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onDeactivate</td>
+   <td>function</td>
+   <td>
+    <p>Uma função de callback que será registrada para o evento 'deactivate'. Esta é uma propriedade opcional.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Propriedades">Propriedades</h3>
+
+<h4 class="addon-sdk-api-name" id="activeTab"><code>activeTab</code></h4>
+
+<p>A tab ativa na janela ativa. Esta propriedade é somente leitura. Para ativar um objeto<code> Tab</code>, chame seu método <code>activate</code>.</p>
+
+<p><strong>Exemplo</strong></p>
+
+<pre class="brush: js">// Get the active tab's title.
+var tabs = require("sdk/tabs");
+console.log("title of active tab is " + tabs.activeTab.title);</pre>
+
+<h4 class="addon-sdk-api-name" id="length"><code>length</code></h4>
+
+<p>O número de tabs abertas em todas as janelas.</p>
+
+<h3 id="Eventos">Eventos</h3>
+
+<h4 class="addon-sdk-api-name" id="open"><code>open</code></h4>
+
+<p>Este evento é emitido quando uma nova tab é aberta. Isto não significa que o conteúdo carregou, somente que o navegador está inteiramente visível para o usuário.</p>
+
+<p>Propriedades relacionadas à conteúdo da tab (por exemplo: <code>title</code>, <code>favicon</code>, e <code>url</code>) não serão corrigidas neste ponto. Se você precisar acessar estas propriedades, escute o evento <code>ready</code>:</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+tabs.on('open', function(tab){
+  tab.on('ready', function(tab){
+    console.log(tab.url);
+  });
+});</pre>
+
+<h5 id="Argumentos">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas ao objeto tab que acaba de abrir.</p>
+
+<h4 class="addon-sdk-api-name" id="close"><code>close</code></h4>
+
+<p>Este evento é emitido quando a tab é fechada. Quando a janela é fechada este evento será emitido para cada uma das tabs abertas naquela janela.</p>
+
+<h5 id="Argumentos_2">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas ao objeto tab que fechou.</p>
+
+<h4 class="addon-sdk-api-name" id="ready"><code>ready</code></h4>
+
+<p>Este evento é emitido quando o DOM para o conteúdo da página estiver preparado. É equivalmente ao evento <code>DOMContentLoaded</code> para conteúdo da página dada.</p>
+
+<p>Um única tab emitirá este evento toda vez todas às vezes que o DOM for carregado: então será emitido novamente se o endereço da página mudar ou o conteúdo for recarregado.</p>
+
+<p>Depois que este evento for emitido, todas as propriedades relacionadas ao conteúdo da página poderão ser usadas.</p>
+
+<h5 id="Argumentos_3">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas ao objeto tab que carregou.</p>
+
+<h4 class="addon-sdk-api-name" id="activate"><code>activate</code></h4>
+
+<p>Este evento é emitido quando uma tab inativa torna-se ativa.</p>
+
+<h5 id="Argumentos_4">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas para o objeto tab que torna-se ativa.</p>
+
+<h4 class="addon-sdk-api-name" id="deactivate"><code>deactivate</code></h4>
+
+<p>Este evento é emitido quando a tab ativa torna-se inativa.</p>
+
+<h5 id="Argumentos_5">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas para o objeto tab que tornou-se inativo.</p>
+
+<h2 id="Tab">Tab</h2>
+
+<p>Uma instância Tab representa um única tab aberta. Ele contém várias propriedades, vários métodos para manipulação, assim como registração de evento por tab.</p>
+
+<p>Tabs emitem todos os eventos descritos na seção de Eventos. Escutas são passadas ao objeto <code>Tab</code> que lança eventos.</p>
+
+<h3 id="Métodos">Métodos</h3>
+
+<h4 class="addon-sdk-api-name" id="pin()"><code>pin()</code></h4>
+
+<p>Anexa a tab como uma <a href="http://support.mozilla.com/en-US/kb/what-are-app-tabs">app tab</a>.</p>
+
+<h4 class="addon-sdk-api-name" id="unpin()"><code>unpin()</code></h4>
+
+<p>Desanexa esta tab.</p>
+
+<h4 class="addon-sdk-api-name" id="close(callback)"><code>close(callback)</code></h4>
+
+<p>Fecha esta tab.</p>
+
+<h5 id="Parâmetros_2">Parâmetros</h5>
+
+<p><strong>callback : function</strong><br>
+ Uma função será chamada quanto a tab termine seu processo de fechamento. Este é uma argumento opcional.</p>
+
+<h4 class="addon-sdk-api-name" id="reload()"><code>reload()</code></h4>
+
+<p>Recarrega esta tab.</p>
+
+<h4 class="addon-sdk-api-name" id="activate()"><code>activate()</code></h4>
+
+<p>Torna esta tab ativa, que trará esta tab para o primeiro plano.</p>
+
+<h4 class="addon-sdk-api-name" id="getThumbnail()"><code>getThumbnail()</code></h4>
+
+<p>Retorna o dado thumbnail da URI da página atualmente carregada nesta tab.</p>
+
+<h4 class="addon-sdk-api-name" id="attach(options)"><code>attach(options)</code></h4>
+
+<p>Anexa um ou mais scripts ao documento carregado na tab. Observe que este é centrado na tab: se o usuário navega para uma nova página na mesma tab, então o script de conteúdo será reanexado à nova página.</p>
+
+<p><strong>Exemplo</strong></p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+
+tabs.on('ready', function(tab) {
+  var worker = tab.attach({
+      contentScript:
+        'document.body.style.border = "5px solid red";'
+  });
+});</pre>
+
+<h5 id="Parâmetros_3">Parâmetros</h5>
+
+<p><strong>options : objeto</strong><br>
+ Opções opcionais:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>contentScriptFile</td>
+   <td>string,array</td>
+   <td>
+    <p>As URLs dos arquivos locais dos scripts de conteúdo carregados. Scripts de conteúdo especificados por esta opção são carregados <em>antes </em>daqueles especificados pela opção <code>contentScript</code>. Opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>contentScript</td>
+   <td>string,array</td>
+   <td>
+    <p>Uma string ou uma array de strings do código para ser avaliado no contexto. Scripts de conteúdo especificados por esta opção são carregados <em>depois</em> daqueles especificados pela opção <code>contentScriptFile</code>. Opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>contentScriptOptions</td>
+   <td>object</td>
+   <td>
+    <p>Você pode usar esta opção para definir valores somente leitura para seus scripts de conteúdo.</p>
+
+    <p>A opção consiste de uma listagem de objetos literais no formato pares <code>name:value</code> para os valores que você quer fornecer para o script de conteúdo. Por exemplo:</p>
+
+    <pre class="brush: js">
+// main.js
+
+const tabs = require("sdk/tabs");
+
+tabs.open({
+  url: "./page.html",
+  onReady: function(tab) {
+    tab.attach({
+      contentScriptFile: "./content-script.js",
+      contentScriptOptions: {
+        a: "blah"
+      }
+    });
+  }
+});</pre>
+
+    <p>Os valores são acessíveis ao script de conteúdo via propriedade <code>self.options</code>:</p>
+
+    <pre class="brush: js">
+// content-script.js
+
+alert(self.options.a);</pre>
+   </td>
+  </tr>
+  <tr>
+   <td>onMessage</td>
+   <td>function</td>
+   <td>
+    <p>Uma função chamada quando o conteúdo de trabalho recebe uma mensagem dos scripts de conteúdo. Escutas são passadas como um único argumento, a mensagem postada do script de conteúdo.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onError</td>
+   <td>function</td>
+   <td>
+    <p>Uma função chamada quando o trabalhador de conteúdo recebe um erro dos scripts de conteúdo. Escutas são passar como um único argumento, <code>error</code>, que é erro postado do script de conteúdo e um objeto do tipo <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error">Error</a>. Opcional.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h5 id="Retorno">Retorno</h5>
+
+<p><strong>Worker</strong> : O objeto <a href="/en-US/Add-ons/SDK/Low-Level_APIs/content_worker">Worker</a> pode ser usado para comunicar com o script de conteúdo. Veja o <a href="/en-US/Add-ons/SDK/Guides/Content_Scripts">guia de scripts de conteúdo</a> para aprender os detalhes.</p>
+
+<h3 id="Propriedades_2">Propriedades</h3>
+
+<h4 class="addon-sdk-api-name" id="id"><code>id</code></h4>
+
+<p>O único id para a tab. Esta propriedade é somente leitura.</p>
+
+<h4 class="addon-sdk-api-name" id="title"><code>title</code></h4>
+
+<p>O título da tab (normalmente o título da página atualmente carregada na tab). Esta propriedade pode ser configurada para mudar o título da tab.</p>
+
+<h4 class="addon-sdk-api-name" id="url"><code>url</code></h4>
+
+<p>A URL da página atualmente carregada na tab. Esta propriedade pode ser configurada para carregar uma URL diferente na tab.</p>
+
+<h4 class="addon-sdk-api-name" id="favicon"><code>favicon</code></h4>
+
+<p>A URL do favicon para a página atualmente carregada na tab. Esta propriedade é somente para leitura.</p>
+
+<div class="warning">Esta propriedade está desatualizada. Da versão 1.15, use a função <a href="/en-US/Add-ons/SDK/Low-Level_APIs/places_favicon">getFavicon() do módulo favicon</a> ao invés.</div>
+
+<h4 class="addon-sdk-api-name" id="contentType"><code>contentType</code></h4>
+
+<div class="experimental"><strong>Esta é uma API experimental atualmente, então nós devemos mudar ele em lançamentos futuros. </strong>
+
+<p>Retorna o tipo MIME que o documento atualmente tem carregado na tab sendo desenhada. Ele deve vir do cabeçalho do HTTP ou outra fonte de informação MIME, e deve ser afetado pela conversão de tipo automática executada pelo navegador ou extensão. Esta propriedade é somente leitura.</p>
+</div>
+
+<h4 class="addon-sdk-api-name" id="index"><code>index</code></h4>
+
+<p>O índice da tab relativa a outras tabs na janela da aplicação. Esta propriedade pode ser configurada para mudar sua posição relativa.</p>
+
+<h4 class="addon-sdk-api-name" id="isPinned"><code>isPinned</code></h4>
+
+<p>Se ou não esta tab é anexável como uma <a href="http://support.mozilla.com/en-US/kb/what-are-app-tabs">app tab</a>. Esta propriedade é somente leitura.</p>
+
+<h4 class="addon-sdk-api-name" id="window"><code>window</code></h4>
+
+<p>O objeto <a href="/en-US/Add-ons/SDK/High-Level_APIs/windows#BrowserWindow"><code>window</code></a> para esta tab.</p>
+
+<h4 class="addon-sdk-api-name" id="readyState"><code>readyState</code></h4>
+
+<div class="geckoVersionNote">
+<p>Novo no Firefox 33.</p>
+</div>
+
+<p>Uma string dizendo a você qual o estado de carga do documento hospedado por esta tab. Isto corresponde diretamente ao <a href="/en-US/docs/Web/API/document.readyState"><code>Document.readyState</code></a>. Ele tem um de quatro valores possíveis:</p>
+
+<ul>
+ <li>"uninitialized": o documento da tab não está ainda carregado</li>
+ <li>"loading": o documento da tab está ainda em processo de carga</li>
+ <li>"interactive": o documento da tab carregou e está analisado, mas os recursos tais como imagens e folhas de escilo devem ainda ser carregados</li>
+ <li>"complete": o documento da tab e todos os recursos estão inteiramente carregados</li>
+</ul>
+
+<p>Uma vez que o <code>readyState</code> da tab entrou no "interactive", você pode pegar as propriedades tais como a URL do documento.</p>
+
+<h3 id="Eventos_2">Eventos</h3>
+
+<h4 class="addon-sdk-api-name" id="close_2"><code>close</code></h4>
+
+<p>Este evento é emitido quando a tab é fechada. Ele também é emitido quando a janela da tab é fechada.</p>
+
+<h5 id="Argumentos_6">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas ao objeto tab.</p>
+
+<h4 class="addon-sdk-api-name" id="ready_2"><code>ready</code></h4>
+
+<p>Este evento é emitido quando o DOM para o conteúdo da tab estiver preparado.  Ele é equivalente ao evento <a href="https://developer.mozilla.org/en-US/docs/Web/Reference/Events/DOMContentLoaded"><code>DOMContentLoaded</code></a> para o dado conteúdo da página. Neste ponto o documento por si só está inteiramente carreado e analisado, mas recursos tais como folhas de estilo e imagens devem estar ainda carregando.</p>
+
+<p>Uma única tab emitirá este evento todas às vezes que o DOM estiver carregado: então ela será emitida novamente se o endereço da tab mudar ou o conteúdo for recarregado. Depois deste evento ser emitido, todas as propriedades relacionadas ao conteúdo da tab podem ser usadas.</p>
+
+<h5 id="Argumentos_7">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas ao objeto tab.</p>
+
+<h4 class="addon-sdk-api-name" id="load"><code>load</code></h4>
+
+<p>Este evento é emitido quando a página do conteúdo da tab estiver carregada. É equivalente ao evento <a href="https://developer.mozilla.org/en-US/docs/Web/Reference/Events/load"><code>load</code></a> para o dado conteúdo da página. Neste ponto o documento e seus recursos, tais como imagens e folhas de estilo, terminaram o carregamento.</p>
+
+<p>Este evento pode ser usado por páginas que não tem um evento <code>DOMContentLoaded</code>, como imagens. Para páginas que tem um evento<code> DOMContentLoaded</code>, <code>load</code> é disparado depois do <code>ready</code>.</p>
+
+<p>Uma única tab emitirá este evento toda vez que a página for carregada: então ele será emitido novamente se o endereço da tab mudar ou o conteúdo for recarregado. Depois deste evento ser emitido, todas as propriedades relacionadas ao conteúdo da tab podem ser usados</p>
+
+<h5 id="Argumentos_8">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas para o objeto tab.</p>
+
+<h4 class="addon-sdk-api-name" id="pageshow"><code>pageshow</code></h4>
+
+<p>O evento <code>pageshow</code> é emitido quando a página para o conteúdo da tab for carregado. É equivalente ao evento <a href="https://developer.mozilla.org/en-US/docs/DOM/Mozilla_event_reference/pageshow"><code>pageshow</code></a> para um dado conteúdo da página.</p>
+
+<p>Este evento é similar aos eventos <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs#load"><code>load</code></a> e <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs#ready"><code>ready</code></a>, exceto que diferente de <code>load</code> e <code>ready</code>, <code>pageshow</code> é lançado se a página for recuperada do <a href="https://developer.mozilla.org/en-US/docs/Working_with_BFCache">bfcache.</a> Isto significa que se o usuário carrega a página, carrega uma nova página, então se move para a página anterior usando o botão "Back", o evento <code>pageshow</code> é emitido quando o usuário volta a página, enquanto os eventos <code>load</code> e <code>ready</code> não são.</p>
+
+<p>Este evento <em>não</em> é emitido quando a tab fica ativa: para conseguir ser notificado sobre isso, você precisa escutar o evento <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs#activate"><code>activate</code></a>.</p>
+
+<p>Depois que este evento foi emitido, todas as propriedades relacionadas ao conteúdo da tab podem ser usadas. Ele é emitido depois do <code>load</code> e <code>ready</code>.</p>
+
+<h5 id="Argumentos_9">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas ao objeto tab.</p>
+
+<p><strong>persisted</strong> : Escutas são passadas um valor booleano indicando se ou não a página foi carregada do <a href="https://developer.mozilla.org/en-US/docs/Working_with_BFCache">bfcache</a>.</p>
+
+<h4 class="addon-sdk-api-name" id="activate_2"><code>activate</code></h4>
+
+<p>Este evento é emitido quando a tab torna-se ativa.</p>
+
+<p>Observe que você não pode garantir que o conteúdo da tab, ou mesmo sua <code>url</code>, estão inicializados na hora que o <code>activate</code> foi emitido. Isto porque quando uma nova tab é aberta, seu evento activate pode ser emitido antes do conteúdo ser carregado.</p>
+
+<p>Você pode usar a propriedade <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs#readyState"><code>readyState</code></a> da tab para determinar se o conteúdo da tab e <code>url</code> estão disponíveis: se o <code>readyState</code> está <code>uninitialized</code> ou <code>loading</code>, então você não pode acessar as propriedades da tab e deve esperar pelo evento <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs#ready_2"><code>ready</code></a> da tab.</p>
+
+<h5 id="Argumentos_10">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas ao objeto.</p>
+
+<h4 class="addon-sdk-api-name" id="deactivate_2"><code>deactivate</code></h4>
+
+<p>Este evento é emitido quando a tab torna-se inativa.</p>
+
+<h5 id="Argumentos_11">Argumentos</h5>
+
+<p><strong>Tab</strong> : Escutas são passadas ao objeto tab.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/high-level_apis/windows/index.html b/files/pt-br/mozilla/add-ons/sdk/high-level_apis/windows/index.html
new file mode 100644
index 0000000000..35c0b6bdb3
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/high-level_apis/windows/index.html
@@ -0,0 +1,303 @@
+---
+title: Janelas
+slug: Mozilla/Add-ons/SDK/High-Level_APIs/windows
+tags:
+  - Add-on SDK
+translation_of: Archive/Add-ons/Add-on_SDK/High-Level_APIs/windows
+---
+<div class="note">
+<p>Stable</p>
+</div>
+
+<p><span class="seoSummary">Enumera e examina janelas do navegador abertas, abre novas janelas, e escuta por eventos de janela.</span></p>
+
+<h2 id="Uso">Uso</h2>
+
+<p>O módulo <code>windows</code> fornece funções básicas para trabalhar janelas de navegador. Com este módulo, você pode:</p>
+
+<ul>
+ <li><a href="/en-US/Add-ons/SDK/High-Level_APIs/windows#open(options)">enumerar as janeals abertas atualmente</a></li>
+ <li><a href="/en-US/Add-ons/SDK/High-Level_APIs/windows#open(options)">abrir novas janelas do navegador</a></li>
+ <li><a href="/en-US/Add-ons/SDK/High-Level_APIs/windows#Events">criar escutas para eventos comuns de janela tais como open e close</a></li>
+</ul>
+
+<h3 id="Janelas_Privadas">Janelas Privadas</h3>
+
+<p>Se seu add-on não optou pela navegação privada, então você não verá qualquer janela de navegação privada. Janelas de navegação privada não aparecerão na propriedade <a href="/en-US/Add-ons/SDK/High-Level_APIs/windows#browserWindows"><code>browserWindows</code></a>, você não receberá qualquer evento de janela, e você não será capaz de abrir janelas privadas.</p>
+
+<p>Para aprender mais sobre navegação privada, como optar pela navegação privada, e como suportar navegação privada dirija-se à <a href="/en-US/Add-ons/SDK/High-Level_APIs/private-browsing">documentação para o módulo <code>private-browsing</code></a>.</p>
+
+<h3 id="Converção_para_as_Janelas_Chrome">Converção para as Janelas Chrome</h3>
+
+<p>Para converter do objeto <a href="/en-US/Add-ons/SDK/High-Level_APIs/windows#BrowserWindow"><code>BrowserWindow</code></a> usando nesta API para o objeto chrome <a href="/en-US/docs/Web/API/Window"><code>window</code></a> usado na API <a href="/en-US/Add-ons/SDK/Low-Level_APIs/window_utils"><code>window/utils</code></a>, use a função <code>viewFor()</code> expotada pelo módulo <code>viewFor()</code>.</p>
+
+<p>Para converter de vola, de uma janela chrome para um objeto <code>BrowserWindow</code>, use a função  <code>modelFor()</code>, exportada pelo módulo <code>modelFor</code>.</p>
+
+<p>Aqui está um exemplo convertendo do alto nível <code>BrowserWindow</code> para uma janela chrome, e então voltando para o outro modo:</p>
+
+<pre class="brush: js">var { modelFor } = require("sdk/model/core");
+var { viewFor } = require("sdk/view/core");
+
+var browserWindows = require("sdk/windows").browserWindows;
+
+function convertToChromeAndBack(browserWindow) {
+  // get the chrome window for this BrowserWindow
+  var chromeWindow = viewFor(browserWindow);
+  // now we can use the chrome window API
+  console.log(chromeWindow.document.location.href);
+  // -&gt; "chrome://browser/content/browser.xul"
+
+  // convert back to the high-level window
+  var highLevelWindow = modelFor(chromeWindow);
+  // now we can use the SDK's high-level window API
+  console.log(highLevelWindow.title);
+}
+
+browserWindows.on("open", convertToChromeAndBack);</pre>
+
+<p>Note que acessar diretamente os objetos chrome de baixo nível significa que você não está protegido pelas garantias de compatibilidade das APIs de alto nível do SDK. Em particular, dependendo de o que você faz com estes objetos, seu código não deve trabalhar com <a href="http://billmccloskey.wordpress.com/2013/12/05/multiprocess-firefox/">multiprocess Firefox</a>.</p>
+
+<h2 id="Globais">Globais</h2>
+
+<h3 id="Funções">Funções</h3>
+
+<h4 class="addon-sdk-api-name" id="open(options)"><code>open(options)</code></h4>
+
+<p>Abre uma nova janela.</p>
+
+<pre class="brush: js">var windows = require("sdk/windows").browserWindows;
+
+// Open a new window.
+windows.open("http://www.example.com");
+
+// Open a new window and set a listener for "open" event.
+windows.open({
+  url: "http://www.example.com",
+  onOpen: function(window) {
+    // do stuff like listen for content
+    // loading.
+  }
+});</pre>
+
+<p>Retorna a janela que foi aberta:</p>
+
+<pre class="brush: js">var windows = require("sdk/windows").browserWindows;
+var example = windows.open("http://www.example.com");
+
+require("sdk/ui/button/action").ActionButton({
+  id: "read",
+  label: "Read",
+  icon: "./read.png",
+  onClick: function() {
+    example.close();
+  }
+});
+</pre>
+
+<div class="note">
+<p>Este exemplo usa a API <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a>, que está disponível somente do Firefox 29 em frente.</p>
+</div>
+
+<h5 id="Parâmetros">Parâmetros</h5>
+
+<p><strong>options : object</strong><br>
+ Opções requeridas:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>url</td>
+   <td>string</td>
+   <td>
+    <p>String com a URL a ser aberta na nova janela. É uma propriedade necessária.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>isPrivate</td>
+   <td>boolean</td>
+   <td>
+    <p>Boleano que determinará se a nova janela seria privada ou não. Se seus add-ons não suportam navegação privada isto não terá efeito. Veja a documentação sobre <a href="/en-US/Add-ons/SDK/High-Level_APIs/private-browsing">private-browsing</a> para mais informação.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Opções opcionais:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>onOpen</td>
+   <td>function</td>
+   <td>
+    <p>Uma função de retorno que é chamada quando a janela está aberta. Isto não significa que o conteúdo da URL foi carregado, somente que a janela por si está inteiramente funcional e suas propriedades podem ser acessadas. Isto é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onClose</td>
+   <td>function</td>
+   <td>
+    <p>Uma função de retorno que é chamada quando a janela será chamada. Isto é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onActivate</td>
+   <td>function</td>
+   <td>
+    <p>Uma função de retorno que é chamada quando a janela está ativa. Isto é uma propriedade opcional.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onDeactivate</td>
+   <td>function</td>
+   <td>
+    <p>Uma função de retorno que é chamada quando a janela não está ativa. Isto é uma propriedade opcional.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h5 id="Retorna">Retorna</h5>
+
+<p><strong>BrowserWindow</strong> :</p>
+
+<h3 id="Properties">Properties</h3>
+
+<h4 class="addon-sdk-api-name" id="browserWindows"><code>browserWindows</code></h4>
+
+<p><code>browserWindows</code> fornece acesso a todas as janelas de navegadores abertas com os objetos <a href="/en-US/Add-ons/SDK/High-Level_APIs/windows#BrowserWindow">BrowserWindow</a>.</p>
+
+<pre class="brush: js">var windows = require("sdk/windows");
+for (let window of windows.browserWindows) {
+  console.log(window.title);
+}
+
+console.log(windows.browserWindows.length);</pre>
+
+<p>Este objeto emite todos os eventos listados na seção "Eventos':</p>
+
+<pre class="brush: js">var windows = require("sdk/windows").browserWindows;
+
+// add a listener to the 'open' event
+windows.on('open', function(window) {
+  myOpenWindows.push(window);
+});
+
+// add a listener to the 'close' event
+windows.on('close', function(window) {
+  console.log("A window was closed.");
+});
+
+// add a listener to the 'activate' event
+windows.on('activate', function(window) {
+  console.log("A window was activated.");
+});
+
+// add a listener to the 'deactivate' event
+windows.on('deactivate', function(window) {
+  console.log("A window was deactivated.");
+});</pre>
+
+<p>A janela ativa atual é data pelo <code>BrowserWindows.activeWindow</code>:</p>
+
+<pre class="brush: js">var windows = require("sdk/windows").browserWindows;
+
+windows.on('activate', function(window) {
+  console.log("A window was activated.");
+  var activeWindowTitle = windows.activeWindow.title;
+  console.log("Active window title is: " + activeWindowTitle);
+});</pre>
+
+<h3 id="Eventos">Eventos</h3>
+
+<h4 class="addon-sdk-api-name" id="open"><code>open</code></h4>
+
+<p>Evento emitido quando uma nova janela é aberta. Isso não significa que o conteúdo foi carregado, somente que a janela do navegador por si só está inteiramente visível ao usuário.</p>
+
+<h5 id="Argumentos">Argumentos</h5>
+
+<p><strong>Window</strong> : Escutas são passadas para o objeto <code>window</code> que desencadeou o evento.</p>
+
+<h4 class="addon-sdk-api-name" id="close"><code>close</code></h4>
+
+<p>Evento emitido quando uma janela é fechada. Você não pode sempre confiar na recepção do evento close para todas as janelas abertas. Em particular, se o usuário fechar o navegador de forma preciptada o que pode fechar o add-on antes das janelas serem fechadas.</p>
+
+<h5 id="Argumentos_2">Argumentos</h5>
+
+<p><strong>Window</strong> : escutas são passadas para o objeto <code>window</code> lançou o evento.</p>
+
+<h4 class="addon-sdk-api-name" id="activate"><code>activate</code></h4>
+
+<p>Evento emitido quando uma janela inativa é tornada ativa.</p>
+
+<h5 id="Argumentos_3">Argumentos</h5>
+
+<p><strong>Window</strong> : Escutas são passadas para o objeto <code>window</code> que torna ativa.</p>
+
+<h4 class="addon-sdk-api-name" id="deactivate"><code>deactivate</code></h4>
+
+<p>Evento emitido quando a janela ativa se torna inativa.</p>
+
+<h5 id="Arguments">Arguments</h5>
+
+<p><strong>Window</strong> : Escutas são passadas para o objeto<code> window</code> que se tornou inativa.</p>
+
+<h2 id="BrowserWindow">BrowserWindow</h2>
+
+<p>Uma instância <code>BrowserWindow</code> representa uma única janela aberta. Elas podem ser recuperadas da propriedade <code>browserWindows</code> exportadas pelo módulo.</p>
+
+<pre class="brush: js">var windows = require("sdk/windows").browserWindows;
+
+//Print how many tabs the current window has
+console.log("The active window has " +
+            windows.activeWindow.tabs.length +
+            " tabs.");
+
+// Print the title of all browser windows
+for (let window of windows) {
+  console.log(window.title);
+}
+
+// close the active window
+windows.activeWindow.close(function() {
+  console.log("The active window was closed");
+});</pre>
+
+<h3 id="Métodos">Métodos</h3>
+
+<h4 class="addon-sdk-api-name" id="activate()"><code>activate()</code></h4>
+
+<p>Torna a janela ativa, que focará aquela janela e trará ela para o primeiro plano.</p>
+
+<h4 class="addon-sdk-api-name" id="close(callback)"><code>close(callback)</code></h4>
+
+<p>Fecha a janela.</p>
+
+<h5 id="Parâmetros_2">Parâmetros</h5>
+
+<p><strong>callback : function</strong><br>
+ Uma função chamada quando a janela termina seu processo de fechamento. É um argumento opcional.</p>
+
+<h3 id="Propriedades">Propriedades</h3>
+
+<h4 class="addon-sdk-api-name" id="title"><code>title</code></h4>
+
+<p>O título atual da janela. Normalmente o título da tab ativa, mais um identificador da app. Esta propriedade é somente leitura.</p>
+
+<h4 class="addon-sdk-api-name" id="tabs"><code>tabs</code></h4>
+
+<p>Uma lista ao vivo das tabs na janela. Esse objeto tem as mesma interface da API <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs"><code>tabs</code></a>, exceto que ele contem somente as tabs nesta janela, não todas as tabs em todas as janelas. Esta propriedade é somente leitura.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/index.html b/files/pt-br/mozilla/add-ons/sdk/index.html
new file mode 100644
index 0000000000..88ed15ad16
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/index.html
@@ -0,0 +1,102 @@
+---
+title: Add-on SDK
+slug: Mozilla/Add-ons/SDK
+tags:
+  - Add-on SDK
+  - Extensões
+translation_of: Archive/Add-ons/Add-on_SDK
+---
+<p>Usando a SDK de Add-ons você pode criar add-ons para Firefox usando tecnologias web padrão: Javascript, HTML e CSS. A SDK inclui APIs Javascript as quais você pode utilizar para criar add-ons, além de ferramentas para rodar, testar e empacotar os mesmos.</p>
+<hr>
+<h3 id="Tutoriais">Tutoriais</h3>
+<div class="column-container">
+ <div class="column-half">
+  <dl>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Tutorials#getting-started">Começando</a></dt>
+   <dd>
+    Como <a href="/en-US/Add-ons/SDK/Tutorials/Installation">instalar a SDK</a> e <a href="/en-US/Add-ons/SDK/Tutorials/Getting_Started_With_cfx">usar a ferramenta cfx</a> para desenvolver, testar e empacotar add-ons.</dd>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Tutorials#interact-with-the-browser">Interagindo com o Navegador</a></dt>
+   <dd>
+    <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Open_a_Web_Page">Abrir páginas web</a>, <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Listen_For_Page_Load">escutar por carregamento de páginas</a> e <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/List_Open_Tabs">listar páginas abertas.</a></dd>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Tutorials#development-techniques">Técnicas de Desenvolvimento</a></dt>
+   <dd>
+    Aprenda técnicas comúns de desenvolvimento, tal como <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Unit_testing">testes unitários</a>, <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Logging">registramento</a>, <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Creating_Reusable_Modules">criando módulos reutilizáveis</a>, <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/l10n">localização</a> e <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Mobile_development">desenvolvimento mobile</a>.</dd>
+  </dl>
+ </div>
+ <div class="column-half">
+  <dl>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Tutorials#create-user-interfaces">Crie componentes de Interface de Usuário</a></dt>
+   <dd>
+    Crie componentes de interface de usuário tais como <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Adding_a_Button_to_the_Toolbar">botões de toolbar</a>, <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Add_a_Context_Menu_Item">menus de contexto</a>, <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Add_a_Menu_Item_to_Firefox">itens de menu</a> e <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Display_a_Popup">dialogs</a>.</dd>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Tutorials#modify-web-pages">Modifique páginas Web</a></dt>
+   <dd>
+    Modifique páginas que <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Modifying_Web_Pages_Based_on_URL">verificam um padrão de URL</a> ou dinamicamente <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Modifying_the_Page_Hosted_by_a_Tab">modifique uma aba em particular</a>.</dd>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Tutorials/Annotator">Juntando Tudo</a></dt>
+   <dd>
+    Um guia sobre o exemplo do add-on Annotator</dd>
+  </dl>
+ </div>
+</div>
+<hr>
+<h3 id="Guia">Guia</h3>
+<div class="column-container">
+ <div class="column-half">
+  <dl>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Guides#contributors-guide">Guia do Contribuidor</a></dt>
+   <dd>
+    Aprenda sobre <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Getting_Started">como começar a contribuir</a> para a SDK e sobre os idiomas mais importantes utilizados no código da SDK, tal como <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Modules">módulos</a>, <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Classes_and_Inheritance">classes e herança</a>, <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Private_Properties">propriedades privadas</a> e <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Content_Processes">processos de conteúdo</a>.</dd>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Guides#sdk-infrastructure">Infraestrutura da SDK</a></dt>
+   <dd>
+    Aspectos da tecnologia fundamental da SDK: <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Module_structure_of_the_SDK">módulos</a>, o <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Program_ID">ID de Programa</a> e regras que definem <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Firefox_Compatibility">compatibilidade do Firefox</a>.</dd>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Guides/Content_Scripts">Content scripts</a></dt>
+   <dd>
+    Um guia detalhado sobre <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Content_Scripts">trabalhar com content scripts</a>, incluindo: <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Loading_content_scripts">como carregar content scripts</a>, <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Accessing_the_DOM">que objetos content scripts podem acessar</a> e <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Communicating_with_other_scripts">como comunicar entre content scripts e o resto do add-on</a>.</dd>
+  </dl>
+ </div>
+ <div class="column-half">
+  <dl>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Guides#sdk-idioms">Idiomas da SDK</a></dt>
+   <dd>
+    O <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Working_with_Events">event framework</a> da SDK e uma <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Two_Types_of_Scripts">distinção entre scripts add-on e content scripts</a>.</dd>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Guides/XUL_Migration_Guide">Migração de XUL</a></dt>
+   <dd>
+    Um guia sobre <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/XUL_Migration_Guide">como portar add-ons XUL para a SDK</a>. Este guia inclui uma <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/XUL_vs_SDK">comparação das duas ferramentas</a> e um <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Porting_the_Library_Detector">exemplo funcionando</a> de como portal um add-on XUL.</dd>
+  </dl>
+ </div>
+</div>
+<hr>
+<h3 id="Referência">Referência</h3>
+<div class="column-container">
+ <div class="column-half">
+  <dl>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/High-Level_APIs">APIs Alto Nível</a></dt>
+   <dd>
+    Documentação referência para as APIs de Alto nível da SDK.</dd>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Tools">Referência de Ferramentas</a></dt>
+   <dd>
+    Documentação referência para a <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tools/cfx">ferramenta cfx</a> usada para desenvolver, testar e empacotar add-ons, o <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tools/console">console</a> global usado para registro e o arquivo <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tools/package_json">package.json</a>.</dd>
+  </dl>
+ </div>
+ <div class="column-half">
+  <dl>
+   <dt>
+    <a href="/en-US/Add-ons/SDK/Low-Level_APIs">APIs Baixo Nível</a></dt>
+   <dd>
+    Documentação referência para as APIs baixo nível.</dd>
+  </dl>
+ </div>
+</div>
+<p> </p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/low-level_apis/index.html b/files/pt-br/mozilla/add-ons/sdk/low-level_apis/index.html
new file mode 100644
index 0000000000..8cd08458f0
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/low-level_apis/index.html
@@ -0,0 +1,23 @@
+---
+title: Low-Level APIs
+slug: Mozilla/Add-ons/SDK/Low-Level_APIs
+tags:
+  - NeedsTranslation
+  - TopicStub
+translation_of: Archive/Add-ons/Add-on_SDK/Low-Level_APIs
+---
+<p>Modules in this section implement low-level APIs. These modules fall roughly into three categories:</p>
+<ul>
+ <li>
+  <p>fundamental utilities such as <a href="/en-US/Add-ons/SDK/Low-Level_APIs/util_collection">collection</a>. Many add-ons are likely to want to use modules from this category.</p>
+ </li>
+ <li>
+  <p>building blocks for higher level modules, such as <a href="/en-US/Add-ons/SDK/Low-Level_APIs/event_core">events</a> and <a href="/en-US/Add-ons/SDK/Low-Level_APIs/content_worker">worker</a>. You're more likely to use these if you are building your own modules that implement new APIs, thus extending the SDK itself.</p>
+ </li>
+ <li>
+  <p>privileged modules that expose powerful low-level capabilities such as <a href="/en-US/Add-ons/SDK/Low-Level_APIs/window_utils">window/utils</a> and <a href="/en-US/Add-ons/SDK/Low-Level_APIs/net_xhr">net/xhr</a>. You can use these modules in your add-on if you need to, but should be aware that the cost of privileged access is the need to take more elaborate security precautions. In many cases these modules have simpler, more restricted analogs among the "High-Level APIs" (for example, <a href="/en-US/Add-ons/SDK/High-Level_APIs/windows">windows</a> or <a href="/en-US/Add-ons/SDK/High-Level_APIs/request">request</a>).</p>
+ </li>
+</ul>
+<p>These modules are still in active development, and we expect to make incompatible changes to them in future releases.</p>
+<p>{{ LandingPageListSubpages ("/en-US/Add-ons/SDK/Low-Level_APIs", 5) }}</p>
+<p> </p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/low-level_apis/ui_sidebar/index.html b/files/pt-br/mozilla/add-ons/sdk/low-level_apis/ui_sidebar/index.html
new file mode 100644
index 0000000000..a8bd2be2eb
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/low-level_apis/ui_sidebar/index.html
@@ -0,0 +1,455 @@
+---
+title: ui/sidebar
+slug: Mozilla/Add-ons/SDK/Low-Level_APIs/ui_sidebar
+translation_of: Archive/Add-ons/Add-on_SDK/Low-Level_APIs/ui_sidebar
+---
+<p>{{AddonSidebar}}</p>
+
+<div class="note">
+<p>Experimental</p>
+</div>
+
+<p><span class="seoSummary">Enables you to create sidebars.</span> A sidebar is a vertical strip of user interface real estate for your add-on that's attached to the left-hand side of the browser window. You specify its content using HTML, CSS, and JavaScript, and the user can show or hide it in the same way they can show or hide the built-in sidebars.</p>
+
+<h2 id="Usage">Usage</h2>
+
+<h3 id="Creating_showing_and_hiding_sidebars">Creating, showing, and hiding sidebars</h3>
+
+<p>You construct a <code>Sidebar</code> object using the <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#Sidebar(options)"><code>Sidebar()</code></a> constructor.</p>
+
+<p>Once you've done that, you can show the sidebar by calling the Sidebar's <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#show()"><code>show()</code></a> method. If a new window is opened from a window that has a sidebar visible, the new window gets a sidebar, too.</p>
+
+<p>You can hide the sidebar by calling its <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#hide()"><code>hide()</code></a> method.</p>
+
+<p>Called with no arguments, <code>show()</code> and <code>hide()</code> will operate on the currently active window. From Firefox 33 onwards you can pass a <a href="/en-US/Add-ons/SDK/High-Level_APIs/windows#BrowserWindow"><code>BrowserWindow</code></a> into these methods, and they will then operate on the specified window.</p>
+
+<p>Alternatively, the View-&gt;Sidebar submenu in Firefox will contain a new item which the user can use to show or hide the sidebar:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6667/sidebar-menu.png" style="display: block; height: 229px; margin-left: auto; margin-right: auto; width: 518px;">The sidebar generates a <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#show"><code>show</code></a> event when it is shown and a <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#hide"><code>hide</code></a> event when it is hidden.</p>
+
+<p>Once you've finished using the sidebar you can destroy it by calling its <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#dispose()"><code>dispose()</code></a> method.</p>
+
+<p>To show what a sidebar looks like, here's a sidebar that displays the results of running the <a href="http://validator.w3.org/">W3C Validator</a> on the current page:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6669/sidebar.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h3 id="Specifying_sidebar_content">Specifying sidebar content</h3>
+
+<p>O conteúdo de uma barra lateral é especificado usando HTML, que é carregado a partir da URL fornecida na opção url do construtor da barra lateral. Ao contrário de módulos como <a href="/en-US/Add-ons/SDK/High-Level_APIs/panel"><code>panel</code></a>,  o conteúdo deve ser local, normalmente carregado do diretório de dados ('data') da extensão, através de um URL contruída usando <a href="/en-US/Add-ons/SDK/High-Level_APIs/self#data"><code>self.data.url()</code></a>:</p>
+
+<pre class="brush: js">var sidebar = require("sdk/ui/sidebar").Sidebar({
+  id: 'my-sidebar',
+  title: 'My sidebar',
+  url: require("sdk/self").data.url("sidebar.html")
+});</pre>
+
+<div class="note">
+<p>From Firefox 34, you can use <code>"./sidebar.html"</code> as an alias for <code>self.data.url("sidebar.html")</code>. So you can rewrite the above code like this:</p>
+
+<pre class="brush: js">var sidebar = require("sdk/ui/sidebar").Sidebar({
+  id: 'my-sidebar',
+  title: 'My sidebar',
+  url: "./sidebar.html"
+});</pre>
+</div>
+
+<p>Você pode incluir JavaScript e CSS no HTML como faria com qualquer página da web, por exemplo, usando tags &lt;script&gt; e &lt;link&gt; contendo o caminho relativo ao próprio arquivo HTML.</p>
+
+<pre class="brush: html">&lt;!DOCTYPE HTML&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;link href="stuff.css" type="text/css" rel="stylesheet"&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;script type="text/javascript" src="stuff.js"&gt;&lt;/script&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+
+</pre>
+
+<p>You can update the sidebar's content by setting the sidebar's <code>url</code> property. This will change the sidebar's content across all windows.</p>
+
+<h3 id="Communicating_with_sidebar_scripts">Communicating with sidebar scripts</h3>
+
+<p>You can't directly access your sidebar's content from your main add-on code, but you can send messages between your main add-on code and scripts loaded into your sidebar.</p>
+
+<p>On the sidebar end of the conversation, sidebar scripts get a global variable <code>addon</code> that contains a <code>port</code> for sending and receiving messages.</p>
+
+<p>On the add-on side, you need to get a <code>worker</code> object for the sidebar before you can send or receive messages. There are two events emitted by the sidebar which will give you a worker: <code>attach</code> and <code>ready</code>. Listen to <code>attach</code> if the first message in your add-on goes from the sidebar scripts to the main add-on code, and listen to <code>ready</code> if the first message goes from the main add-on code to the sidebar script.</p>
+
+<h4 id="Using_attach">Using attach</h4>
+
+<p>The  <code>attach</code> event is triggered whenever the DOM for a new sidebar instance is loaded and its scripts are attached. The sidebar script may not be initialized yet, so you can't reliably send messages to the sidebar script right away: however, you can start listening to messages from the script.</p>
+
+<p>Here's a simple but complete add-on that shows how to set up communication between main.js and a script in a sidebar, in the case where the sidebar script initiates communication:</p>
+
+<p>The HTML file includes just a script, "sidebar.js":</p>
+
+<pre class="brush: html">&lt;!DOCTYPE HTML&gt;
+&lt;html&gt;
+  &lt;body&gt;
+    Content for my sidebar
+    &lt;script type="text/javascript" src="sidebar.js"&gt;&lt;/script&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+
+</pre>
+
+<p>The "sidebar.js" file sends a <code>ping</code> message to main.js using <code>port.emit()</code> as soon as it loads, and adds a listener to the <code>pong</code> message.</p>
+
+<pre class="brush: js">addon.port.emit("ping");
+
+addon.port.on("pong", function() {
+  console.log("sidebar script got the reply");
+});</pre>
+
+<p>The "main.js" file creates a sidebar object and adds a listener to its <code>attach</code> event. On attach, "main.js" starts listening to the <code>ping</code> message, and responds with a <code>pong</code>:</p>
+
+<pre class="brush: js">var sidebar = require("sdk/ui/sidebar").Sidebar({
+  id: 'my-sidebar',
+  title: 'My sidebar',
+  url: require("sdk/self").data.url("sidebar.html"),
+  onAttach: function (worker) {
+    worker.port.on("ping", function() {
+      console.log("add-on script got the message");
+      worker.port.emit("pong");
+    });
+  }
+});</pre>
+
+<p>Try running the add-on, and showing the sidebar using the "View-&gt;Sidebar-&gt;My sidebar" menu item. You should see console output like:</p>
+
+<pre>console.log: add-on: add-on script got the message
+console.log: add-on: sidebar script got the reply
+</pre>
+
+<h4 id="Using_ready">Using ready</h4>
+
+<p>The <code>ready</code> event is emitted when the DOM for the sidebar's content is ready. It is equivalent to the <code>DOMContentLoaded</code> event. At this point the sidebar script is initialized, so you  can send messages to the sidebar script and be confident that they will not be lost. Listen to this event if your add-on initiates the conversation.</p>
+
+<p>Here's a simple but complete add-on that shows how to set up communication between main.js and a script in a sidebar, in the case where the main.js script initiates communication:</p>
+
+<p>The HTML file includes just a script, "sidebar.js":</p>
+
+<pre class="brush: html">&lt;!DOCTYPE HTML&gt;
+&lt;html&gt;
+  &lt;body&gt;
+    Content for my sidebar
+    &lt;script type="text/javascript" src="sidebar.js"&gt;&lt;/script&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+
+</pre>
+
+<p>The "sidebar.js" file listens to the <code>ping</code> message from main.js, and responds with a <code>pong</code> message.</p>
+
+<pre class="brush: js">addon.port.on("ping", function() {
+  console.log("sidebar script got the message");
+  addon.port.emit("pong");
+});</pre>
+
+<p>The "main.js" file creates a sidebar object and adds a listener to its <code>attach</code> event. On attach, "main.js" sends the <code>ping</code> message, and starts listening for the <code>pong</code>:</p>
+
+<pre class="brush: js">var sidebar = require("sdk/ui/sidebar").Sidebar({
+  id: 'my-sidebar',
+  title: 'My sidebar',
+  url: require("sdk/self").data.url("sidebar.html"),
+  onReady: function (worker) {
+    worker.port.emit("ping");
+    worker.port.on("pong", function() {
+      console.log("add-on script got the reply");
+    });
+  }
+});</pre>
+
+<p>Try running the add-on, and showing the sidebar using the "View-&gt;Sidebar-&gt;My sidebar" menu item. You should see console output like:</p>
+
+<pre>console.log: add-on: sidebar script got the message
+console.log: add-on: add-on script got the reply
+</pre>
+
+<p> </p>
+
+<h2 id="Globals">Globals</h2>
+
+<h3 id="Constructors">Constructors</h3>
+
+<h4 class="addon-sdk-api-name" id="Sidebar(options)"><code>Sidebar(options)</code></h4>
+
+<p>Creates a sidebar.</p>
+
+<pre class="brush: js">var sidebar = require("sdk/ui/sidebar").Sidebar({
+  id: 'my-sidebar',
+  title: 'My sidebar',
+  url: require("sdk/self").data.url("sidebar.html"),
+  onAttach: function (worker) {
+    console.log("attaching");
+  },
+  onShow: function () {
+    console.log("showing");
+  },
+  onHide: function () {
+    console.log("hiding");
+  },
+  onDetach: function () {
+    console.log("detaching");
+  }
+});</pre>
+
+<h5 id="Parameters">Parameters</h5>
+
+<p><strong>options : object</strong><br>
+ Required options:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>title</td>
+   <td>string</td>
+   <td>
+    <p>A title for the sidebar. This will be used for the label for your sidebar in the "Sidebar" submenu in Firefox, and will be shown at the top of your sidebar when it is open.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>url</td>
+   <td>string</td>
+   <td>
+    <p>The URL of the content to load in the sidebar. This must be a local URL (typically, loaded from the "data" folder using <code>self.data.url()</code>).</p>
+
+    <div class="note">
+    <p>From Firefox 34, you can use <code>"./myFile.html"</code> as an alias for <code>self.data.url("myFile.html")</code>.</p>
+    </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Optional options:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>id</td>
+   <td>string</td>
+   <td>
+    <p>The <code>id</code> of the sidebar. This used to identify this sidebar in its chrome window. It must be unique.</p>
+
+    <div class="geckoVersionNote">
+    <p>This option was mandatory before Firefox 28.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td>onAttach</td>
+   <td>function</td>
+   <td>
+    <p>Listener for the sidebar's <code>attach</code> event.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onDetach</td>
+   <td>function</td>
+   <td>
+    <p>Listener for the sidebar's <code>detach</code> event.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onShow</td>
+   <td>function</td>
+   <td>
+    <p>Listener for the sidebar's <code>show</code> event.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>onHide</td>
+   <td>function</td>
+   <td>
+    <p>Listener for the sidebar's <code>hide</code> event.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Sidebar">Sidebar</h2>
+
+<p>The Sidebar object. Once a sidebar has been created it can be shown and hidden in the active window using its <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#show()"><code>show()</code></a> and <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#hide()"><code>hide()</code></a> methods. Once a sidebar is no longer needed it can be destroyed using <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#dispose()"><code>dispose()</code></a>.</p>
+
+<h3 id="Methods">Methods</h3>
+
+<h4 class="addon-sdk-api-name" id="dispose()"><code>dispose()</code></h4>
+
+<p>Destroys the sidebar. Once destroyed, the sidebar can no longer be used.</p>
+
+<h4 class="addon-sdk-api-name" id="show(window)"><code>show(window)</code></h4>
+
+<p>Displays the sidebar.</p>
+
+<h5 id="Parameters_2">Parameters</h5>
+
+<p><strong>window : BrowserWindow</strong><br>
+ The window in which to show the sidebar, specified as a <a href="/en-US/Add-ons/SDK/High-Level_APIs/windows#BrowserWindow"><code>BrowserWindow</code></a>. This parameter is optional. If it is omitted, then the sidebar will be shown in the currently active window. This parameter is new in Firefox 33.</p>
+
+<h4 class="addon-sdk-api-name" id="hide(window)"><code>hide(window)</code></h4>
+
+<p>Hides the sidebar.</p>
+
+<h5 id="Parameters_3">Parameters</h5>
+
+<p><strong>window : BrowserWindow</strong><br>
+ The window for which to hide the sidebar, specified as a <a href="/en-US/Add-ons/SDK/High-Level_APIs/windows#BrowserWindow"><code>BrowserWindow</code></a>. This parameter is optional. If it is omitted, then the sidebar will be hidden for the currently active window. This parameter is new in Firefox 33.</p>
+
+<h4 class="addon-sdk-api-name" id="on(type_listener)"><code>on(type, listener)</code></h4>
+
+<p>Registers an event listener with the sidebar.</p>
+
+<h5 id="Parameters_4">Parameters</h5>
+
+<p><strong>type : string</strong><br>
+ The type of event to listen for.</p>
+
+<p><strong>listener : function</strong><br>
+ The listener function that handles the event.</p>
+
+<h4 class="addon-sdk-api-name" id="once(type_listener)"><code>once(type, listener)</code></h4>
+
+<p>Registers an event listener with the sidebar. The difference between <code>on</code> and <code>once</code> is that <code>on</code> will continue listening until it is removed, whereas <code>once</code> is removed automatically upon the first event it catches.</p>
+
+<h5 id="Parameters_5">Parameters</h5>
+
+<p><strong>type : string</strong><br>
+ The type of event to listen for.</p>
+
+<p><strong>listener : function</strong><br>
+ The listener function that handles the event.</p>
+
+<h4 class="addon-sdk-api-name" id="removeListener(type_listener)"><code>removeListener(type, listener)</code></h4>
+
+<p>Unregisters/removes an event listener from the sidebar.</p>
+
+<h5 id="Parameters_6">Parameters</h5>
+
+<p><strong>type : string</strong><br>
+ The type of event for which <code>listener</code> was registered.</p>
+
+<p><strong>listener : function</strong><br>
+ The listener function that was registered.</p>
+
+<h3 id="Properties">Properties</h3>
+
+<h4 class="addon-sdk-api-name" id="id"><code>id</code></h4>
+
+<p>The id of the sidebar. This used to identify this sidebar in its chrome window. It must be unique.</p>
+
+<h4 class="addon-sdk-api-name" id="title"><code>title</code></h4>
+
+<p>The title of the sidebar. This will be used for the label for your sidebar in the "Sidebar" submenu in Firefox, and will be shown at the top of your sidebar when it is open.</p>
+
+<h4 class="addon-sdk-api-name" id="url"><code>url</code></h4>
+
+<p>The URL of the content to load in the sidebar. This must be a local URL (typically, loaded from the "data" folder using <code>self.data.url()</code>).</p>
+
+<h3 id="Events">Events</h3>
+
+<h4 class="addon-sdk-api-name" id="attach"><code>attach</code></h4>
+
+<p>This event is emitted when a worker is attached to a sidebar, as a result of any of the following:</p>
+
+<ul>
+ <li>calling the sidebar's <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#show()"><code>show()</code></a> method, when the sidebar is not shown in the currently active window</li>
+ <li>changing the sidebar's <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#url"><code>url</code></a> property</li>
+ <li>the user switching the sidebar on using the "Sidebar" submenu in Firefox, when the sidebar is not shown in the currently active window</li>
+ <li>the user opening a new window from a window that has the sidebar showing</li>
+</ul>
+
+<p>It is passed a <a href="/en-US/Add-ons/SDK/Low-Level_APIs/content_worker"><code>worker</code></a> as an argument, which defines <code>port.emit()</code> and <code>port.on()</code> methods that you can use to send messages to, and receive messages from, scripts loaded into the sidebar.</p>
+
+<p>This is the event you should listen to if your main add-on code needs to communicate with the scripts loaded into the sidebar, and the sidebar scripts start the conversation.</p>
+
+<p>See <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#Using_attach">Using attach</a> for an example.</p>
+
+<h4 class="addon-sdk-api-name" id="ready"><code>ready</code></h4>
+
+<p>This event is emitted after the DOM content for a sidebar has been loaded, as a result of any of:</p>
+
+<ul>
+ <li>calling the sidebar's <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#show()"><code>show()</code></a> method, when the sidebar is not shown in the currently active window</li>
+ <li>changing the sidebar's <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#url"><code>url</code></a> property</li>
+ <li>the user switching the sidebar on using the "Sidebar" submenu in Firefox, when the sidebar is not shown in the currently active window</li>
+ <li>the user opening a new window from a window that has the sidebar showing</li>
+</ul>
+
+<p>It is passed a <a href="/en-US/Add-ons/SDK/Low-Level_APIs/content_worker"><code>worker</code></a> as an argument, which defines <code>port.emit()</code> and <code>port.on()</code> methods that you can use to send messages to, and receive messages from, scripts loaded into the sidebar.</p>
+
+<p>This is the event you should listen to if your main add-on code needs to communicate with the scripts loaded into the sidebar and the main add-on code starts the conversation.</p>
+
+<p>See <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#Using_ready">Using ready</a> for an example.</p>
+
+<h4 class="addon-sdk-api-name" id="detach"><code>detach</code></h4>
+
+<p>This event is emitted when a worker is detached from a sidebar, as a result of either of the following:</p>
+
+<ul>
+ <li>calling the sidebar's <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#hide()"><code>hide()</code></a> method, when the sidebar is being shown in the currently active window</li>
+ <li>the user switching the sidebar off using the "Sidebar" submenu in Firefox, when the sidebar is being shown in the currently active window</li>
+</ul>
+
+<p>The <code>detach</code> listener receives a <a href="/en-US/Add-ons/SDK/Low-Level_APIs/content_worker"><code>worker</code></a> object as a parameter. This object is the same as the worker passed into the corresponding <code>attach</code> event. After <code>detach</code>, this worker can no longer be used to communicate with the scripts in that sidebar instance, because it has been unloaded.</p>
+
+<p>If you listen to <code>attach</code>, and in the listener take a reference to the worker object that's passed into it, so you can send it messages later on, then you should probably listen to <code>detach</code>, and in its handler, remove your reference to the worker.</p>
+
+<p>Here's an add-on that adds each worker to an array in the <code>attach</code> handler, and makes sure that its references are cleaned up by listening to <code>detach</code> and removing workers as they are detached:</p>
+
+<pre class="brush: js">var workerArray = [];
+
+function attachWorker(worker) {
+  workerArray.push(worker);
+}
+
+function detachWorker(worker) {
+  var index = workerArray.indexOf(worker);
+  if(index != -1) {
+    workerArray.splice(index, 1);
+  }
+}
+
+var sidebar = require("sdk/ui/sidebar").Sidebar({
+  id: 'my-sidebar',
+  title: 'My Sidebar',
+  url: require("sdk/self").data.url("sidebar.html"),
+  onAttach: attachWorker,
+  onDetach: detachWorker
+});</pre>
+
+<h4 class="addon-sdk-api-name" id="show"><code>show</code></h4>
+
+<p>This event is emitted when the sidebar is shown, as a result of any of the following:</p>
+
+<ul>
+ <li>calling the sidebar's <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#show()"><code>show()</code></a> method, when the sidebar is not shown in the currently active window</li>
+ <li>changing the sidebar's <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#url"><code>url</code></a> property</li>
+ <li>the user switching the sidebar on using the "Sidebar" submenu in Firefox, when the sidebar is not shown in the currently active window</li>
+ <li>the user opening a new window from a window that has the sidebar showing</li>
+</ul>
+
+<h4 class="addon-sdk-api-name" id="hide"><code>hide</code></h4>
+
+<p>This event is emitted when the sidebar is hidden, as a result of either of the following:</p>
+
+<ul>
+ <li>calling the sidebar's <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_sidebar#hide()"><code>hide()</code></a> method, when the sidebar is being shown in the currently active window</li>
+ <li>the user switching the sidebar off using the "Sidebar" submenu in Firefox, when the sidebar is being shown in the currently active window</li>
+</ul>
diff --git a/files/pt-br/mozilla/add-ons/sdk/low-level_apis/window_utils/index.html b/files/pt-br/mozilla/add-ons/sdk/low-level_apis/window_utils/index.html
new file mode 100644
index 0000000000..5ceef79058
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/low-level_apis/window_utils/index.html
@@ -0,0 +1,386 @@
+---
+title: window/utils
+slug: Mozilla/Add-ons/SDK/Low-Level_APIs/window_utils
+translation_of: Archive/Add-ons/Add-on_SDK/Low-Level_APIs/window_utils
+---
+<div class="note">
+<p>Unstable</p>
+</div>
+
+<div class="note">
+<p>Note that this module includes functions that give you direct access to web content. These functions are not safe to call in multiprocess Firefox. See <a href="/en-US/Add-ons/SDK/Guides/Multiprocess_Firefox_and_the_SDK">Multiprocess Firefox and the SDK</a> for more details.</p>
+</div>
+
+<p><span class="seoSummary">Functions for working with browser windows.</span></p>
+
+<h2 id="Usage">Usage</h2>
+
+<h3 id="Private_windows">Private windows</h3>
+
+<p>With this module your add-on will see private browser windows even if it has not explicitly opted into private browsing, so you need to take care not to store any user data derived from private browser windows.<br>
+ <br>
+ The exception is the windows() function which returns an array of currently opened windows. Private windows will not be included in this list if your add-on has not opted into private browsing.<br>
+ <br>
+ To learn more about private windows, how to opt into private browsing, and how to support private browsing, refer to the documentation for the private-browsing module.</p>
+
+<h2 id="Globals">Globals</h2>
+
+<h3 id="Functions">Functions</h3>
+
+<h4 class="addon-sdk-api-name" id="getMostRecentBrowserWindow()"><code>getMostRecentBrowserWindow()</code></h4>
+
+<p>Get the topmost browser window, as an nsIDOMWindow instance.</p>
+
+<h5 id="Returns">Returns</h5>
+
+<p><strong>nsIDOMWindow</strong>: the topmost browser window.</p>
+
+<h4 class="addon-sdk-api-name" id="getInnerId(window)"><code>getInnerId(window)</code></h4>
+
+<p>Returns the ID of the specified window's current inner window. This function wraps nsIDOMWindowUtils.currentInnerWindowID.</p>
+
+<h5 id="Parameters">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong><br>
+ The window whose inner window we are interested in.</p>
+
+<h5 id="Returns_2">Returns</h5>
+
+<p><strong>ID</strong>: the given window's ID.</p>
+
+<h4 class="addon-sdk-api-name" id="getOuterId(window)"><code>getOuterId(window)</code></h4>
+
+<p>Returns the ID of the specified window's outer window. This function wraps nsIDOMWindowUtils.outerWindowID.</p>
+
+<h5 class="addon-sdk-api-name" id="Parameters_2">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong><br>
+ The window whose outer window we are interested in.</p>
+
+<h5 id="Returns_3">Returns</h5>
+
+<p><strong>ID</strong>: the outer window's ID.</p>
+
+<h4 class="addon-sdk-api-name" id="getXULWindow(window)"><code>getXULWindow(window)</code></h4>
+
+<p>Returns the nsIXULWindow for the given nsIDOMWindow:</p>
+
+<pre class="brush: js">var { Ci } = require('chrome');
+var utils = require('sdk/window/utils');
+var active = utils.getMostRecentBrowserWindow();
+active instanceof Ci.nsIXULWindow // =&gt; false
+utils.getXULWindow(active) instanceof Ci.nsIXULWindow // =&gt; true</pre>
+
+<h5 id="Parameters_3">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong></p>
+
+<h5 id="Returns_4">Returns</h5>
+
+<p><strong>nsIXULWindow</strong></p>
+
+<h4 class="addon-sdk-api-name" id="getBaseWindow(window)"><code>getBaseWindow(window)</code></h4>
+
+<p>Returns the nsIBaseWindow for the given nsIDOMWindow:</p>
+
+<pre class="brush: js">var { Ci } = require('chrome');
+var utils = require('sdk/window/utils');
+var active = utils.getMostRecentBrowserWindow();
+active instanceof Ci.nsIBaseWindow // =&gt; false
+utils.getBaseWindow(active) instanceof Ci.nsIBaseWindow // =&gt; true</pre>
+
+<h5 id="Parameters_4">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong></p>
+
+<h5 id="Returns_5">Returns</h5>
+
+<p><strong>nsIBaseWindow</strong></p>
+
+<h4 class="addon-sdk-api-name" id="getToplevelWindow(window)"><code>getToplevelWindow(window)</code></h4>
+
+<p>Returns the toplevel nsIDOMWindow for the given child nsIDOMWindow:</p>
+
+<pre class="brush: js">var { Ci } = require('chrome');
+var utils = require('sdk/window/utils');
+var browserWindow = utils.getMostRecentBrowserWindow();
+var window = browserWindow.content; // `window` object for the current webpage
+utils.getToplevelWindow(window) == browserWindow // =&gt; true</pre>
+
+<h5 id="Parameters_5">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong></p>
+
+<h5 id="Returns_6">Returns</h5>
+
+<p><strong>nsIDOMWindow</strong></p>
+
+<h4 class="addon-sdk-api-name" id="getWindowDocShell(window)"><code>getWindowDocShell(window)</code></h4>
+
+<p>Returns the nsIDocShell for the tabbrowser element.</p>
+
+<h5 id="Parameters_6">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong></p>
+
+<h5 id="Returns_7">Returns</h5>
+
+<p><strong>nsIDocShell</strong></p>
+
+<h4 class="addon-sdk-api-name" id="getWindowLoadingContext(window)"><code>getWindowLoadingContext(window)</code></h4>
+
+<p>Returns the nsILoadContext.</p>
+
+<h5 id="Parameters_7">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong></p>
+
+<h5 id="Returns_8">Returns</h5>
+
+<p><strong>nsILoadContext</strong></p>
+
+<h4 class="addon-sdk-api-name" id="open(uri_options)"><code>open(uri, options)</code></h4>
+
+<p>This function is used to open top level (application) windows. It takes the uri of the window document as its first argument and an optional hash of options as its second argument.</p>
+
+<pre class="brush: js">var { open } = require('sdk/window/utils');
+var window = open('data:text/html,Hello Window');</pre>
+
+<p>This function wraps <a href="/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIWindowWatcher">nsIWindowWatcher</a>.openWindow.</p>
+
+<h5 id="Parameters_8">Parameters</h5>
+
+<p><strong>uri : string</strong><br>
+ URI of the document to be loaded into the window.  Only chrome, resource, and data schemes are accepted.</p>
+
+<p><strong>options : object</strong><br>
+ Options for the function, with the following properties:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>parent</td>
+   <td>nsIDOMWindow</td>
+   <td>Parent for the new window. Optional, defaults to null.</td>
+  </tr>
+  <tr>
+   <td>name</td>
+   <td>string</td>
+   <td>Name that is assigned to the window. Optional, defaults to null.</td>
+  </tr>
+  <tr>
+   <td>features</td>
+   <td>object</td>
+   <td>
+    <p>Map of features to set for the window, defined like this: { width: 10, height: 15, chrome: true }.</p>
+
+    <p>See the window.open features documentation for more details.</p>
+
+    <p>Optional, defaults to an empty map: {}.</p>
+
+    <pre class="brush: js">
+var { open } = require('sdk/window/utils');
+var window = open('data:text/html,Hello Window', {
+  name: 'jetpack window',
+  features: {
+    width: 200,
+    height: 50,
+    popup: true
+  }
+});</pre>
+   </td>
+  </tr>
+  <tr>
+   <td>args</td>
+   <td>object</td>
+   <td>Extra argument(s) to be attached to the new window as the window.arguments property.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h5 id="Returns_9"><br>
+ Returns</h5>
+
+<p><strong>nsIDOMWindow</strong></p>
+
+<h4 class="addon-sdk-api-name" id="openDialog(options)"><code>openDialog(options)</code></h4>
+
+<p>Opens a top level window and returns its nsIDOMWindow representation. This is the same as open, but you can supply more features. It wraps window.openDialog.</p>
+
+<h5 id="Parameters_9">Parameters</h5>
+
+<p><strong>options : object</strong><br>
+ Options for the function, with the following properties:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>url</td>
+   <td>string</td>
+   <td>URI of the document to be loaded into the window. Defaults to "chrome://browser/content/browser.xul".</td>
+  </tr>
+  <tr>
+   <td>name</td>
+   <td>string</td>
+   <td>Optional name that is assigned to the window. Defaults to "_blank".</td>
+  </tr>
+  <tr>
+   <td>features</td>
+   <td>string</td>
+   <td>
+    <p>Map of features to set for the window, defined like: { width: 10, height: 15, chrome: true }.</p>
+
+    <p>For the set of features you can set, see the window.openDialog documentation.</p>
+
+    <p>Optional, defaults to: 'chrome,all,dialog=no'.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>args</td>
+   <td>object</td>
+   <td>Extra argument(s) to be attached to the new window as the window.arguments property.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h5 id="Returns_10">Returns</h5>
+
+<p><strong>nsIDOMWindow</strong></p>
+
+<h4 class="addon-sdk-api-name" id="windows()"><code>windows()</code></h4>
+
+<p>Returns an array of all currently opened windows. Note that these windows may still be loading.</p>
+
+<p>In order to see private windows in this list, your add-on must have <a href="/en-US/Add-ons/SDK/High-Level_APIs/private-browsing#Opting_into_private_browsing">opted into private browsing</a> and you must include the <code>includePrivate</code> key in the list of options:</p>
+
+<pre class="brush: js">  var allWindows = window_utils.windows(null, {includePrivate:true});
+</pre>
+
+<h5 id="Parameters_10">Parameters</h5>
+
+<p><strong>type : string</strong><br>
+ String identifying the type of window to return. This is passed directly into <a href="/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIWindowMediator#getEnumerator()"><code>nsIWindowMediator.getEnumerator()</code></a>, so its possible values are the same as those expected by that function. In particular:</p>
+
+<ul>
+ <li><code>null</code>: get all window types</li>
+ <li><code>navigator:browser</code>: get "normal" browser windows</li>
+ <li><code>devtools:scratchpad</code>: get <a href="/en-US/docs/Tools/Scratchpad">Scratchpad</a> windows</li>
+ <li><code>navigator:view-source</code>: get <a href="/en-US/docs/View_source">view source</a> windows</li>
+</ul>
+
+<p>If you're not also passing options, you can omit this, and it's the same as passing <code>null</code>.</p>
+
+<p><strong>options : object</strong><br>
+ Options object containing the following property:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Name</th>
+   <th scope="col">Type</th>
+   <th scope="col"> </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>includePrivate</td>
+   <td>boolean</td>
+   <td>Whether to include private windows. Defaults to false. The add-on must also have opted into private windows for this to have an effect.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h5 id="Returns_11">Returns</h5>
+
+<p><strong>Array</strong>: array of nsIDOMWindow instances.</p>
+
+<h4 class="addon-sdk-api-name" id="isDocumentLoaded(window)"><code>isDocumentLoaded(window)</code></h4>
+
+<p>Check if the given window's document is completely loaded. This means that its "load" event has been fired and all content is loaded, including the whole DOM document, images, and any other sub-resources.</p>
+
+<h5 id="Parameters_11">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong></p>
+
+<h5 id="Returns_12">Returns</h5>
+
+<p><strong>boolean</strong>: true if the document is completely loaded.</p>
+
+<h4 class="addon-sdk-api-name" id="isBrowser(window)"><code>isBrowser(window)</code></h4>
+
+<p>Returns true if the given window is a Firefox browser window: that is, its document has a "windowtype" of "chrome://browser/content/browser.xul".</p>
+
+<h5 id="Parameters_12">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong></p>
+
+<h5 id="Returns_13">Returns</h5>
+
+<p><strong>boolean</strong></p>
+
+<h4 class="addon-sdk-api-name" id="getWindowTitle(window)"><code>getWindowTitle(window)</code></h4>
+
+<p>Get the title of the document hosted by the given window</p>
+
+<h5 id="Parameters_13">Parameters</h5>
+
+<p><strong>window: nsIDOMWindow</strong></p>
+
+<h5 id="Returns_14">Returns</h5>
+
+<p><strong>string</strong>: this document's title.</p>
+
+<h4 class="addon-sdk-api-name" id="isXULBrowser(window)"><code>isXULBrowser(window)</code></h4>
+
+<p>Returns true if the given window is a XUL window.</p>
+
+<h5 id="Parameters_14">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong></p>
+
+<h5 id="Returns_15">Returns</h5>
+
+<p><strong>boolean</strong></p>
+
+<h4 class="addon-sdk-api-name" id="getFocusedWindow()"><code>getFocusedWindow()</code></h4>
+
+<p>Gets the child window within the topmost browser window that is focused. See nsIFocusManager for more details.</p>
+
+<h5 id="Returns_16">Returns</h5>
+
+<p><strong>nsIDOMWindow</strong></p>
+
+<h4 class="addon-sdk-api-name" id="getFocusedElement()"><code>getFocusedElement()</code></h4>
+
+<p>Get the element that is currently focused. This will always be an element within the document loaded in the focused window, or null if no element in that document is focused.</p>
+
+<h5 id="Returns_17">Returns</h5>
+
+<p><strong>nsIDOMElement</strong></p>
+
+<h4 class="addon-sdk-api-name" id="getFrames(window)"><code>getFrames(window)</code></h4>
+
+<p>Get the frames contained by the given window.</p>
+
+<h5 id="Parameters_15">Parameters</h5>
+
+<p><strong>window : nsIDOMWindow</strong></p>
+
+<h5 id="Returns_18">Returns</h5>
+
+<p><strong>array</strong>: array of frames.<br>
+  </p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/abra_uma_página_web/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/abra_uma_página_web/index.html
new file mode 100644
index 0000000000..defcedcee2
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/abra_uma_página_web/index.html
@@ -0,0 +1,51 @@
+---
+title: Abra uma Página Web
+slug: Mozilla/Add-ons/SDK/Tutorials/Abra_uma_Página_Web
+tags:
+  - Add-on SDK
+  - Tab
+  - runScript
+  - tab.attach
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Open_a_Web_Page
+---
+<div class="note">Para seguir este tutorial você precisará ter <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Installation">instalado o SDK</a> e ter conhecimento básico <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Getting_Started_With_cfx">sobre cfx</a>.</div>
+
+<p>Para abrir uma página web, você pode usar o módulo <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs"><code>tabs</code></a>:</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+tabs.open("http://www.example.com");
+</pre>
+
+<p>Esta função é <span class="short_text" id="result_box" lang="pt"><span class="hps">assíncrona</span></span>, então você não recebe imediatamente um objeto <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs#Tab"><code>tab</code></a> que você possa examinar. Faça isto, passe uma função de retorno para <code>open()</code>. A função de retorno é atribuída a propriedade <code>onReady</code>, e será passada a tab como argumento:</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+tabs.open({
+  url: "http://www.example.com",
+  onReady: function onReady(tab) {
+    console.log(tab.title);
+  }
+});
+</pre>
+
+<p>Mesmo assim, você não consegue acesso direto a qualquer conteúdo hospedado na tab.</p>
+
+<p>Para acessar conteúdo da tab você precisa anexar um script à tab usando o <code>tab.attach()</code>. Este add-on carrega uma página, então anexa um script à página que adiciona uma borda vermelha nela:</p>
+
+<pre class="brush: js">var tabs = require("sdk/tabs");
+tabs.open({
+  url: "http://www.example.com",
+  onReady: runScript
+});
+
+function runScript(tab) {
+  tab.attach({
+    contentScript: "document.body.style.border = '5px solid red';"
+  });
+}
+</pre>
+
+<h2 id="Aprendendo_Mais">Aprendendo Mais</h2>
+
+<p>Para aprender mais sobre uso de tabs no SDK, veja a referência da API <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs"><code>tabs</code></a>.</p>
+
+<p>Para aprender mais sobre execução de scripts em tabs, veja o tutorial sobre uso de <a href="/en-US/Add-ons/SDK/Tutorials/Modifying_the_Page_Hosted_by_a_Tab"><code>tab.attach()</code></a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/adding_a_button_to_the_toolbar/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/adding_a_button_to_the_toolbar/index.html
new file mode 100644
index 0000000000..83b2f61907
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/adding_a_button_to_the_toolbar/index.html
@@ -0,0 +1,83 @@
+---
+title: Adicionando um botão à barra de ferramentas
+slug: Mozilla/Add-ons/SDK/Tutorials/Adding_a_Button_to_the_Toolbar
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Adding_a_Button_to_the_Toolbar
+---
+<div class="note">
+<p>Para seguir este tutorial você precisará ter <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Installation">instalado o SDK</a> e ter conhecimento <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Getting_Started_With_cfx">básico do cfx</a>.</p>
+
+<p>Este tutorial usa a API <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a>, que está disponível somente do Firefox 29 em diante.</p>
+</div>
+
+<p>Para adicionar um botão à barra de ferramentas, use os módulos <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a> ou <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_toggle">toggle button</a>.</p>
+
+<p>Crie um novo diretório, navegue até ele, e execute <code>cfx init</code>.</p>
+
+<p>Então salve estes três ícones no diretório "data":</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7635/icon-16.png" style="height: 16px; width: 16px;"></td>
+   <td>icon-16.png</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7637/icon-32.png" style="height: 32px; width: 32px;"></td>
+   <td>icon-32.png</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7639/icon-64.png" style="height: 64px; width: 64px;"></td>
+   <td>icon-64.png</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Então abra o arquivo chamado "main.js" no diretório "lib" e adicione o seguinte código a ele:</p>
+
+<pre class="brush: js">var buttons = require('sdk/ui/button/action');
+var tabs = require("sdk/tabs");
+
+var button = buttons.ActionButton({
+  id: "mozilla-link",
+  label: "Visit Mozilla",
+  icon: {
+    "16": "./icon-16.png",
+    "32": "./icon-32.png",
+    "64": "./icon-64.png"
+  },
+  onClick: handleClick
+});
+
+function handleClick(state) {
+  tabs.open("https://www.mozilla.org/");
+}</pre>
+
+<p>Agora execute o add-on com <code>cfx run</code>. O botão é adicionado à barra de ferramentas no topo da janela do navegador:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7641/mozilla-button.png" style="display: block; height: 221px; margin-left: auto; margin-right: auto; width: 382px;">Você não pode configurar a localização inicial para o botão, mas o usuário pode mover ele usando as características de personalização do navegador. O <code>id</code> é obrigatório, e é usado para lembrar a posição do botão, então você não deve mudá-lo em versões subsequentes do add-on.</p>
+
+<p>Clicando no botão carrega <a href="https://www.mozilla.org/en-US/">https://www.mozilla.org/</a> em uma nova tab.</p>
+
+<h2 id="Especificando_o_ícone">Especificando o ícone</h2>
+
+<p>A propriedade ícone pode especificar um único ícone ou uma coleção de ícones em diferentes tamanhos, como o exemplo acima. Se você especificar uma coleção de ícones em diferentes tamanhos o navegador automaticamente escolherá o melhor para a resolução de tela em uso e coloca na interface de usuário do navegador que hospeda o botão. <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action#ActionButton(options)">Leia mais sobre especificar múltiplos ícones</a>.</p>
+
+<p>O arquivo de ícone deve ser empacotado com seu add-on: ele não pode referenciar um arquivo remoto.</p>
+
+<p>Você pode mudar o ícone a qualquer hora configurando a propriedade <code>icon</code> do botão. Você pode mudar o ícone, e os outros atributos de estado, ou globalmente, para uma janela específica, ou para uma tab específica. <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action#Updating_state">Leia mais sobre atualização de estado.</a></p>
+
+<h2 id="Anexando_um_painel">Anexando um painel</h2>
+
+<p>Se você precisar anexar um panel a um botão, use a API <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_toggle">toggle button</a>. É como a API do action button exceto que ele adiciona uma propriedade boleana <code>checked </code>que é alternada sempre que o botão é checado. Para anexar o painel, passe o método <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/panel#show(options)"><code>show()</code></a> do painel. Para mais detalhes sobre isso, veja a <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_toggle#Attaching_panels_to_buttons">documentação do toggle button</a>.</p>
+
+<h2 id="Mostrando_conteúdo_mais_rico">Mostrando conteúdo mais rico</h2>
+
+<p>Para criar conteúdo mais complexo para a interface do usuário do que é possível com apenas um botão, use a API <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_toolbar">toolbar</a>. Com a API toolbar você consegue uma faixa horizontal da interface do usuário. Você pode adicionar botões à barra de ferramentas e também <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_frame">frames</a>, que podem ter HTML, CSS, e JavaScript.</p>
+
+<h2 id="Aprendendo_mais">Aprendendo mais</h2>
+
+<ul>
+ <li><a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">Referência action button</a></li>
+ <li><a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">Referência </a><a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_toggle">toggle button</a></li>
+ <li><a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">Referência </a><a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_toolbar">toolbar</a></li>
+</ul>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/adicionar_uma_item_de_menu_ao_firefox/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/adicionar_uma_item_de_menu_ao_firefox/index.html
new file mode 100644
index 0000000000..ebc4e41846
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/adicionar_uma_item_de_menu_ao_firefox/index.html
@@ -0,0 +1,115 @@
+---
+title: Adicionar um item de menu ao Firefox
+slug: Mozilla/Add-ons/SDK/Tutorials/Adicionar_uma_item_de_menu_ao_Firefox
+tags:
+  - Add-on SDK
+  - Menu Item
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Add_a_Menu_Item_to_Firefox
+---
+<div class="note">
+<p>Para seguir este tutorial você precisará ter <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Installation">instalado o SDK</a> e aprendido o <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Getting_Started_With_cfx">básico do cfx</a>.</p>
+</div>
+
+<div class="note">
+<p>Se vocé estiver usando <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tools/jpm">jpm</a> ao invés de cfx, o método para usar módulos de terceiros é diferente, e você deve ler a <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Using_third-party_modules_%28jpm%29">versão jpm</a> ao invés deste guia.</p>
+</div>
+
+<p>O SDK não tem ainda uma API para adicionar novos itens de menu ao Firefox. Mas é extensível por design, então qualquer um pode construir e publicar módulos para desenvolvedores de add-on usar. Felizmente, Erik Vold escreveu um módulo <a href="https://github.com/mykmelez/menuitems-jplib"><code>menuitems</code></a> que nos permite adicionar itens de menu.</p>
+
+<p>Este tutorial tem dupla função. Ele descreve o método geral para usar um externo, módulo de terceiro em seu add-on, e ele descreve como adicionar um item de menu usando o módulo <code>menuitems</code> em especial.</p>
+
+<p>Primeiro, crie um novo add-on. Crie um diretório chamado "clickme" onde você quiser, navegue para ele e execute <code>cfx init</code>.</p>
+
+<pre>mkdir clickme
+cd clickme
+cfx init
+</pre>
+
+<p>A estrutura de diretório de costume será criada:</p>
+
+<ul>
+ <li>clickme
+  <ul>
+   <li>data</li>
+   <li>lib
+    <ul>
+     <li>main.js</li>
+    </ul>
+   </li>
+   <li>package.json</li>
+   <li>tests
+    <ul>
+     <li>test-main.js</li>
+    </ul>
+   </li>
+  </ul>
+ </li>
+</ul>
+
+<div> </div>
+
+<h2 id="Inslatando_menuitems">Inslatando menuitems</h2>
+
+<p>Crie um diretório em "clickme" chamado "packages". Baixe o pacote <code>menuitems</code> de <a href="https://github.com/mykmelez/menuitems-jplib/zipball/4d6ae5b410d79cc16c9c76920fbaa8a367e44ca7">https://github.com/mykmelez/menuitems-jplib</a> e extrai ele dentro do diretório "packages" que você criou:</p>
+
+<pre>mkdir packages
+cd packages
+tar -xf ../erikvold-menuitems-jplib-d80630c.zip
+</pre>
+
+<h2 id="Dependências_de_Módulo">Dependências de Módulo</h2>
+
+<p>Se os módulos de terceiros dependem de módulos SDK, você pode usá-los imediatamente, mas se eles dependem de módulos de terceiros, você terá de instalar essas dependências também.</p>
+
+<p>No diretório principal do pacote (menuitems) você encontrará um arquivo chamado "package.json". Abra ele e procure por uma entrada chamada "dependencies". A entrada para o pacote <code>menuitems</code> é:</p>
+
+<pre>"dependencies": ["api-utils", "vold-utils"]
+</pre>
+
+<p>Isso nos diz que nós precisamos instalar o pacote <code>vold-utils</code>, que nós podemos fazer baixando ele de <a href="https://github.com/mykmelez/vold-utils-jplib/zipball/a321447dc5d613df33023165854957c181dc3174">https://github.com/mykmelez/vold-utils-jplib </a>e adicionando ele ao diretório packages com <code>menuitems</code>. Veja também <a href="/en-US/docs/Mozilla/QA/Mozmill_tests/Shared_Modules/UtilsAPI">api-utils Docs</a>(UtilsAPI).</p>
+
+<h2 id="Usando_menuitems">Usando <code>menuitems</code></h2>
+
+<p>A documentação para o módulo <a href="https://github.com/mykmelez/menuitems-jplib/blob/master/docs/menuitems.md"><code>menuitems</code></a> nos diz para criar um item de menu usando <code>MenuItem()</code>. Das opções aceitas pelo <code>MenuItem()</code>, nós usaremos este conjunto mínimo:</p>
+
+<ul>
+ <li><code>id</code>: identificado para este item de menu</li>
+ <li><code>label</code>: texto para mostrar no item</li>
+ <li><code>command</code>: função chamada quando o usuário seleciona o item</li>
+ <li><code>menuid</code>: identificador para o elemento pai do item</li>
+ <li><code>insertbefore</code>: identificador para o item anterior àquele que nós queremos que o item apareça</li>
+</ul>
+
+<div>
+<div>
+<pre class="brush: js">var menuitem = require("menuitems").Menuitem({
+  id: "clickme",
+  menuid: "menu_ToolsPopup",
+  label: "Click Me!",
+  onCommand: function() {
+    console.log("clicked");
+  },
+  insertbefore: "menu_pageInfo"
+});</pre>
+
+<div> </div>
+</div>
+</div>
+
+<p>Próximo, nós temos que declarar nossa dependência do pacote <code>menuitems</code>. No <code>package.json</code> de nosso add-on adicionamos a linha:</p>
+
+<pre>"dependencies": "menuitems"
+</pre>
+
+<p>Observe que devido ao <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=663480">bug 663480</a>, se você adicionar uma linha <code>dependencies </code>ao <code>package.json</code>, e você usar qualquer módulo do SDK, então você deve também declarar sua dependência naquele pacote embutido, como isto:</p>
+
+<pre>"dependencies": ["menuitems", "addon-sdk"]
+</pre>
+
+<p>Agora terminamos. Execute o add-on e você verá o novo item aparecer no menu de Ferramentas: selecione ele e você verá a <code>info: clicked </code>aparecer no console.</p>
+
+<h2 id="Cuidados">Cuidados</h2>
+
+<p>Módulos de terceiros são uma ótima forma de usar características não suportadas diretamente pelo SDK, mas porque módulos de terceiros usam APIs de nível baixo, eles podem quebrar quando forem lançadas novas versões do Firefox.</p>
+
+<p> </p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/adicione_um_item_ao_menu_de_contexto/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/adicione_um_item_ao_menu_de_contexto/index.html
new file mode 100644
index 0000000000..d864cd3029
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/adicione_um_item_ao_menu_de_contexto/index.html
@@ -0,0 +1,120 @@
+---
+title: Adicione um Item ao Menu de Contexto
+slug: Mozilla/Add-ons/SDK/Tutorials/Adicione_um_Item_ao_Menu_de_Contexto
+tags:
+  - Add-on SDK
+  - Firefox
+  - Guide
+  - context-menu
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Add_a_Context_Menu_Item
+---
+<div class="note">
+<p>Para seguir este tutorial você precisará ter <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Installation">instalado o SDK</a> e ter conhecimento <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Getting_Started_With_cfx">básico sobre cfx</a>.</p>
+</div>
+
+<p>Para adicionar itens e submenus ao menu de contexto do Firetox, use o módulo  <a href="/en-US/Add-ons/SDK/High-Level_APIs/context-menu"><code>context-menu</code></a>.</p>
+
+<p>Aqui está um add-on que adiciona um novo item ao menu de contexto. O item é mostrado sempre que alguma coisa na página é selecionada. Quando é clicado, a seleção é enviada para o código principal do add-on, que apenas registra ele:</p>
+
+<pre class="brush: js">var contextMenu = require("sdk/context-menu");
+ var menuItem = contextMenu.Item({
+  label: "Log Selection",
+  context: contextMenu.SelectionContext(),
+  contentScript: 'self.on("click", function () {' +
+                 '  var text = window.getSelection().toString();' +
+                 '  self.postMessage(text);' +
+                 '});',
+  onMessage: function (selectionText) {
+    console.log(selectionText);
+  }
+});</pre>
+
+<p>Teste: execute o add-on, carregue uma página web, selecione algum texto e clique com o botão direito. Você verá o novo item aparecer:</p>
+
+<p><img src="https://mdn.mozillademos.org/files/6513/context-menu-selection.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<p>Clique nele, e a seleção é <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Logging">registrada no console</a> (ou na shell, se você estiver executando uma instância do Firefox na linha de comando):</p>
+
+<pre>info: elephantine lizard
+</pre>
+
+<h2 id="Detalhes">Detalhes</h2>
+
+<p>Tudo que este add-on faz é criar um item no menu de contexto. Você não precisa adicioná-lo: uma vez que você criou o item, ele é automaticamente adicionado no contexto correto. O construtor nesse caso possui quatro opções: <code>label</code>, <code>context</code>, <code>contentScript</code>, e <code>onMessage</code>.</p>
+
+<h3 id="label">label</h3>
+
+<p>O <code>label</code> é tão somente a string que será mostrada.</p>
+
+<h3 id="context">context</h3>
+
+<p>O <code>context</code> descreve a circunstância em que o item será mostrado. O módulo <code>context-menu</code> oferece uma série de contextos embutidos, incluindo este <code>SelectionContext()</code>, que significa: mostrar o item quando alguma coisa na página for selecionada.</p>
+
+<p>Se estes simples contextos não forem suficiente, você pode definir contextos mais sofisticados usando scripts.</p>
+
+<h3 id="contentScript">contentScript</h3>
+
+<p>Este anexa um script ao item. Nesse caso o script espera pelo clique do usuário no item, então envia uma mensagem para o add-on contendo do texto selecionado.</p>
+
+<h3 id="onMessage">onMessage</h3>
+
+<p>A propriedade <code>onMessage</code> oferece um modo para o código do add-on responder mensagens do script anexado ao item do menu de contexto. Nesse caso é apenas registrado o texto selecionado.</p>
+
+<p>Então:</p>
+
+<ol>
+ <li>O usuário clica no item</li>
+ <li>o conteúdo do script do evento <code>click</code> dispara, e o conteúdo do script recupera o texto selecionado e envia a mensagem para o add-on</li>
+ <li>o evento <code>message</code> do add-on dispara, e ao código manipulador da função é passado o texto selecionado, que é registrado</li>
+</ol>
+
+<h2 id="Mais_opções">Mais opções</h2>
+
+<h3 id="Adicionando_uma_imagem">Adicionando uma imagem</h3>
+
+<p>Você pode adicionar uma imagem ao menu de contexto por meio da opção <code>image</code>. Isto é uma URL apontando para um ícone 16x16 que é mostrado do lado esquerdo do item do menu de contexto. Geralmente você armazenaria sua imagem no diretório "data" do seu add-on, e construiria a URL usando <code>self.data.url()</code>:</p>
+
+<pre class="brush: js">var self = require("sdk/self");
+
+var contextMenu = require("sdk/context-menu");
+var menuItem = contextMenu.Item({
+  label: "Log Selection",
+  context: contextMenu.SelectionContext(),
+  contentScript: 'self.on("click", function () {' +
+                 '  var text = window.getSelection().toString();' +
+                 '  self.postMessage(text);' +
+                 '});',
+  image: self.data.url("icon-16.png"),
+  onMessage: function (selectionText) {
+    console.log(selectionText);
+  }
+});</pre>
+
+<h3 id="Adicione_uma_tecla_de_atalho">Adicione uma tecla de atalho</h3>
+
+<div class="geckoVersionNote">
+<p>Novo no Firefox 35.</p>
+</div>
+
+<p>A partir do Firefox 35 você pode especificar uma tecla de atalho usando a opção  <code>accessKey</code>. Deve ser somente um caracter. Pressione a tecla selecionada na opção quando o menu de contexto estiver aberto:</p>
+
+<pre class="brush: js">var contextMenu = require("sdk/context-menu");
+var menuItem = contextMenu.Item({
+  label: "Log Selection",
+  context: contextMenu.SelectionContext(),
+  contentScript: 'self.on("click", function () {' +
+                 '  var text = window.getSelection().toString();' +
+                 '  self.postMessage(text);' +
+                 '});',
+  accessKey: "l",
+  onMessage: function (selectionText) {
+    console.log(selectionText);
+  }
+});
+</pre>
+
+<p> </p>
+
+<h2 id="Aprendendo_mais">Aprendendo mais</h2>
+
+<p>Aprendendo mais sobre o módulo <code>context-menu</code>, veja a referência da API <a href="/en-US/Add-ons/SDK/High-Level_APIs/context-menu"><code>context-menu</code></a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/captura_de_carregamento_da_pagina/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/captura_de_carregamento_da_pagina/index.html
new file mode 100644
index 0000000000..1fa1ae81d6
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/captura_de_carregamento_da_pagina/index.html
@@ -0,0 +1,28 @@
+---
+title: Captura de carregamento da página
+slug: Mozilla/Add-ons/SDK/Tutorials/captura_de_carregamento_da_pagina
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Listen_for_Page_Load
+---
+<div class="note">
+ Para seguir esse tutorial você necessita ter <a href="/en-US/Add-ons/SDK/Tutorials/Installation">instalado o SDK</a> e aprendido <a href="/en-US/Add-ons/SDK/Tutorials/Getting_Started_With_cfx">o básico do <code>cfx</code></a>.</div>
+<p>Você pode capturar notificações sobre novas páginas em carregamento usando o módulo <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs"><code>tabs</code></a>. <span id="result_box" lang="pt"><span class="hps">O</span> <span class="hps">seguinte complemento</span> captura o evento ready <span class="hps">da</span> aba <span class="hps">e</span> mostra no console <span class="hps">a</span> <span class="hps">URL</span> <span class="hps">da</span><span class="hps"> mesma, carregada pelo usuário</span><span>:</span></span></p>
+<pre class="brush: js">require("sdk/tabs").on("ready", logURL);
+
+function logURL(tab) {
+  console.log(tab.url);
+}
+</pre>
+<p><span id="result_box" lang="pt"><span class="hps">Você não</span> <span class="hps">tem acesso direto</span> <span class="hps">a qualquer</span> <span class="hps">conteúdo hospedado</span> <span class="hps">na guia</span><span>.</span></span></p>
+<p><span id="result_box" lang="pt"><span class="hps">Para acessar o conteúdo</span> <span class="hps">da aba </span><span class="hps">você precisa anexar</span> <span class="hps">um script</span> <span class="hps">usando</span> <code>tab.attach()</code><span class="hps">.</span> <span class="hps">Este</span> <span class="hps">add</span><span>-on</span> <span class="hps">atribui</span> <span class="hps">um script para</span> <span class="hps">todas as</span> <span class="hps">abas abertas</span><span>.</span> <span class="hps">O</span> <span class="hps">script adiciona</span> <span class="hps">uma borda vermelha</span> <span class="hps">ao</span> <span class="hps">documento</span> <span class="hps">da aba</span><span>:</span></span></p>
+<pre class="brush: js">require("sdk/tabs").on("ready", runScript);
+
+function runScript(tab) {
+  tab.attach({
+    contentScript: "if (document.body) document.body.style.border = '5px solid red';"
+  });
+}
+</pre>
+<p><span id="result_box" lang="pt"><span class="hps">(Este exemplo é</span> <span class="hps">apenas para mostrar</span> <span class="hps">a idéia</span><span>:</span> <span class="hps">para implementar</span> <span class="hps">algo como isso,</span> <span class="hps">você deve usar</span> <a href="/en-US/Add-ons/SDK/High-Level_APIs/page-mod"><code>page-mod</code></a><span>,</span> <span class="hps">e especificar</span> <span class="hps">"*" como</span> <span class="hps">o match-pattern</span><span class="hps">.</span></span>)</p>
+<h2 id="Aprendendo_Mais">Aprendendo Mais</h2>
+<p>Para aprender mais sobre o trabalho com abas no SDK, veja a <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs">referência de tab da API</a>. <span id="result_box" lang="pt"><span class="hps">Você</span> <span class="hps">pode capturar </span><span class="hps">uma série de</span> <span class="hps">outros eventos</span> <span class="hps">da aba</span><span>, incluindo</span> <code>open</code><span class="hps">, <code>close </code></span><span class="hps">e <code>activate</code>.</span></span></p>
+<p>Para ler mais sobre rodar scripts nas abas, veja o <a href="/en-US/Add-ons/SDK/Tutorials/Modifying_the_Page_Hosted_by_a_Tab">tutorial sobre como usar <code>tab.attach()</code></a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/chrome_authority/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/chrome_authority/index.html
new file mode 100644
index 0000000000..0e09ecdc02
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/chrome_authority/index.html
@@ -0,0 +1,65 @@
+---
+title: Autoridade Chrome
+slug: Mozilla/Add-ons/SDK/Tutorials/Chrome_Authority
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Chrome_Authority
+---
+<div class="warning">
+<p>A API usada para ganhar acesso ao Chrome atualmente é uma característica experimental do SDK, e deve mudar em lançamentos futuros.</p>
+</div>
+
+<h2 id="Usando_Autoridade_Chrome">Usando Autoridade Chrome</h2>
+
+<p>Os módulos de baixo-nível mais poderosos são executados com "chrome privileges", que nos dão acesso ao infame <a href="/en-US/docs/Components_object"><code>Objeto Components</code></a>, que concede acesso irrestrito ao host. A partir daí, <span id="result_box" lang="pt"><span class="hps">o módulo</span> <span class="hps">pode fazer praticamente</span> <span class="hps">qualquer coisa que o</span> <span class="hps">navegador</span> <span class="hps">é capaz.</span> <span class="hps">Para obter estes</span> <span class="hps">privilégios</span><span>, o módulo</span> <span class="hps">deve declarar</span> <span class="hps">sua intenção</span> <span class="hps">com</span> <span class="hps">uma declaração como</span> <span class="hps">a seguinte</span></span>:</p>
+
+<pre class="brush: js">var {Cc, Ci} = require("chrome");</pre>
+
+<p>O objeto retornado pelo <code>require("chrome")</code>, quando desempacotado com a característica <a href="/en-US/docs/Web/JavaScript/New_in_JavaScript/1.7#Destructuring_assignment_(Merge_into_own_page.2Fsection)">destructuring assignment</a> disponível no ambiente JS do Mozilla, fornecerá os redutores comuns dos <code>Components.*</code>:</p>
+
+<p><code><strong>Cc</strong></code></p>
+
+<p>Um redutor para <code>Components.classes</code>.</p>
+
+<p><code><strong>Ci</strong></code></p>
+
+<p>Um redutor para <code>Components.interfaces</code>.</p>
+
+<p><code><strong>Cu</strong></code></p>
+
+<p>Um redutor para <code>Components.utils</code>.</p>
+
+<p><code><strong>Cr</strong></code></p>
+
+<p>Um redutor para <code>Components.results</code>.</p>
+
+<p><code><strong>Cm</strong></code></p>
+
+<p>Um redutor para <code>Components.manager</code>.</p>
+
+<p><code><strong>components</strong></code></p>
+
+<p>Uma outra forma de chamar <code>Components</code> por si mesmo (note as letras minúsculas). A partir daí você pode acessar propriedade de uso menos frequente como <code>Components.stack</code> e <code>Components.isSuccessCode</code>.</p>
+
+<p>Nota: a declaração <code>require("chrome")</code> é o <strong>único</strong> modo para acessar as funcionalidades do chrome e da API <code>Components</code>. O objeto <code>Components</code> <strong>não</strong> deve ser acessado de módulos. A ferramenta SDK emitira um aviso se ela vir código em móduo que referencie o <code>Components</code> diretamente.</p>
+
+<p>Seu módulo deve evitar usar privilégios do chrome a menos que seja absolutamente necessário. Uso da Autoridade do Chrome deve receber revisão extra de segurança, e a maioria dos bugs nestes módulos são críticos a segurança.</p>
+
+<h2 id="Geração_do_Manifesto">Geração do Manifesto</h2>
+
+<p>O <strong>manifesto</strong> é uma lista, incluída no XPI gerado, que especifica quais módulos requisitação accesso <code>require()</code> para quais outros módulos. Ele também grava quais módulos requisitam acesso chrome. Esta lista é gerada pelo mapeamento de todos os módulos incluído pela declaração <code>require(XYZ)</code> e grava a string "XYZ" que eles referênciam.</p>
+
+<p>Quando a implementação do manifesto estiver completa o carregador do programa  vai impedir os módulos de usar <code>require()  </code>para solicitar módulos que não estão listados no manifesto. Também, evitará que os módulos consiga autoridade chrome a menos que o manifesto indique que eles pediram para ele.<span id="result_box" lang="pt"><span class="hps"> Isto irá assegurar que</span> <span class="hps">os revisores enxerguem</span> <span class="hps">as mesmas restrições</span> <span class="hps">de autoridade</span> <span class="hps">que são aplicadas</span> <span class="hps">sobre o</span> <span class="hps">código em execução, aumentando efetivamente o tempo gasto revendo o add-on. (até que</span> <span class="hps">este trabalho</span> <span class="hps">seja concluído,</span> <span class="hps">os módulos</span> <span class="hps">podem ser capazes de</span> <span class="hps">burlar</span> <span class="hps">essas restrições).</span></span></p>
+
+<p>O manifesto é construído com um mapeador baseado em expressão regular, não um análisador Javascript. Os desenvolvedores devem manter as declarações <code>require</code> simples, com uma única string estática, uma por linha de código. Se o mapeador falhar para enxergar a entrada <code>require</code>, o manifesto não incluirá aquela entrada, e (uma vez que a implementação esteja completa) o código em execução lança uma exceção.</p>
+
+<p>Por exemplo, nenhum dos códigos a seguir serão encontrados pelo mapeamento do manifesto, levando a uma exceção em tempo de execução, quando a chamada <code>require()</code> é proibida de importar os módulos chamados:</p>
+
+<pre class="brush: js">// todos estes falharão
+var xhr = require("x"+"hr");
+var modname = "xpcom";
+var xpcom = require(modname);
+var one = require("one"); var two = require("two");
+</pre>
+
+<p>A intenção é que os desenvolvedores usem a declaração <code>require() </code>para dois propósitos: declarar (ao revisores de segurança) qual a classificação dos poderes que os modulos querem usar, e controlar como estes poderes serão mapeados dentro do namespace do módulo local. Suas declarações devem então ser claras e fáceis de analisar. Um formato de manifesto futuro deve mover a porção de declaração para um arquivo separado, para permitir expressões mais granuladas de autorização.</p>
+
+<p>Comandos que constroem um manifesto, como "<code>jpm xpi</code>" ou "<code>jpm run</code>", mapearão todos os módulos incluídos pelo uso dos atalhos <code>Cc</code>/<code>Ci</code> (ou a forma expandida <code>Components.classes</code>). Emitirá um aviso se ele visualizar a forma expandida ou ver o uso e.g. "<code>Cc</code>" sem a entrada correspondente na declaração <code>require("chrome")</code>. Estes avisos servem para guiar os desenvolvedores para o usar o padrão correto. Todos os desenvolvedores de módulos devem reparar os avisos e corrigir seus códigos até que os avisos tenham desaparecido.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/começando/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/começando/index.html
new file mode 100644
index 0000000000..1294a58ffd
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/começando/index.html
@@ -0,0 +1,206 @@
+---
+title: Começando
+slug: Mozilla/Add-ons/SDK/Tutorials/Começando
+tags:
+  - Add-on SDK
+  - Tutorial
+translation_of: Mozilla/Add-ons/SDK/Tutorials/Getting_Started_%28jpm%29
+---
+<p>Este tutorial percorre a criação de um add-on simples usando o SDK.</p>
+
+<h2 id="Pré-requisitos">Pré-requisitos</h2>
+
+<p>Para criar add-ons para Firefox usando SDK, você primeiro precisará seguir as instruções para <a href="/en-US/Add-ons/SDK/Tutorials/Installation">instalar e ativar o SDK</a>. Uma vez que você fez isso, você estará olhando para um prompt de comando.</p>
+
+<h2 id="Inicializando_um_add-on_vazio">Inicializando um add-on vazio</h2>
+
+<p>No prompt de comando, crie um novo diretório. O diretório não precisa estar no diretório principal do SDK: você pode criar ele em qualquer lugar que você quiser. Navegue para ele, digite cfx init, e tecle enter:</p>
+
+<pre>mkdir my-addon
+cd my-addon
+cfx init
+</pre>
+
+<p>Você verá uma saída como esta:</p>
+
+<pre>* lib directory created
+* data directory created
+* test directory created
+* doc directory created
+* README.md written
+* package.json written
+* test/test-main.js written
+* lib/main.js written
+* doc/main.md written
+Your sample add-on is now ready for testing:
+try "cfx test" and then "cfx run". Have fun!"
+</pre>
+
+<h2 id="Implementando_o_add-on">Implementando o add-on</h2>
+
+<p>Agora você pode escrever o código do add-on, que vai no arquivo "main.js" em diretório "lib". Esse arquivo foi criado para você no passo anterior. Abra ele e adicione o seguinte código:</p>
+
+<pre class="brush: js">var buttons = require('sdk/ui/button/action');
+var tabs = require("sdk/tabs");
+
+var button = buttons.ActionButton({
+  id: "mozilla-link",
+  label: "Visite Mozilla",
+  icon: {
+    "16": "./icon-16.png",
+    "32": "./icon-32.png",
+    "64": "./icon-64.png"
+  },
+  onClick: handleClick
+});
+
+function handleClick(state) {
+  tabs.open("https://www.mozilla.org/");
+}
+</pre>
+
+<p>Salve o arquivo.</p>
+
+<p>Próximo, salve estes ícones no diretório "data" de seu add-on:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7635/icon-16.png" style="height: 16px; width: 16px;"></td>
+   <td>icon-16.png</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7637/icon-32.png" style="height: 32px; width: 32px;"></td>
+   <td>icon-32.png</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7639/icon-64.png" style="height: 64px; width: 64px;"></td>
+   <td>icon-64.png</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Volte ao prompt de comando, digite:</p>
+
+<pre>cfx run
+</pre>
+
+<p>Este é o comando SDK para executar uma nova instância do Firefox com seu add-on instalado. Quando o Firefox inicia, no canto de cima do lado direito do navegador você verá um ícone com o logotipo do Firefox. Clique nele, e uma nova tab abrirá com o site <a href="https://www.mozilla.org/">https://www.mozilla.org/</a> carregado nela.</p>
+
+<p>Isso é tudo que esse add-on faz. Ele usa dois módulos SDK: o módulo <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a>, que permite a você adicionar botões ao navegador, e o módulo <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/tabs">tabs</a>, que permite a você realizar operações básicas com <em>tabs</em>. Nesse caso, nós criamos uma botão cujo ícone é o íncone do Firefox, e adicionamos um manipulador de clique que carrega a home page da Mozilla na nova tab.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7643/mozilla-button.png" style="display: block; height: 221px; margin-left: auto; margin-right: auto; width: 382px;">Tente editar esse arquivo. Por exemplo, nós poderíamos mudar a página que é carregada:</p>
+
+<pre class="brush: js">var buttons = require('sdk/ui/button/action');
+var tabs = require("sdk/tabs");
+
+var button = buttons.ActionButton({
+  id: "mozilla-link",
+  label: "Visit Mozilla",
+  icon: {
+    "16": "./icon-16.png",
+    "32": "./icon-32.png",
+    "64": "./icon-64.png"
+  },
+  onClick: handleClick
+});
+
+function handleClick(state) {
+  tabs.open("https://developer.mozilla.org/");
+}</pre>
+
+<p>No promp de comando, execute novamente cfx run. Desta vez clicando levará você para <a href="https://developer.mozilla.org/">https://developer.mozilla.org/</a>.</p>
+
+<h2 id="Empacotando_o_add-on">Empacotando o add-on</h2>
+
+<p>Quando você termina o add-on e está preparado para distribui-lo, você precisa empacotá-lo como um arquivo XPI. Esse é um formato de arquivo instalável para add-ons de Firefox.  Você pode distribuir arquivos XPI ou publicá-los em <a href="https://addons.mozilla.org" rel="noreferrer">https://addons.mozilla.org</a> assim outros usuários podem baixar e instalá-los.</p>
+
+<p>Para construir um XPI, apenas execute o comando cfx xpi do diretório do add-on:</p>
+
+<pre>cfx xpi
+</pre>
+
+<p>Você deve ver uma mensagem como:</p>
+
+<pre>Exporting extension to my-addon.xpi.
+</pre>
+
+<p>Para testar que funcionou, tente instalar o arquivo XPI em sua própria instalação do Firefox. Você pode fazer isso pressionando Ctrl+O (Cmd+O no Mac) de dentro do Firefox, ou selecionando o item "Abrir arquivo" do menu "Arquivo" do Firefox. Isso trará uma caixa de seleção; navegue até o arquivo "my-addon.xpi", abra-o e siga o prompt para instalar o add-on.</p>
+
+<h2 id="Resumo">Resumo</h2>
+
+<p>Neste tutorial nós construímos e empacotamos um add-on usando três comandos:</p>
+
+<ul>
+ <li><code>cfx init</code> para inicializar um modelo vazio do add-on</li>
+ <li><code>cfx run</code> para executar uma nova instância do Firefox com o add-on instalado, não nós testamos ele</li>
+ <li><code>cfx xpi</code> para empacotar o add-on dentro do arquivo XPI para distribuição</li>
+</ul>
+
+<p>Esses são os três principais comandos que você usará quando desenvolver add-ons no SDK. Há uma abrangente <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tools/cfx">documentação de referência</a> cobrindo todos os comandos que você pode usar e todas as opções que eles possuem.</p>
+
+<p>O próprio código do add-on usa dois módulos do SDK, <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a> e <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs" rel="noreferrer">tabs</a>. Há documentação de referência para toda a API do SDK, de <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs">alto</a> e <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs">baixo nível</a>.</p>
+
+<h2 id="O_que_vem_a_seguir">O que vem a seguir?</h2>
+
+<p>Para sentir algumas das coisas que você pode fazer com a API do SDK, tente trabalhar através de alguns dos <a href="/en-US/Add-ons/SDK/Tutorials" rel="noreferrer">tutorials</a>.</p>
+
+<h2 id="Técnicas_avançadas">Técnicas avançadas</h2>
+
+<h3 id="Sobreescrevendo_os_módulos_embutidos">Sobreescrevendo os módulos embutidos</h3>
+
+<p>Os módulos do SDK que você usa para implementar seu add-on estão embutidas no Firefox. Quando você executa ou empacota um add-on usando <code>cfx run</code> ou <code>cfx xpi</code>, o add-on usará as versões dos módulos na versão do Firefox que hospeda elas.</p>
+
+<p>Como um desenvolvedor de add-on, isso é normalmente o que você quer. Mas se você está desenvolvendo os módulos SDK por si mesmo, claro, não será. Nesse caso assumimos que você pegou o SDK de seu <a href="https://github.com/mozilla/addon-sdk">repositório GitHub</a> e executará o script <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Installation">bin/activate</a> desse diretório raiz de trabalho.</p>
+
+<p>Então quando você invoca <code>cfx run</code> ou <code>cfx xpi</code>, você passa a opçao "-o":</p>
+
+<pre>cfx run -o
+</pre>
+
+<p>Isso instrui o cfx a usar a cópia local dos módulos do SDK, não aqueles existentes no Firefox.</p>
+
+<h3 id="Desenvolvendo_sem_cfx_run">Desenvolvendo sem cfx run</h3>
+
+<p>Porque <code>cfx run</code> reinicia o navegador cada vez que você invoca ele, ele pode ser um pouco pesado se você está fazendo mudanças frequentes em um add-on. Um modelo de desenvolvimento alternativo é usar o add-on <a href="https://addons.mozilla.org/en-US/firefox/addon/autoinstaller/">Extension Auto-Installer</a>: este escuta para novos arquivos XPI em uma porta específica e instala-os automaticamente. Dessa maneira você pode testar novas mudanças sem precisar reiniciar o navegador:</p>
+
+<ul>
+ <li>faça uma mudança em seu add-on</li>
+ <li>execute cfx xpi</li>
+ <li>posta o add-on para uma porta especificada</li>
+</ul>
+
+<p>Você poderia até mesmo automatizar esse fluxo com um script simples. Por exemplo:</p>
+
+<pre>while true ; do cfx xpi ; wget --post-file=codesy.xpi http://localhost:8888/ ; sleep 5 ; done
+</pre>
+
+<p>Note que o nível de registro definido para o console é diferente quando você usa esse método, comparado com o nível de registro usado quando um add-on está executando usando <code>cfx run</code>. Isso significa que se você quiser ver a saída de mensagens do <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Logging">console.log()</a>, você terá que ajustar uma configuração. Veja a documentação no <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tools/console#Logging_Levels">nível de registros</a> para mais detalhes sobre isso.</p>
+
+<p>Um outro exemplo usando <a href="http://gruntjs.com/">grunt</a> e <a href="https://www.npmjs.com/package/grunt-shell">grunt-shell</a>:</p>
+
+<pre class="brush: js">module.exports = function(grunt) {
+  'use strict';
+  require('matchdep').filterDev('grunt-!(cli)').forEach(grunt.loadNpmTasks);
+  grunt.initConfig({
+    shell: {
+      xpi: {
+        command: [
+          'cd pluginpath',
+          'cfx xpi',
+          'wget --post-file=pluginname.xpi http://localhost:8888/ || echo&gt;/dev/null'
+        ].join('&amp;&amp;')
+      }
+    },
+    watch: {
+      xpi: {
+        files: ['pluginpath/**'],
+        tasks: ['shell:xpi']
+      }
+    }
+  });
+
+  grunt.loadNpmTasks('grunt-contrib-watch');
+  grunt.loadNpmTasks('grunt-shell');
+  grunt.registerTask('default', ['watch']);
+};</pre>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/creating_event_targets/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/creating_event_targets/index.html
new file mode 100644
index 0000000000..d8fd6a7318
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/creating_event_targets/index.html
@@ -0,0 +1,245 @@
+---
+title: Criando Alvos de Eventos
+slug: Mozilla/Add-ons/SDK/Tutorials/Creating_event_targets
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Creating_event_targets
+---
+<p><span>Este tutorial descreve o uso de APIS de baixo nível. Estas APIs estão ainda em desenvolvimento, e nós esperamos fazer mudanças incompatíveis nela em lançamentos futuros.</span></p>
+
+<p>O <a href="/en-US/Add-ons/SDK/Guides/Working_with_Events">guia de programação de eventos dirigidos com SDK</a> descreve como consumir eventos: isto é, como escutar eventos gerados pelo alvos de evento. Por exemplo, você pode escutar ao evento <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs#ready"><code>evento ready</code> do módulo tab</a> ou <a href="/en-US/Add-ons/SDK/High-Level_APIs/panel#show">o event<code> show do objeto Panel</code></a>.</p>
+
+<p>Com o SDK, também é simples implementar seus próprios alvos de eventos. Isto é especialmente útil se você quiser <a href="/en-US/Add-ons/SDK/Creating_Reusable_Modules">construir seus próprios módulos</a>, ou organizar seu add-on melhor ou permitir a outros desenvolvedores reusar seu código. Se você usa o framework de eventos do SDK para seus alvos de eventos, os usuários de seus módulos podem escutar pelos eventos usando a API de evento padrão do SDK.</p>
+
+<p>Neste tutorial nów criaremos parte de um módulo para acessar a <a href="https://developer.mozilla.org/en/Places">API Local</a> do navegador. Ele emitirá eventos quando o usuário adicionar e visitar um favorito, permitindo aos usuários escutar estes eventos usando a API de evento padrão do SDK.</p>
+
+<h2 id="Usando_a_API_Local">Usando a API Local</h2>
+
+<p>Primeiro, vamos escrever algun código usando a API Local que registra as URIs do favorito que o usuário adicinou.</p>
+
+<p>Crie uma novo diretório chamado "bookmarks", navegue até ele, e execute<code><a href="/en-US/Add-ons/SDK/Tools/jpm"> jpm init</a></code>, aceitando todos os padrões. Então abra o "index.js" e adicione o seguinte código:</p>
+
+<pre class="brush: js">var {Cc, Ci, Cu} = require("chrome");
+Cu.import("resource://gre/modules/XPCOMUtils.jsm", this);
+var bookmarkService = Cc["@mozilla.org/browser/nav-bookmarks-service;1"]
+                          .getService(Ci.nsINavBookmarksService);
+
+var bookmarkObserver = {
+  onItemAdded: function(aItemId, aFolder, aIndex) {
+    console.log("added ", bookmarkService.getBookmarkURI(aItemId).spec);
+  },
+  onItemVisited: function(aItemId, aVisitID, time) {
+    console.log("visited ", bookmarkService.getBookmarkURI(aItemId).spec);
+  },
+  QueryInterface: XPCOMUtils.generateQI([Ci.nsINavBookmarkObserver])
+};
+
+exports.main = function() {
+  bookmarkService.addObserver(bookmarkObserver, false);
+};
+
+exports.onUnload = function() {
+  bookmarkService.removeObserver(bookmarkObserver);
+}
+</pre>
+
+<p>Tente executar este add-on, adicionando e visitando favoritos, e observando a saída no console.</p>
+
+<h2 id="Módulos_como_Alvos_de_Evento">Módulos como Alvos de Evento</h2>
+
+<p>Nós podemos adaptar esse código em módulos separados que expõe a interface de evento padrão do SDK.</p>
+
+<p>Para fazer isso nós usaremos o módulo <a href="/en-US/Add-ons/SDK/Low-Level_APIs/event_core"><code>event/core</code></a>.</p>
+
+<p>Crie um novo arquivo no "lib" chamado "bookmarks.js", e adicione o seguinte código:</p>
+
+<pre class="brush: js">var { emit, on, once, off } = require("sdk/event/core");
+
+var {Cc, Ci, Cu} = require("chrome");
+Cu.import("resource://gre/modules/XPCOMUtils.jsm", this);
+var bookmarkService = Cc["@mozilla.org/browser/nav-bookmarks-service;1"]
+                          .getService(Ci.nsINavBookmarksService);
+
+var bookmarkObserver = {
+  onItemAdded: function(aItemId, aFolder, aIndex) {
+    emit(exports, "added", bookmarkService.getBookmarkURI(aItemId).spec);
+  },
+  onItemVisited: function(aItemId, aVisitID, time) {
+    emit(exports, "visited", bookmarkService.getBookmarkURI(aItemId).spec);
+  },
+  QueryInterface: XPCOMUtils.generateQI([Ci.nsINavBookmarkObserver])
+};
+
+bookmarkService.addObserver(bookmarkObserver, false);
+
+exports.on = on.bind(null, exports);
+exports.once = once.bind(null, exports);
+exports.removeListener = function removeListener(type, listener) {
+  off(exports, type, listener);
+};
+</pre>
+
+<p>Este código implementa um módulo que pode emitir eventos <code>added</code> e <code>visited</code>. Ele duplica o código anterior, mas com um pouco de mudanças:</p>
+
+<ul>
+ <li>importe <code>emit()</code>, <code>on()</code>, <code>once()</code>, e <code>off()</code> do <code>event/core</code></li>
+ <li>substitua as funções de escuta com chamadas para <code>emit()</code>, passando o tipo de evento apropriado</li>
+ <li>exporte sua própria API de evento. Este consiste de três funções:
+  <ul>
+   <li><code>on()</code>: inicia a escuta pelo evento ou um dado tipo</li>
+   <li><code>once()</code>: escuta pela ocorrência de um dado evento, e então para</li>
+   <li><code>removeListener()</code>: para a escuta por eventos de um dado tipo</li>
+  </ul>
+ </li>
+</ul>
+
+<p>O <code>on()</code> e <code>once()</code> exporta delegação a uma função correspondente do <code>event/core</code>, e usa <code>bind()</code> para passar o objeto <code>exports</code> por si só como o argumento <code>target(alvo)</code> à função subjacente. A função <code>removeListener()</code> é implementada pela chamada da função subjacente  <code>off()</code>.</p>
+
+<p>Nós podemos usar este módulo do mesmo modo que nós usamos qualquer outro módulo que emite eventos a nível de módulo, tais como <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs"><code>tabs</code></a>. Por exemplo, nós podemos adaptar o "index.js" como segue:</p>
+
+<pre class="brush: js">var bookmarks = require("./bookmarks");
+
+function logAdded(uri) {
+  console.log("added: " + uri);
+}
+
+function logVisited(uri) {
+  console.log("visited: " + uri);
+}
+
+exports.main = function() {
+  bookmarks.on("added", logAdded);
+  bookmarks.on("visited", logVisited);
+};
+
+exports.onUnload = function() {
+  bookmarks.removeListener("added", logAdded);
+  bookmarks.removeListener("visited", logVisited);
+}
+</pre>
+
+<h2 id="Classes_como_Alvos_de_Eventos">Classes como Alvos de Eventos</h2>
+
+<p>Às vezes nós queremos emitir eventos à nível de objetos individuais, em vez de à nível de módulo.</p>
+
+<p>Para fazer isto, nós podemos herdar da classe <a href="/en-US/Add-ons/SDK/Low-Level_APIs/event_target"><code>EventTarget</code></a> do SDK. <code>EventTarget</code> fornece uma implementação das funções necessárias a adicionar e remover escutas: <code>on()</code>, <code>once()</code>, e <code>removeListener()</code>.</p>
+
+<p>Neste exemplo, nós poderíamos definir uma classe <code>BookmarkManager</code> que herda do <code>EventTarget</code> e emite eventos <code>added</code> e <code>visited</code>.</p>
+
+<p>Abra o "bookmarks.js" e substitua seu conteúdo com este código:</p>
+
+<pre class="brush: js">var { emit } = require("sdk/event/core");
+var { EventTarget } = require("sdk/event/target");
+var { Class } = require("sdk/core/heritage");
+var { merge } = require("sdk/util/object");
+
+var {Cc, Ci, Cu} = require("chrome");
+Cu.import("resource://gre/modules/XPCOMUtils.jsm", this);
+var bookmarkService = Cc["@mozilla.org/browser/nav-bookmarks-service;1"]
+                          .getService(Ci.nsINavBookmarksService);
+
+function createObserver(target) {
+   var bookmarkObserver = {
+     onItemAdded: function(aItemId, aFolder, aIndex) {
+       emit(target, "added", bookmarkService.getBookmarkURI(aItemId).spec);
+     },
+     onItemVisited: function(aItemId, aVisitID, time) {
+       emit(target, "visited", bookmarkService.getBookmarkURI(aItemId).spec);
+     },
+     QueryInterface: XPCOMUtils.generateQI([Ci.nsINavBookmarkObserver])
+   };
+   bookmarkService.addObserver(bookmarkObserver, false);
+}
+
+var BookmarkManager = Class({
+  extends: EventTarget,
+  initialize: function initialize(options) {
+    EventTarget.prototype.initialize.call(this, options);
+    merge(this, options);
+    createObserver(this);
+  }
+});
+
+exports.BookmarkManager = BookmarkManager;
+</pre>
+
+<p>O código para interagir com a API Local é o mesmo que aqui. Porém:</p>
+
+<ul>
+ <li>nós estamos agora importando de quatro módulos:
+  <ul>
+   <li><a href="/en-US/Add-ons/SDK/Low-Level_APIs/event_core"><code>event/core</code></a> nos dá <code>emit()</code>: note que nós não precisamos <code>on</code>, <code>once</code>, ou <code>off</code>, desde que nós usaremos <code>EventTarget</code> para adicionar e remover escutas</li>
+   <li><a href="/en-US/Add-ons/SDK/Low-Level_APIs/event_target"><code>event/target</code></a> nos dá <code>EventTarget</code>, que implementa a interface para adicionar e remover escutas</li>
+   <li><a href="/en-US/Add-ons/SDK/Low-Level_APIs/core_heritage"><code>core/heritage</code></a> nos dá <code>Class()</code>, que nós podemos usar para herdar do <code>EventTarget</code></li>
+   <li><a href="/en-US/Add-ons/SDK/Low-Level_APIs/util_object"><code>util/object</code></a> nos dá <code>merge()</code>, que apenas simplifica a configuração das propriedades do <code>BookmarkManager</code></li>
+  </ul>
+ </li>
+ <li>nós usamos classe para herdar do<code> EventTarget</code>. Em sua função <code>initialize()</code>, nós:
+  <ul>
+   <li><span class="short_text" id="result_box" lang="pt"><span class="hps">chamar o</span> <span class="hps">inicializador de</span> <span class="hps">classe base</span></span></li>
+   <li>use <code>merge()</code> para copiar qualquer opção fornecida dentro do novíssimo objeto criado</li>
+   <li>chama <code>createObserver()</code>, passando o novíssimo objeto criado como o alvo do evento</li>
+  </ul>
+ </li>
+ <li><code>createObserver()</code> é o mesmo do exemplo anterior, exceto que no <code>emit()</code> nós passamos o <code>BookmarkManager</code> criado como o alvo do evento</li>
+</ul>
+
+<p>Para usar este alvo de evento nós podemos criar ele e chamar a funções <code>on()</code>, <code>once()</code>, e <code>removeListener()</code> que ele herdou:</p>
+
+<pre class="brush: js">var bookmarks = require("./bookmarks");
+var bookmarkManager = bookmarks.BookmarkManager({});
+
+function logAdded(uri) {
+  console.log("added: " + uri);
+}
+
+function logVisited(uri) {
+  console.log("visited: " + uri);
+}
+
+exports.main = function() {
+  bookmarkManager.on("added", logAdded);
+  bookmarkManager.on("visited", logVisited);
+};
+
+exports.onUnload = function() {
+  bookmarkManager.removeListener("added", logAdded);
+  bookmarkManager.removeListener("visited", logVisited);
+}
+</pre>
+
+<h3 id="Implementando_uma_opção_onEvent">Implementando uma opção "onEvent"</h3>
+
+<p>Finalmente, a maioria dos alvos de eventos aceitam opções na forma "onEvent", onde "Event" é o nome do evento com a primeira letra em maiúsculo. Por exemplo, você pode escutar o <a href="/en-US/Add-ons/SDK/High-Level_APIs/panel#show"><code>evento show do objeto Panel</code></a> ou chamando:</p>
+
+<pre class="brush: js">myPanel.on("show", listenerFunction);
+</pre>
+
+<p>ou passando a opção <code>onShow</code> para o construtor do Painel:</p>
+
+<pre class="brush: js">var myPanel = require("sdk/panel").Panel({
+  onShow: listenerFunction,
+  contentURL: "https://en.wikipedia.org/w/index.php"
+});
+</pre>
+
+<p>Se sua classe herda do <code>EventTarget</code>, opções como <code>this</code> são automaticamente manipuladas para você. Por exemplo, dada a implementação do <code>BookmarkManager</code> acima, seu "index.js" seria reescrito como isto:</p>
+
+<pre class="brush: js">var bookmarks = require("./bookmarks");
+
+function logAdded(uri) {
+  console.log("added: " + uri);
+}
+
+function logVisited(uri) {
+  console.log("visited: " + uri);
+}
+
+var bookmarkManager = bookmarks.BookmarkManager({
+  onAdded: logAdded,
+  onVisited: logVisited
+});
+
+exports.onUnload = function() {
+  bookmarkManager.removeListener("added", logAdded);
+  bookmarkManager.removeListener("visited", logVisited);
+}
+</pre>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/creating_reusable_modules/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/creating_reusable_modules/index.html
new file mode 100644
index 0000000000..837583f9c8
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/creating_reusable_modules/index.html
@@ -0,0 +1,253 @@
+---
+title: Criando Módulos Reutilizáveis
+slug: Mozilla/Add-ons/SDK/Tutorials/Creating_reusable_modules
+tags:
+  - Add-on SDK
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Creating_reusable_modules
+---
+<div class="note">Para seguir este tutorial você precisa do <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Installation">SDK instalado</a> e conhecimento <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Getting_Started_With_cfx">básico de cfx</a>.</div>
+
+<p>Com o SDK você não precisa manter tudo em um único arquivo "main.js". Você pode separar seu código em módulos separados com interfaces claramente definidas entre eles. Você então importa e usa estes módulos de outras partes de seu add-on usando a declaração <code>require()</code>, da mesma forma que você importa os módulos core do SDK como <a href="/en-US/Add-ons/SDK/High-Level_APIs/page_mod"><code>page-mod</code></a> or <a href="/en-US/Add-ons/SDK/High-Level_APIs/panel"><code>panel</code></a>.</p>
+
+<p>Muitas vezes faz sentido estruturar um add-on muito grande ou complexo como uma coleção de módulos. Isso torna o desenho do add-on mais fácil de entender e fornece algum encapsulamento em que cada módulo exportará somente o que ele escolheu, então você pode mudar o módulo internamente sem quebrar seu usuário.</p>
+
+<p>Uma vez que você fez isso, você pode empacotar os módulos e distribui-los independentemente de seu add-on, tornando-os disponíveis para outros desenvolvedores de add-on e efetivamente extendendo o SDK.</p>
+
+<p>Neste tutorial faremos exatamente isso com o módulo que calcula hashes de arquivo.</p>
+
+<h2 id="Um_add-on_de_hashing">Um add-on de hashing</h2>
+
+<p>Uma função <em>hash</em> leva uma <em>string</em> de qualquer tamanho de bytes, e produz uma string curta e de tamanho fixo de bytes como saída. É um modo útil para criar um "fingerprint" que pode ser usado para identificar um arquivo. MD5 é uma função hash comumente usada: embora não seja considerada segura, ela trabalha bem desconsiderando o contexto da segurança.</p>
+
+<p>Aqui nós escreveremos um add-on que deixa o usuário escolher uma arquivo no disco e calcula seu hash. Para ambas operações nós usaremos as interfaces <a href="/en-US/docs/Mozilla/Tech/XPCOM">XPCOM</a>.</p>
+
+<h3 id="File_picker">File picker</h3>
+
+<p>Para deixar o usuário selecionar um arquivo nós usaremos  o nsIFilePicker. A <a href="/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFilePicker">documentação para esta interface</a> inclui um exemplo que nós podemos adaptar como este:</p>
+
+<pre class="brush: js">var {Cc, Ci} = require("chrome");
+
+function promptForFile() {
+  const nsIFilePicker = Ci.nsIFilePicker;
+
+  var fp = Cc["@mozilla.org/filepicker;1"]
+           .createInstance(nsIFilePicker);
+
+  var window = require("sdk/window/utils").getMostRecentBrowserWindow();
+  fp.init(window, "Select a file", nsIFilePicker.modeOpen);
+  fp.appendFilters(nsIFilePicker.filterAll | nsIFilePicker.filterText);
+
+  var rv = fp.show();
+  if (rv == nsIFilePicker.returnOK || rv == nsIFilePicker.returnReplace) {
+    var file = fp.file;
+    // Pega o caminho como string. Note que você normalmente não
+    // precisará trabalhar com strings de caminho.
+    var path = fp.file.path;
+    // Trabalhe com o retorno de nsILocalFile...
+  }
+  return path;
+}</pre>
+
+<h3 id="Função_Hash">Função Hash</h3>
+
+<p>Firefox tem suporte embutido para funções hash, exposto via interface XPCOM nsICryptoHash. A <a href="/en-US/docs/XPCOM_Interface_Reference/nsICryptoHash">página da documentação para esta interface</a> inclui um exemplo de calculadora de hash MD5 do conteúdo do arquivo, dado seu caminho. Nós adaptamos como esta:</p>
+
+<pre class="brush: js">var {Cc, Ci} = require("chrome");
+
+// retorna o código hexadecimal de dois dígitos para um byte
+function toHexString(charCode) {
+  return ("0" + charCode.toString(16)).slice(-2);
+}
+
+function md5File(path) {
+  var f = Cc["@mozilla.org/file/local;1"]
+          .createInstance(Ci.nsILocalFile);
+  f.initWithPath(path);
+  var istream = Cc["@mozilla.org/network/file-input-stream;1"]
+                .createInstance(Ci.nsIFileInputStream);
+  // abrindo para leitura
+  istream.init(f, 0x01, 0444, 0);
+  var ch = Cc["@mozilla.org/security/hash;1"]
+           .createInstance(Ci.nsICryptoHash);
+  // nós queremos usar o algoritmo MD5
+  ch.init(ch.MD5);
+  // isto diz para updateFromStream ler o arquivo todo
+  const PR_UINT32_MAX = 0xffffffff;
+  ch.updateFromStream(istream, PR_UINT32_MAX);
+  // passe false aqui para conseguir os dados binários de volta
+  var hash = ch.finish(false);
+
+  // converte o hash binário para hex string.
+  var s = Array.from(hash, (c, i) =&gt; toHexString(hash.charCodeAt(i))).join("");
+  return s;
+}</pre>
+
+<h3 id="Colocando_tudo_junto">Colocando tudo junto</h3>
+
+<p>O add-on completo adiciona um botão ao Firfox: quando o usuário clica no botão, nós pedimos lhe para selecionar  um arquivo, e registramos o hash no console:</p>
+
+<pre class="brush: js">var {Cc, Ci} = require("chrome");
+
+// retorna o código hexadecimal de dois dígitos para um byte
+function toHexString(charCode) {
+  return ("0" + charCode.toString(16)).slice(-2);
+}
+
+function md5File(path) {
+  var f = Cc["@mozilla.org/file/local;1"]
+          .createInstance(Ci.nsILocalFile);
+  f.initWithPath(path);
+  var istream = Cc["@mozilla.org/network/file-input-stream;1"]
+                .createInstance(Ci.nsIFileInputStream);
+  // abrindo para leitura
+  istream.init(f, 0x01, 0444, 0);
+  var ch = Cc["@mozilla.org/security/hash;1"]
+           .createInstance(Ci.nsICryptoHash);
+  // nós queremos usar o algoritmo MD5
+  ch.init(ch.MD5);
+  // isto diz para updateFromStream ler o arquivo todo
+  const PR_UINT32_MAX = 0xffffffff;
+  ch.updateFromStream(istream, PR_UINT32_MAX);
+  // passe false aqui para conseguir os dados binários de volta
+  var hash = ch.finish(false);
+
+  // converte o hash binário para hex string.
+  var s = Array.from(hash, (c, i) =&gt; toHexString(hash.charCodeAt(i))).join("");
+  return s;
+}
+
+function promptForFile() {
+  var window = require("sdk/window/utils").getMostRecentBrowserWindow();
+  const nsIFilePicker = Ci.nsIFilePicker;
+
+  var fp = Cc["@mozilla.org/filepicker;1"]
+           .createInstance(nsIFilePicker);
+  fp.init(window, "Select a file", nsIFilePicker.modeOpen);
+  fp.appendFilters(nsIFilePicker.filterAll | nsIFilePicker.filterText);
+
+  var rv = fp.show();
+  if (rv == nsIFilePicker.returnOK || rv == nsIFilePicker.returnReplace) {
+    var file = fp.file;
+    // Pega o caminho como string. Note que você normalmente não
+    // precisará trabalhar com strings de caminho.
+    var path = fp.file.path;
+    // Trabalhe com o retorno de nsILocalFile...
+  }
+  return path;
+}
+
+require("sdk/ui/button/action").ActionButton({
+  id: "show-panel",
+  label: "Show Panel",
+  icon: {
+    "16": "./icon-16.png"
+  },
+  onClick: function() {
+    console.log(md5File(promptForFile()));
+  }
+});
+</pre>
+
+<p>Isso funciona, mas main.js está agora ficando mais longo e sua lógica mais difícil de entender. This works , but main.js is now getting longer and its logic is harder to understand. Vamos levar os códigos do "file picker" e do "hashing code" para módulos separados.</p>
+
+<h2 id="Criando_módulos_separados">Criando módulos separados</h2>
+
+<h3 id="filepicker.js">filepicker.js</h3>
+
+<p>Primeiro criamos um novo arquivo no diretório "lib" chamado "filepicker.js". Copiamos o código do seletor de arquivos, e adicionamos a seguinte linha de código no fim dele:</p>
+
+<pre class="brush: js">exports.promptForFile = promptForFile;
+</pre>
+
+<p>Isso define a interface pública do novo módulo.</p>
+
+<p>Então "filepicker.js" deve parecer com isto:</p>
+
+<pre class="brush: js">var {Cc, Ci} = require("chrome");
+
+function promptForFile() {
+  var window = require("sdk/window/utils").getMostRecentBrowserWindow();
+  const nsIFilePicker = Ci.nsIFilePicker;
+
+  var fp = Cc["@mozilla.org/filepicker;1"]
+           .createInstance(nsIFilePicker);
+  fp.init(window, "Select a file", nsIFilePicker.modeOpen);
+  fp.appendFilters(nsIFilePicker.filterAll | nsIFilePicker.filterText);
+
+  var rv = fp.show();
+  if (rv == nsIFilePicker.returnOK || rv == nsIFilePicker.returnReplace) {
+    var file = fp.file;
+    // Get the path as string. Note that you usually won't
+    // need to work with the string paths.
+    var path = fp.file.path;
+    // work with returned nsILocalFile...
+  }
+  return path;
+}
+
+exports.promptForFile = promptForFile;
+</pre>
+
+<h3 id="md5.js">md5.js</h3>
+
+<p>Próximo, crie um outro arquivo no "lib", chamado "md5.js". Copie o código do hashing, e adicione esta linha ao seu fim:</p>
+
+<pre class="brush: js">exports.hashFile = md5File;</pre>
+
+<p>O arquivo completo parece com isto:</p>
+
+<pre class="brush: js">var {Cc, Ci} = require("chrome");
+
+//retorna o código hexadecimal de dois dígitos para um byte
+function toHexString(charCode) {
+  return ("0" + charCode.toString(16)).slice(-2);
+}
+
+function md5File(path) {
+  var f = Cc["@mozilla.org/file/local;1"]
+          .createInstance(Ci.nsILocalFile);
+  f.initWithPath(path);
+  var istream = Cc["@mozilla.org/network/file-input-stream;1"]
+                .createInstance(Ci.nsIFileInputStream);
+  // abrindo para leitura
+  istream.init(f, 0x01, 0444, 0);
+  var ch = Cc["@mozilla.org/security/hash;1"]
+           .createInstance(Ci.nsICryptoHash);
+  // nós queremos usar o algoritmo MD5
+  ch.init(ch.MD5);
+  // isto diz para updateFromStream ler o arquivo todo
+  const PR_UINT32_MAX = 0xffffffff;
+  ch.updateFromStream(istream, PR_UINT32_MAX);
+  // passe false aqui para conseguir os dados binários de volta
+  var hash = ch.finish(false);
+
+  // converte o hash binário para hex string.
+  var s = Array.from(hash, (c, i) =&gt; toHexString(hash.charCodeAt(i))).join("");
+  return s;
+}
+
+exports.hashFile = md5File;</pre>
+
+<h3 id="main.js">main.js</h3>
+
+<p>Finalmente, atualizamos o main.js para importar estes dois módulos e usá-los:</p>
+
+<pre class="brush: js">var filepicker = require("./filepicker.js");
+var md5 = require("./md5.js");
+
+require("sdk/ui/button/action").ActionButton({
+  id: "show-panel",
+  label: "Show Panel",
+  icon: {
+    "16": "./icon-16.png"
+  },
+  onClick: function() {
+    console.log(md5.hashFile(filepicker.promptForFile()));
+  }
+});</pre>
+
+<p>Você pode distribuir estes módulos para outros desenvolvedores, também. Eles podem copia-los em algum lugar do add-on, e inclui-los usando <code>require()</code> do mesmo modo.</p>
+
+<h3 id="Aprendendo_Mais">Aprendendo Mais</h3>
+
+<p>Para ver alguns módulos que as pessoas já desenvolveram, veja a página <a href="https://github.com/mozilla/addon-sdk/wiki/Community-developed-modules">community-developed</a>. Para aprender como usar módulos de terceiros em seu próprio código, veja o tutorial<a href="/en-US/Add-ons/SDK/Tutorials/Add_a_Menu_Item_to_Firefox"> adicionando itens de menu</a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/getting_started_(jpm)/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/getting_started_(jpm)/index.html
new file mode 100644
index 0000000000..9190e825ab
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/getting_started_(jpm)/index.html
@@ -0,0 +1,155 @@
+---
+title: Começando (jpm)
+slug: Mozilla/Add-ons/SDK/Tutorials/Getting_Started_(jpm)
+tags:
+  - Add-on SDK
+  - JPM
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Getting_Started_(jpm)
+---
+<div class="note">
+<p>O Add-on SDK inclui uma ferramenta de linha de comando que você usa para inicializar, executar, testar, e empacotar add-ons. A ferramenta de linha de comando atual é chamada de jpm, e é baseada no <a href="http://nodejs.org/">Node.js</a>. Ela substitui a ferramenta antiga cfx.</p>
+
+<p>Você pode usar o jpm do Firefox 38 em diante.</p>
+
+<p>Este artigo descreve como desenvolver usando jpm.</p>
+</div>
+
+<p>Este tutorial ensina a criação de uma add-on simples usando o SDK.</p>
+
+<h2 id="Pré-requisitos"><span class="short_text" id="result_box" lang="pt"><span class="hps">Pré-requisitos</span></span></h2>
+
+<p>Para criar add-ons para Firefox usando o SDK, você precisará:</p>
+
+<ul>
+ <li>Firefox versão 38 ou anteriores. Se você precisar trabalhar com versões anteriores do Firefox, você precisará usar a ferramenta cfx. Veja as instruções em <a href="/en-US/Add-ons/SDK/Tutorials/Getting_started">getting started with cfx</a>.</li>
+ <li>a ferramenta de linha de comando jpm. Veja instruções para <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tools/jpm#Installation">instalação do jpm</a>. Uma vez que você fez isso, <span class="short_text" id="result_box" lang="pt"><span class="hps">você vai</span> <span class="hps">estar a olhar para</span> <span class="hps">um prompt de comando</span><span>.</span></span></li>
+</ul>
+
+<h2 id="Inicializando_um_add-on_vazio">Inicializando um add-on vazio</h2>
+
+<p>No promp de comando, crie um novo diretório. Navegue até ele, digite <code>jpm init</code>, e tecle enter:</p>
+
+<pre>mkdir my-addon
+cd my-addon
+jpm init
+</pre>
+
+<p>Você será instado à fornecer algumas informações para seu add-on: isso será usado para criar o arquivo <a href="/en-US/Add-ons/SDK/Tools/package_json">package.json</a> do seu add-on. Por enquanto, apenas pressione enter para aceitar o padrão para cada propriedade. Para mais informação sobre <code>jpm init</code>, veja o <a href="/en-US/Add-ons/SDK/Tools/jpm#Command_reference">jpm command reference</a>.</p>
+
+<p>Uma vez que você forneceu um valor ou aceitou o padrão para estas propriedades, será apresentado a você o conteúdo completo do "package.json" e instado a aceitá-lo.</p>
+
+<h2 id="Implementando_o_add-on">Implementando o add-on</h2>
+
+<p>Agora você pode escrever o código do add-on. A menos que você mudou o valor de entrada ("main" no package.json), ele vai no arquivo "index.js" na raiz de seu add-on. Este arquivo foi criado para você no passo anterior. Abra-o e adicione o seguinte código:</p>
+
+<pre class="brush: js">var buttons = require('sdk/ui/button/action');
+var tabs = require("sdk/tabs");
+
+var button = buttons.ActionButton({
+  id: "mozilla-link",
+  label: "Visit Mozilla",
+  icon: {
+    "16": "./icon-16.png",
+    "32": "./icon-32.png",
+    "64": "./icon-64.png"
+  },
+  onClick: handleClick
+});
+
+function handleClick(state) {
+  tabs.open("http://www.mozilla.org/");
+}
+</pre>
+
+<div class="note">
+<p>Note que os "pontos de entrada" padrões para "index.js" no jpm, signifca que seu arquivo principal é "index.js", e é encontrado diretamente na raiz do seu add-on.</p>
+
+<p>No cfx, o ponto de entrada padrão para "main.js", e é localizado no diretório "lib" na raiz no add-on.</p>
+</div>
+
+<p>Salve o arquivo.</p>
+
+<p>Próximo, crie um diretório chamado "data" na raiz do add-on, e salve estes três ícones no diretório "data":</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7635/icon-16.png" style="height: 16px; width: 16px;"></td>
+   <td>icon-16.png</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7637/icon-32.png" style="height: 32px; width: 32px;"></td>
+   <td>icon-32.png</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7639/icon-64.png" style="height: 64px; width: 64px;"></td>
+   <td>icon-64.png</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Volte ao promp de comando, digite:</p>
+
+<pre>jpm run</pre>
+
+<p>Este é o comando jpm para executar uma nova instância do Firefox com seu add-on instalado.</p>
+
+<p>Quando o Firefox lança, no canto superior direito do navegador você verá um ícone com o logotipo do Firefox. Clique no ícone, e uma nova tab abrirá com o site <a href="http://www.mozilla.org/" rel="noreferrer">http://www.mozilla.org/</a> carregado.</p>
+
+<p>Isso é tudo que este add-on faz. Ele usa dois módulos SDK: o módulo <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a>, que lhe permite adicionar botões ao navegador, e o módulo tab, que lhe permite executar operações básicas com o módulo <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs" rel="noreferrer">tabs</a>. Neste caso, nós criamos um botão cujo ícone é o ícone do Firefox, e adicionamos um manipulado de click que carrega a página do Mozilla na nova tab.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7643/mozilla-button.png" style="display: block; height: 221px; margin-left: auto; margin-right: auto; width: 382px;">Tente editar este arquivo. Por exemplo, nós poderíamos mudar a página que está sendo carregada:</p>
+
+<pre class="brush: js">var buttons = require('sdk/ui/button/action');
+var tabs = require("sdk/tabs");
+
+var button = buttons.ActionButton({
+  id: "mozilla-link",
+  label: "Visit Mozilla",
+  icon: {
+    "16": "./icon-16.png",
+    "32": "./icon-32.png",
+    "64": "./icon-64.png"
+  },
+  onClick: handleClick
+});
+
+function handleClick(state) {
+  tabs.open("https://developer.mozilla.org/");
+}</pre>
+
+<p>No promp de comando, execute <code>jpm run</code> novamente. Desta vez clicando lhe levará para <a href="https://developer.mozilla.org/">https://developer.mozilla.org/</a>.</p>
+
+<h2 id="Empacotando_o_add-on">Empacotando o add-on</h2>
+
+<p>Quando você terminou o add-on e estiver preparado para distribui-lo, você precisará empacotá-lo como um arquivo XPI. Esta é a forma instalável dos add-ons do Firefox. Você pode distribuir os arquivos XPI por si mesmo ou publicá-los em <a href="https://addons.mozilla.org" rel="noreferrer">https://addons.mozilla.org</a> então outros usuários podem baixar eles.</p>
+
+<p>Para construir um XPI, apenas execute o comando <code>jpm xpi</code> do diretório do add-on:</p>
+
+<pre>jpm xpi
+</pre>
+
+<p>Você deveria ver uma mensagem como:</p>
+
+<pre>JPM info Successfully created xpi at /path/to/getting-started/@getting-started.xpi
+</pre>
+
+<p>Para testar que isso funciona, tente instalar o arquivo XPI em sua própria instalação do Firefox. Você pode fazer isso pressionando a combinação de teclas Ctrl+O (Cmd+O no Mac) de dentro do Firefox, ou selecionando o menu "Open" do menu "Arquivo" do Firefox. Isso trará uma caixa de diálogo de seleção de arquivo: navegue para o arquivo "@getting-started.xpi", abra-o e siga o prompt para instalar o add-on.</p>
+
+<h2 id="Resumo">Resumo</h2>
+
+<p>Neste tutorial nós construímos e empacotamos um add-on usando três comandos:</p>
+
+<ul>
+ <li><code>jpm init</code> para inicializar um modelo de add-on vazio</li>
+ <li><code>jpm run</code> para executar uma nova instância do Firefox com o add-on instalado, então nós testamos ele</li>
+ <li><code>jpm xpi</code> para empacotar o add-on em um arquivo XPI para distribuição</li>
+</ul>
+
+<p>Há três comandos principais que você usará quando desenvolvendo add-ons com SDK. Há documentação abrangente no <a href="/en-US/Add-ons/SDK/Tools/jpm" rel="noreferrer">reference documentation</a> cobrindo todos os comandos  que você pode usar e todas as opções que eles levam.</p>
+
+<p>O código do add-on por si usa dois módulos SDK, <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a> e <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs" rel="noreferrer">tabs</a>. Há documentação de referência para todas as APIS do SDK tanto as de <a href="/en-US/Add-ons/SDK/High-Level_APIs" rel="noreferrer">alto nível</a> quanto as de <a href="/en-US/Add-ons/SDK/Low-Level_APIs" rel="noreferrer">baixo nível</a>.</p>
+
+<h2 id="O_que_vem_agora">O que vem agora?</h2>
+
+<p>Para ter uma ideia das coisas que você pode fazer com as APIs do SDK, tente trabalhar com alguns dos <a href="/en-US/Add-ons/SDK/Tutorials" rel="noreferrer">tutoriais</a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/index.html
new file mode 100644
index 0000000000..6d5484bc46
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/index.html
@@ -0,0 +1,144 @@
+---
+title: Tutoriais
+slug: Mozilla/Add-ons/SDK/Tutorials
+tags:
+  - Add-on SDK
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials
+---
+<p>Esta página lista artigos úteis e práticos sobre como executar tarefas específicas usando o SDK.</p>
+
+<hr>
+<h3 id="Começando">Começando</h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Installation">Instalação</a></dt>
+ <dd>Download, instalar, e inicializar o SDK no Windows, OS X e Linux.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Troubleshooting">Solução de problemas </a></dt>
+ <dd>Algumas dicas para resolver problemas comuns e conseguir mais ajuda.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="https://developer.mozilla.org/pt-BR/docs/Mozilla/Add-ons/SDK/Tutorials/Come%C3%A7ando">Começando </a></dt>
+ <dd>Criação passo-a-passo de um add-on simples com o SDK.</dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h3 id="Criando_interfaces_de_usuário"><a name="create-user-interfaces">Criando interfaces de usuário</a></h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="https://developer.mozilla.org/pt-BR/docs/Mozilla/Add-ons/SDK/Tutorials/Adding_a_Button_to_the_Toolbar">Adicionando um botão de barra de ferramenta</a></dt>
+ <dd>Anexe um botão à barra de ferramentas de add-on do Firefox.</dd>
+ <dt><a href="https://developer.mozilla.org/pt-BR/docs/Mozilla/Add-ons/SDK/Tutorials/Adicionar_uma_item_de_menu_ao_Firefox">Adicione um item de menu ao Firefox</a></dt>
+ <dd>Adicione itens ao menu principal do Firefox.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="https://developer.mozilla.org/pt-BR/docs/Mozilla/Add-ons/SDK/Tutorials/Mostrar_um_Popup">Mostre um popup</a></dt>
+ <dd>Mostre um diálogo popup implementado com HTML e JavaScript.</dd>
+ <dt><a href="https://developer.mozilla.org/pt-BR/docs/Mozilla/Add-ons/SDK/Tutorials/Adicione_um_Item_ao_Menu_de_Contexto">Adicione um item ao menu de contexto</a></dt>
+ <dd>Adicione itens ao menu de contexto do Firefox.</dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h3 id="Interagindo_com_o_navegador"><a name="interact-with-the-browser">Interagindo com o navegador</a></h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="https://developer.mozilla.org/pt-BR/docs/Mozilla/Add-ons/SDK/Tutorials/Abra_uma_P%C3%A1gina_Web">Abra uma página</a></dt>
+ <dd>Abra uma página web em um novo navegador ou janela usando o módulo tabs, e acesse seu conteúdo.</dd>
+ <dt><a href="https://developer.mozilla.org/pt-BR/docs/Mozilla/Add-ons/SDK/Tutorials/captura_de_carregamento_da_pagina">Observando páginas carregadas</a></dt>
+ <dd>Use o módulo tabs para conseguir notificação quando novas páginas são carregadas, e acesse seu conteúdo.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="https://developer.mozilla.org/pt-BR/docs/Mozilla/Add-ons/SDK/Tutorials/Lista_de_Tabs_Abertas">Capturando a lista de tabs abertas</a></dt>
+ <dd>Use o módulo tab para interagir pelas tabs atualmente abertas, e acesse seu conteúdo.</dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h3 id="Modificando_páginas_web"><a name="modify-web-pages">Modificando páginas web</a></h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Modifying_Web_Pages_Based_on_URL">Modificar páginas web baseado na URL</a></dt>
+ <dd>Crie um filtro para páginas web baseado em sua URL: sempre que uma página web cuja URL combinar com o filtro carregado, executa um script espeficado nela.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Modifying_the_Page_Hosted_by_a_Tab">Modificar a página web ativa</a></dt>
+ <dd>Carrega dinamicamente um script dentro da página web ativa atualmente.</dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h3 id="Técnicas_de_desenvolvimento"><a name="development-techniques">Técnicas de desenvolvimento</a></h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Logging">Restro de log</a></dt>
+ <dd>Registra mensagens para o console para propósito de diagnóstico.</dd>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Creating_reusable_modules">Criando módulos reutilizáveis</a></dt>
+ <dd>Estruture seu add-on em módulos separados deixando mais fácil o desenvolvimento, depuração e manutenção. Crie pacotes reutilizáveis contendo seus módulos, assim outros desenvolvedores de add-on podem usá-los também.</dd>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Unit_testing">Teste de unidade </a></dt>
+ <dd>Escrevendo e executando teste de unidade usando framework de teste do SDK.</dd>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Chrome_authority">Chrome authority </a></dt>
+ <dd>Conseguindo acesso ao objeto Components, permitindo a seu add-on carregar e usar qualquer objeto XPCOM.</dd>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Creating_event_targets">Criando event targets </a></dt>
+ <dd>Permite aos objeto que você define emitir seus próprios eventos.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Listening_for_load_and_unload">Observando load e unload </a></dt>
+ <dd>Receba notificações quando seu add-on é caregado ou descarregado pelo Firefox, e passa argumentos do seu add-on a partir da linha de comando.</dd>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Add_a_Menu_Item_to_Firefox">Usando módulos de terceiros</a></dt>
+ <dd>Instale e use módulos adicionais que não são fornecidos com o SDK.</dd>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/l10n">Localização </a></dt>
+ <dd>Escrever código localizável.</dd>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Mobile_development">Desenvolvimento mobile</a></dt>
+ <dd>Develop add-ons for Firefox Mobile on Android.</dd>
+ <dt><a href="/en-US/Add-ons/Add-on_Debugger">Depuração do Add-on</a></dt>
+ <dd>Depure o JavaScript do seu add-on.</dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h3 id="Colocando_tudo_junto"><a name="putting-it-together">Colocando tudo junto</a></h3>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/Add-ons/SDK/Tutorials/Annotator">Add-on Annotator</a></dt>
+ <dd>Um guia para um add-on relativamente complexo.</dd>
+</dl>
+</div>
+</div>
+
+<p> </p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/l10n/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/l10n/index.html
new file mode 100644
index 0000000000..4a762bda9b
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/l10n/index.html
@@ -0,0 +1,380 @@
+---
+title: Localização
+slug: Mozilla/Add-ons/SDK/Tutorials/l10n
+tags:
+  - Add-on SDK
+  - Localização
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/l10n
+---
+<p>O SDK suporta localização de strings que aparecem no:</p>
+
+<ul>
+ <li><a href="/en-US/Add-ons/SDK/Tutorials/l10n#Using_Localized_Strings_in_JavaScript">o código JavaScript principal do seu add-on</a></li>
+ <li><a href="/en-US/Add-ons/SDK/Tutorials/l10n#Using_Localized_Strings_in_HTML">arquivos HTML empacotados com seu add-on</a></li>
+ <li><a href="/en-US/Add-ons/SDK/Tutorials/l10n#Using_Localized_Strings_in_Preferences">os campos <code>title</code> e <code>description</code> das preferências do seu add-on's</a>.</li>
+</ul>
+
+<p>Ele, ainda, não suporta localização de conteúdo CSS ou Scripts.</p>
+
+<h2 id="Strings_de_Localização">Strings de Localização</h2>
+
+<p>Strings traduzidas são mantidas em um diretório chamado "locale" no diretório principal do seu add-on, um arquivo para cada locale. Os arquivos:</p>
+
+<ul>
+ <li>use o formato <a href="http://en.wikipedia.org/wiki/.properties"><code>.properties</code></a></li>
+ <li>são chamados "xx-YY.properties", onde "xx-YY" é o nome da<a href="https://wiki.mozilla.org/L10n:Locale_Codes"> localidade</a> em questão</li>
+ <li>contém uma entrada para cada string que você quer localizar, consistindo de um identificador para a string e sua tradução para aquela localidade, no formado <code>identificador=tradução</code>.</li>
+ <li>precisa usar UTF-8 sem codificação BOM</li>
+</ul>
+
+<p>Suponha que seu add-on contém uma única string localizável, representada em Inglês como "Hello!", e você quer suprir com localizações US English e Francês.</p>
+
+<p>Você adiciona dois arquivos ao diretório "locale":</p>
+
+<pre>my-addon/
+         data
+         lib
+         locale/
+                en-US.properties
+                fr-FR.properties
+</pre>
+
+<p>"en-US.properties" contém isto:</p>
+
+<pre>hello_id= Hello!
+</pre>
+
+<p>"fr-FR.properties" contém isto:</p>
+
+<pre>hello_id= Bonjour !
+</pre>
+
+<p>Agora que sempre que em seu código JavaScript ou HTML pedir  ao sistema de localização pela tradução do identificador <code>hello_id</code>, ele pegará a tradução correta para a localidade atual.</p>
+
+<h2 id="Usando_Strings_de_Localização_no_HTML">Usando Strings de Localização no HTML</h2>
+
+<div class="note">
+<p>Este exemplo usa a API <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a>, que está disponível somente do Firefox 29 em diante.</p>
+</div>
+
+<p>Para referenciar uma string localizada do HTML, adicione um atributo <code>data-l10n-id</code> à tag HTML onde você quiser que a string localizada apareça, e atribua o identificador a ele:</p>
+
+<pre class="brush: html">&lt;html&gt;
+  &lt;body&gt;
+    &lt;h1 data-l10n-id="hello_id"&gt;&lt;/h1&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>Então você pode usar o arquivo HTML para construir sua interface, por exemplo dentro de um painel:</p>
+
+<pre class="brush: js">var button = require("sdk/ui/button/action").ActionButton({
+  id: "localized-hello",
+  label: "Localized hello",
+  icon: "./icon-16.png",
+  onClick: function() {
+    hello.show();
+  }
+});
+
+var hello = require("sdk/panel").Panel({
+  height: 75,
+  width: 150,
+  contentURL: require("sdk/self").data.url("my-panel.html")
+});</pre>
+
+<p>Dados os arquivos locale para "en-US" e "fr-FR" que fornece uma tradução para o <code>hello_id</code>, o painel agora mostrará o "Hello!" ou "Bonjour !", de acordo com a localidade atual:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7663/bonjour.png" style="height: 160px; width: 255px;"><img alt="" src="https://mdn.mozillademos.org/files/7665/hello.png" style="height: 160px; width: 255px;"></p>
+
+<p>A tradução é inserida dentro do nó que tem o atributo<code> data-l10n-id</code>. Qualquer conteúdo anteriormente existente é substituído.</p>
+
+<p>A string é inserida como texto, então você não pode inserir HTML usando declarações como:</p>
+
+<pre>hello_id= &lt;blink&gt;Hello!&lt;/blink&gt;
+</pre>
+
+<h3 id="Localizando_Atributos_de_Elementos">Localizando Atributos de Elementos</h3>
+
+<div class="geckoVersionNote">Esta característica é nova no Firefox 39</div>
+
+<p><br>
+ Você pode localizar certos atributos de elementos com um l10n-id configurando seu valor com o l10-id.attributeName no arquivo da propriedade como isto:</p>
+
+<pre>hello_id.accesskey= H</pre>
+
+<p>Os seguintes atributos são suportados:</p>
+
+<ul>
+ <li><strong>accesskey</strong></li>
+ <li><strong>alt</strong></li>
+ <li><strong>label</strong></li>
+ <li><strong>title</strong></li>
+ <li><strong>placeholder</strong></li>
+</ul>
+
+<p><span id="result_box" lang="pt"><span class="hps">Além disso, a</span> <span class="hps">localização do</span>s atributos <span class="hps">ARIA</span> <span class="hps">aria</span><span>-label,</span> <span class="hps">aria</span><span class="atn">-</span><span>valuetext</span> <span class="hps">e</span> <span class="hps">aria</span><span class="atn">-</span><span>moz</span><span class="atn">-</span><span>dica</span> <span class="hps">são suportados</span> <span class="hps">com os mesmos</span> apelidos que <span class="hps">no</span> <span class="hps">Firefox</span> <span class="hps">OS</span><span>:</span></span></p>
+
+<ul>
+ <li><strong>ariaLabel</strong></li>
+ <li><strong>ariaValueText</strong></li>
+ <li><strong>ariaMozHint</strong></li>
+</ul>
+
+<h2 id="Usando_Strings_de_Localização_no_JavaScript">Usando Strings de Localização no JavaScript</h2>
+
+<p>Para referenciar Strings de Localização do código principal do seu add-on, você faz isso:</p>
+
+<pre class="brush: js">var _ = require("sdk/l10n").get;
+console.log(_("hello_id!"));</pre>
+
+<p><span>A atribuição de "_" em particular não é requerida, mas é uma convenção da ferramente <a href="https://www.gnu.org/software/gettext/gettext.html">gettext </a>e torna possível trabalhar com ferramentas existentes que esperam "_" para indicar Strings de Localização.</span></p>
+
+<ol>
+ <li>Importe o módulo <code>l10n</code>, atribua sua função <code>get</code> o "<code>_</code>" (underscore).</li>
+ <li>Envolva todas as referências a Strings de Localização com uma função <code>_()</code>.</li>
+</ol>
+
+<p>Se você executar ela você verá a saída esperada para a localidade atual:</p>
+
+<pre>info: Hello!
+</pre>
+
+<pre>info: Bonjour !
+</pre>
+
+<p>Observe que você não pode <code>require()</code> módulos nos scripts de conteúdo, você ainda não pode referenciar strings de localização nos scripts de conteúdo.</p>
+
+<h3 id="Plurais">Plurais</h3>
+
+<p>O módulo <code>l10n</code> suporta formas plurais. Diferentes línguas tem diferentes regras para formação de plurais. Por exemplo, Inglês tem duas formas: uma forma singular para "one", e uma forma plural para "everything else, including zero":</p>
+
+<pre>one tomato
+no tomatoes
+two tomatoes
+</pre>
+
+<p>Mas a Russa tem diferentes formas para números terminados em 1 (exceto 11), números terminados em 2-4 (exceto 12-14) e outros números:</p>
+
+<pre>один помидор     // one tomato
+два помидора     // two tomatoes
+пять помидоров   // five tomatoes
+</pre>
+
+<p>O SDK usa dados do <a href="http://cldr.unicode.org/index">Unicode CLDR</a> para descrever as diferentes formas de plural usadas pelas diferentes línguas.</p>
+
+<h4 id="Formas_Plurais_do_Unicode_CLDR">Formas Plurais do Unicode CLDR</h4>
+
+<p>O projeto Unicode CLDR define um esquema que descreve a regras de plural de uma língua em particular. Neste esquema uma  língua mapeia cada abrangência distinta de números para um ou mais formas, identificado pelas categorias: <em>zero, one, two, few, many, </em>e <em>other</em>.</p>
+
+<p>Inglês tem duas formas, que podem ser descritas pelo mapeamento "1" para "one" e "everything else" para "other":</p>
+
+<pre>one   → n is 1;
+other → everything else
+</pre>
+
+<p>A Russa usa quatro formas, que podem ser descritas como se segue:</p>
+
+<pre>one   → n mod 10 is 1 and n mod 100 is not 11;
+few   → n mod 10 in 2..4 and n mod 100 not in 12..14;
+many  → n mod 10 is 0 or n mod 10 in 5..9 or n mod 100 in 11..14;
+other → everything else
+</pre>
+
+<p>As regras de plural para todas as línguas podem ser encontrada na página de <a href="http://unicode.org/repos/cldr-tmp/trunk/diff/supplemental/language_plural_rules.html">Regras para Plural das Línguas</a> do CLDR (embora esta tabela esteja desatualizada se comparada com a <a href="http://unicode.org/repos/cldr/trunk/common/supplemental/plurals.xml">CLDR XML source</a>).</p>
+
+<h4 id="Formas_Plurais_no_SDK">Formas Plurais no SDK</h4>
+
+<p>No código, você fornece uma parâmetro extra ao lado do identificador, descrevendo quantos itens há:</p>
+
+<pre class="brush: js">var _ = require("sdk/l10n").get;
+console.log(_("tomato_id"));
+console.log(_("tomato_id", 1));
+console.log(_("tomato_id", 2));
+console.log(_("tomato_id", 5));
+console.log(_("tomato_id", .5));</pre>
+
+<p>No arquivo <code>.properties</code> para cada língua você pode definir uma localização diferente para cada forma de plural possível naquela língua, usando palavras reservadas do CLDR. Então no Inglês nós teríamos duas localizações de plural (observe que a categoria "other" <strong>não</strong> leva palavra reservada do CLDR:</p>
+
+<pre># en-US translations
+tomato_id[one]= %d tomato
+tomato_id= %d tomatoes
+</pre>
+
+<p>Na Russa nós teríamos quatro localizações de plural:</p>
+
+<pre># ru-RU translations
+tomato_id[one]= %d помидор
+tomato_id[few]= %d помидора
+tomato_id[many]= %d помидоров
+tomato_id= %d помидоры
+</pre>
+
+<p>O módulo de localização por si só entende as definições CLDR para cada língua, permitindo a ele mapear, por exemplo, "2" no código e "few" no arquivo <code>ru-RU.properties</code>. Então ele pega e retorna a localização apropriada para a contagem fornecida.</p>
+
+<h3 id="Placeholders">Placeholders</h3>
+
+<p>O módulo <code>l10n</code> suporta placeholders, permitindo a você inserir uma string que não deveria ser localizada em uma que é. Os seguintes arquivos "en-US" e "fr-FR" ".properties" estão incluídos placeholders:</p>
+
+<pre># en-US translations
+hello_id= Hello <strong>%s</strong>!
+</pre>
+
+<pre># fr-FR translations
+hello_id= Bonjour <strong>%s</strong> !
+</pre>
+
+<p>Para usar placeholders, forneça uma string placeholder depois do identificador:</p>
+
+<pre class="brush: js">var _ = require("sdk/l10n").get;
+console.log(_("hello_id", "Bob"));
+console.log(_("hello_id", "Alice"));</pre>
+
+<p>Na localidade Inglês "en-US", isto nos é dado:</p>
+
+<pre>info: Hello Bob!
+info: Hello Alice!
+</pre>
+
+<p>No "fr-FR" nós conseguimos:</p>
+
+<pre>info: Bonjour Bob !
+info: Bonjour Alice !
+</pre>
+
+<h3 id="Ordenando_Placeholders">Ordenando Placeholders</h3>
+
+<p>Quando strings localizáveis podem levar dois ou mais placeholders, tradutores podem definir a ordem em que placeholders são inseridos, sem afetar o código.</p>
+
+<p>Primeiramente, isto é importante porque diferentes línguas tem regras diferentes para ordernar palavras. Mesmo dentro de uma mesma língua, embora traduzida, tradutores deve ter liberdade para definir a ordem.</p>
+
+<p>Por exemplo, suponha que nós queremos incluir uma string de localização designando a cidade de uma pessoa. Há dois placeholders: o nome da pessoa e o nome da cidade em que ela reside:</p>
+
+<pre class="brush: js">var _ = require("sdk/l10n").get;
+console.log(_("home_town_id", "Bob", "London"));</pre>
+
+<p>An English translator might want to choose between the following:</p>
+
+<pre>"&lt;town_name&gt; is &lt;person_name&gt;'s home town."
+</pre>
+
+<pre>"&lt;person_name&gt;'s home town is &lt;town_name&gt;"
+</pre>
+
+<p>Para escolher a primeira opção, o arquivo<code> .properties</code> pode ordenar o placeholders como:</p>
+
+<pre>home_town_id= %2s is %1s's home town.
+</pre>
+
+<p>Isso nos dá a seguinte saída:</p>
+
+<pre>info: London is Bob's home town.
+</pre>
+
+<h2 id="Usando_Strings_de_localização_em_Preferências">Usando Strings de localização em Preferências</h2>
+
+<p>Pela inclusão de uma estrutura <a href="/en-US/Add-ons/SDK/High-Level_APIs/simple-prefs"><code>"preferences"</code> no arquivo "package.json" do seu add-on</a>, você pode definir preferências para seu add-on que o usuário pode ver e editar usando o <a href="https://support.mozilla.org/en-US/kb/Using%20extensions%20with%20Firefox#w_how-to-change-extension-settings">gerenciador de add-ons </a>do Firefox.</p>
+
+<p>Preferências tem um campo <code>title</code> obrigatório e um campo <code>description</code> opcional. Há strings que aparecem ao lado da preferência no gerenciador de Add-on, para ajudar a explicar ao usuário o que a preferência significa.</p>
+
+<ul>
+ <li>
+  <p>Para fornecer formas localizadas do title da preferência, inclua uma entrada no arquivo "properties" cujo identificador seja o nome da preferência seguido por  <code>_title</code>, e cujo valor é o título da localidade.</p>
+ </li>
+ <li>
+  <p>Para fornecer forma localizada da descrição da preferência, inclui uma entrada em seu arquivo "properties" cujo identificador é o nome da preferência seguido por <code>_description</code>, e cujo valor é a descrição da localidade.</p>
+ </li>
+</ul>
+
+<p>Por exemplo, suponha que seu "package.json" defina uma única preferência:</p>
+
+<pre>{
+    "preferences": [
+        {
+            "type": "string",
+            "name": "monster_name",
+            "value": "Gerald",
+            "title": "Name"
+        }
+    ],
+    "name": "monster-builder",
+    "license": "MPL 2.0",
+    "author": "me",
+    "version": "0.1",
+    "fullName": "Monster Builder",
+    "id": "monster-builder@me.org",
+    "description": "Build your own monster"
+}
+</pre>
+
+<p>Em seu arquivo "en-US.properties", inclua estes dois itens:</p>
+
+<pre>monster_name_title= Name
+monster_name_description= What is the monster's name?
+</pre>
+
+<p>Em seu arquivo "fr-FR.properties", inclui a tradução francesa:</p>
+
+<pre>monster_name_title= Nom
+monster_name_description= Quel est le nom du monstre ?
+</pre>
+
+<p>Agora quando o local do navegador estiver configurado para "en-US", os usuários verão este Gerenciador de Add-on:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6525/preference-us.png" style="height: 77px; width: 571px;"></p>
+
+<p>Quando o local do navegador estiver configurado para "fr-FR", eles verão isto:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6523/preference-french.png"></p>
+
+<p>Os tipos de preferência de <code>menulist</code> e <code>radio</code> tem opções. O atributo <code>label</code> de cada opção é mostrado para o usuário. Se o arquivo de local tem uma entrada com o valor do atributo <code>label</code> prefixado com "{name}_options." como sua chave, onde {name} é o nome da preferência, seu valor é usado como rótulo por localização.</p>
+
+<h2 id="Usando_identificadores">Usando identificadores</h2>
+
+<p>Se o sistema de localização não pode encontrar uma entrada para um identificador em particular usando a localidade atual, então ele apenas retorna o identificador por si mesmo.</p>
+
+<p>Isto tem a bonita propriedade que você pode escrever add-on localizável, inteiramente funcional sem ter que escrever qualquer arquivo local. Você pode usar somente a linguagem padrão como seu identificador, e subsequentemente fornecer arquivos <code>.properties</code> para todos os locais adicionais que você quiser suportar.</p>
+
+<p>Por exemplo, no caso acima você poderia usar "Hello!" como o identificador, e apenas ter um arquivo <code>.properties</code> para a localidade "fr-FR":</p>
+
+<pre>Hello!= Bonjour !
+</pre>
+
+<p>Então quando a localidade é "en-US", o sistema falharia ao encontrar o arquivo  <code>.properties</code> file, e retornaria "Hello!".</p>
+
+<p>Porém, essa técnica torna difícil manter um add-on que tem muitas localizações, porque você estará usando a língua padrão tanto para strings de interface quanto chaves de tradução. Isto significa que se você quiser mudar o nome de uma string na língua padrão, ou consertar a digitação, então você quebrará todos os seus arquivos de tradução.</p>
+
+<h2 id="Locale_Updater">Locale Updater</h2>
+
+<p>O addon <a href="https://github.com/downloads/ochameau/locale-updater/locale-updater.xpi">locale updater</a> torna fácil atualizar arquivos de localidade. Uma vez que você o instalou, abra o Gerenciador de Add-on, e você verá um novo botão rotulado "Update l10n" próximo a cada add-on que você instalou:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6515/locale-updater.png"></p>
+
+<p>Clique no botão e você será instado a enviar um arquivo <code>.properties</code> para aquele add-on. Se você fornecer um novo arquivo, o locale do add-on será atualizado com o novo arquivo.</p>
+
+<h2 id="Limitações">Limitações</h2>
+
+<p>A localização atual suportada é o primeiro passo  ao inteiro suporte, e contem uma série de limitações.</p>
+
+<ul>
+ <li>
+  <p>Não há suporte para scripts de conteúdo ou arquivos CSS: no momento, você pode localizar strings que aparecem nos arquivos JavaScript que podem <code>require()</code> módulos SDK e em HTML.</p>
+ </li>
+ <li>
+  <p>A configuração dos arquivos de localidade é global por um add-on. Isto significa que um módulo não pode sobreescrever uma tradução mais geral: então um módulo <code>informal.js</code> não pode especificar que "hello_id" ocorrendo em seu código deveria ser traduzida para "Hi!".</p>
+ </li>
+ <li>
+  <p>A ferramenta SDK compila os arquivos de localidade em um formato JSON quando produzindo um XPI. Isso significa que traduções não podem localizar um add-on dando o XPI sozinho, mas deve ser dado acesso ao fonte do add-on.</p>
+ </li>
+ <li>
+  <p>O desenvolvedor deve manualmente montar o conjunto de strings localizáveis compõe os arquivos de localidade.</p>
+ </li>
+</ul>
+
+<h2 id="Veja_também_-_para_desenvolvedores_que_localização_em_add-on_que_não_são_do_SDK">Veja também - para desenvolvedores que localização em add-on que não são do SDK</h2>
+
+<ul>
+ <li>Como colocar localização em páginas html, arquivos xul, e arquivos js/jsm do add-on bootstrapped: <a href="/en-US/Add-ons/Bootstrapped_extensions#Localization_%28L10n%29">Bootstrapped Extensions :: Localization (L10n)</a></li>
+ <li>XUL School Localization Tutorial: <a href="/en-US/docs/Mozilla/Tech/XUL/Tutorial/Localization">DTD/Entities method</a> and <a href="/en-US/docs/Mozilla/Tech/XUL/Tutorial/Property_Files">Properties method</a></li>
+ <li><a href="/en-US/docs/Mozilla/Localization/Localizing_an_extension">Localizing an extension</a></li>
+</ul>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/lista_de_tabs_abertas/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/lista_de_tabs_abertas/index.html
new file mode 100644
index 0000000000..d3d537037d
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/lista_de_tabs_abertas/index.html
@@ -0,0 +1,67 @@
+---
+title: Lista de Tabs Abertas
+slug: Mozilla/Add-ons/SDK/Tutorials/Lista_de_Tabs_Abertas
+tags:
+  - Add-on SDK
+  - Listando tabs abertas
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/List_Open_Tabs
+---
+<div class="note">
+<p>Para seguir este tutorial você precisará ter <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Installation">instalado o SDK </a>e ter conhecimento <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Getting_Started_With_cfx">básico sobre cfx</a>.</p>
+
+<p>Este tutorial usa a API <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a>, que está disponível somente do Firefox 29 em diante.</p>
+</div>
+
+<p>Para listar as tabs abertas, você pode iterar sobre o objeto <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs"><code>tabs</code></a>.</p>
+
+<p>O add-on a seguir adiciona um <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a> que registra as URLs abertas nas tabs quando clicado:</p>
+
+<pre class="brush: js">require("sdk/ui/button/action").ActionButton({
+  id: "list-tabs",
+  label: "List Tabs",
+  icon: "./icon-16.png",
+  onClick: listTabs
+});
+
+function listTabs() {
+  var tabs = require("sdk/tabs");
+  for (let tab of tabs)
+    console.log(tab.url);
+}
+</pre>
+
+<p>Note que para fazer isso funcionar você precisa salvar um ícone para o botão no diretório "data" do seu add-on como "icon-15.png": você pode baixar o ícone daqui: <img alt="" src="https://mdn.mozillademos.org/files/7649/icon-16.png" style="height: 16px; width: 16px;">.</p>
+
+<p>Se você executar o add-on, carregar um grupo de tabs, e clicar no botão, você verá a saída no linha de comando do <a href="/en-US/Add-ons/SDK/Tutorials/Logging">console</a> que parece com isto:</p>
+
+<pre>info: http://www.mozilla.org/en-US/about/
+info: http://www.bbc.co.uk/
+</pre>
+
+<p>Você não consegue acesso direto a qualquer conteúdo hospedado na tab. Para acessar o conteúdo da tab você precisa anexar um script à tab usando <code>tab.attach()</code>. Este add-on anexa um script a todas as tabs abertas. O script adiciona uma borda vermelha ao documento da tab:</p>
+
+<pre class="brush: js">require("sdk/ui/button/action").ActionButton({
+  id: "list-tabs",
+  label: "List Tabs",
+  icon: "./icon-16.png",
+  onClick: listTabs
+});
+
+function listTabs() {
+  var tabs = require("sdk/tabs");
+  for (let tab of tabs)
+    runScript(tab);
+}
+
+function runScript(tab) {
+  tab.attach({
+    contentScript: "document.body.style.border = '5px solid red';"
+  });
+}
+</pre>
+
+<h2 id="Aprendendo_Mais">Aprendendo Mais</h2>
+
+<p>Para aprender mais sobre como trabalhar com tabs no SDK, veja a referência da API <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs"><code>tabs</code></a>.</p>
+
+<p>Para aprender mais sobre execução de scripts em tabs, veja o tutorial sobre uso do <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs#attach(options)"><code>tab.attach()</code></a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/listening_for_load_and_unload/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/listening_for_load_and_unload/index.html
new file mode 100644
index 0000000000..5e3818036f
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/listening_for_load_and_unload/index.html
@@ -0,0 +1,60 @@
+---
+title: Capturando Load e Unload
+slug: Mozilla/Add-ons/SDK/Tutorials/Listening_for_load_and_unload
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Listening_for_load_and_unload
+---
+<div class="note">
+<p><span>Para seguir este tutorial você precisará ter conhecimento <a href="/en-US/docs/Mozilla/Add-ons/SDK/Tutorials/Getting_Started_%28jpm%29">básico de <code>jpm</code></a>. </span></p>
+</div>
+
+<p>Se seu add-on exporta uma função chamada <code>main()</code>, então aquela função será chamada sempre que o add-on for carregado, e será passada uma string descrevendo a razão de ele ter sido carregado bem como qualquer argumento passado para ele. Se seu add-on exporta uma função chamada <code>onUnload()</code>, então esta função será chamada quando o add-on for descarregado, e será passada uma string descrevendo a razão da descarga.</p>
+
+<p>Você não tem que usar <code>exports.main()</code> ou <code>exports.onUnload()</code>. Você pode colocar o código do seu add-on no nível superior ao invés de envolver ele em uma atribuição de função para <code>exports.main()</code>. Ele será carregado nas mesmas circunstâncias, mas você não conseguirá acesso às razões da carga ou descarga dele bem como de seus argumentos.</p>
+
+<h2 id="exports.main()">exports.main()</h2>
+
+<p>O código <code>main.js</code> do seu add-on é executado assim que ele é carregado. Ele é carregado quando ele é instalado, habilitado ou quando inicia o Firefox.</p>
+
+<p>Se seu add-on exporta uma função chamada <code>main()</code>, aquela função será chamada imediatamente depois que o <code>main.js </code>esteja completamente avaliado, e depois de todas as declarações <code>require()</code> de nível superior serem executadas (então geralmente depois de todas módulos dependentes serem carregados).</p>
+
+<div>
+<div>
+<pre><span class="brush: js">exports.main = function (options, callbacks) {};</span></pre>
+</div>
+</div>
+
+<p><code>options</code> é um objeto descrevendo os parâmetros com os quais seu add-on foi carregado</p>
+
+<h3 id="options.loadReason">options.loadReason</h3>
+
+<p><code>options.loadReason</code> é uma das seguintes strings descrevendo a razão de seu add-on ter sido carregado:</p>
+
+<pre>install
+enable
+startup
+upgrade
+downgrade
+</pre>
+
+<h2 id="exports.onUnload()">exports.onUnload()</h2>
+
+<p>Se seu add-on exporta uma função chamada <code>onUnload()</code>, aquela função será chamando quando o add-on for descarregado.</p>
+
+<div>
+<div>
+<pre><span class="brush: js">exports.onUnload = function (reason) {};</span></pre>
+</div>
+</div>
+
+<h3 id="reason">reason</h3>
+
+<p><code>reason</code> é uma das seguintes strings descrevendo a razão do add-on ter sido descarregado:</p>
+
+<pre>uninstall
+disable
+shutdown
+upgrade
+downgrade
+</pre>
+
+<p>Devido ao <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=627432">bug 627432</a>, sua captura de descarga (<code style="font-size: 14px;">onUnload</code>) nunca será chamada com <code style="font-size: 14px;">uninstall</code>: ela somente é chamada com <code style="font-size: 14px;">disable</code>. Veja no comentário particular sobre este <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=627432#c12">bug</a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/logging/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/logging/index.html
new file mode 100644
index 0000000000..088d694408
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/logging/index.html
@@ -0,0 +1,55 @@
+---
+title: Logging
+slug: Mozilla/Add-ons/SDK/Tutorials/Logging
+tags:
+  - Add-on SDK
+  - console
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Logging
+---
+<div class="note">Para seguir este tutorial você precisa do <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Installation">SDK instalado</a> e <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Getting_Started_With_cfx">conhecimento básico de cfx</a>.</div>
+
+<p>O objeto DOM <a href="https://developer.mozilla.org/en/DOM/console"><code>console</code></a> é útil para depuração do JavaScript. Porque os objetos DOM não estão disponíveis para o código principal do add-on, o SDK fornece seu próprio objeto global <code>console</code> com a maiorira dos mesmos métodos do do <code>console </code>DOM, incluindo métodos para registrar erros, avisos, ou mensagens informativas. Você não tem que usar <code>require()</code> qualquer coisa para conseguir acesso ao console. Ele está disponível para você.</p>
+
+<p>O método <code>console.log()</code> imprime mensagens informativas:</p>
+
+<pre class="brush: js">console.log("Hello World");
+</pre>
+
+<p>Tente:</p>
+
+<ul>
+ <li>crie um novo diretório, e navegue até ele</li>
+ <li>execute <code>cfx init</code></li>
+ <li>abra "lib/main.js" e adicione a linha acima</li>
+ <li>execute <code>cfx run</code>, então <code>cfx run</code> novamente</li>
+</ul>
+
+<p>O Firefox iniciará, e a linha a seguir aparecerá na janela de comando que você usou para executar <code>cfx run</code>:</p>
+
+<pre>info: Hello World!
+</pre>
+
+<h2 id="console_em_Scripts_de_Conteúdo"><code>console</code> em Scripts de Conteúdo</h2>
+
+<p>Você pode usar console em <a href="/en-US/Add-ons/SDK/Guides/Content_Scripts">scripts de conteúdo</a> assim como no código principal do seu add-on. O add-on a seguir registra o conteúdo do HTML de toda a tab que o usuário carregar, chamando <code>console.log()</code> dentro do script de conteúdo:</p>
+
+<pre class="brush: js">require("sdk/tabs").on("ready", function(tab) {
+  tab.attach({
+    contentScript: "console.log(document.body.innerHTML);"
+  });
+});
+</pre>
+
+<h2 id="Saída_do_console">Saída do <code>console</code></h2>
+
+<p>Se você estiver executando seu add-on da linha de comando (por exemplo, executando<code> cfx run</code> ou <code>cfx test</code>) então as mensagens do console aparece no shell de comando usado.</p>
+
+<p>Se você instalou o add-on no Firefox então as mensagens aparecerão no <a href="/en-US/docs/Tools/Browser_Console">Console do Navegador</a> do Firefox.</p>
+
+<p>Mas note que <strong>por padrão, chamadas à <code>console.log()</code> não resultarão em qualquer saída no Console de Erro por qualquer add-on instalado</strong>: isso inclui add-ons instalados usando o Add-on Builder ou usando ferramentas como <a href="https://addons.mozilla.org/en-US/firefox/addon/autoinstaller/">Extension Auto-installer</a>.</p>
+
+<p>Veja <a href="/en-US/Add-ons/SDK/Tools/console#Logging_Levels">"Logging Levels"</a> na documentação de referência para mais informações.</p>
+
+<h2 id="Aprendendo_Mais">Aprendendo Mais</h2>
+
+<p>Para a API completa do <code>console</code>, veja sua <a href="/en-US/Add-ons/SDK/Tools/console">referência da API</a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/modifying_the_page_hosted_by_a_tab/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/modifying_the_page_hosted_by_a_tab/index.html
new file mode 100644
index 0000000000..6b8f02c265
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/modifying_the_page_hosted_by_a_tab/index.html
@@ -0,0 +1,137 @@
+---
+title: Modificando a Página Aberta em uma Tab
+slug: Mozilla/Add-ons/SDK/Tutorials/Modifying_the_Page_Hosted_by_a_Tab
+tags:
+  - Add-on SDK
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Modifying_the_Page_Hosted_by_a_Tab
+---
+<div class="note">
+<p>Para seguir este tutorial, você precisará ter <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Installation">instalado add-on SDK</a> e ter conhecimento <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Getting_Started_(jpm)">básico jpm</a> (Firefox 38 em diante) ou <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Getting_Started_With_cfx">básico do cfx</a> .</p>
+
+<p>Este tutorial usa a API <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a>, que está disponível a partir do Firefox 29 em diante.</p>
+</div>
+
+<p>Para modificar uma página armazenada em uma tab em particular, carregue um ou mais <em>scripts de conteúdo</em> dentro dela usando o método attach() do objeto <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs">tab</a>. A tarefa desses scripts é interagir com o conteúdo web.</p>
+
+<p>Aqui está um exemplo simples:</p>
+
+<pre class="brush: js">var button = require("sdk/ui/button/action").ActionButton({
+  id: "style-tab",
+  label: "Style Tab",
+  icon: "./icon-16.png",
+  onClick: function() {
+    require("sdk/tabs").activeTab.attach({
+      contentScript: 'document.body.style.border = "5px solid red";'
+    });
+  }
+});</pre>
+
+<p>Execute esse exemplo, salve o ícone chamado "icon-16.png" no diretório "data" do add-on. Você To run this example, save an icon file named "icon-16.png" in add-on's "data" directory. Você pode baixar este ícone: <img alt="" src="https://mdn.mozillademos.org/files/7661/icon-16.png" style="height: 16px; width: 16px;">.</p>
+
+<p>This add-on creates a button with Mozilla favicon as an icon. It has a click handler which fetches the active tab and loads a script into the page hosted by the active tab. The script is specified using the <code>contentScript</code> option, and just draws a red border around the page.</p>
+
+<p>Then open any web page in the browser window, and click the button . You should see a red border appear around the page, like this:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6531/tabattach-bbc.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h2 id="Mantendo_o_script_de_conteúdo_em_arquivo_separado">Mantendo o script de conteúdo em arquivo separado</h2>
+
+<p>No exemplo acima, nós passamos o script de conteúdo como uma string.</p>
+
+<p>A menos que o script seja extremamente simples, o melhor é manter o script em um arquivo separado no diretório <code>data</code> do add-on. Isso deixa o código mais fácil para manter, depurar, e revisar. Faça isto, forneça a opção <code>contentScriptFile</code> não <code>contentScript</code>, cujo valor é uma URL apontando para um ou mais arquivos de script de conteúdo.</p>
+
+<p>Por exemplo, se nós salvarmos o script acima no diretório data do add-on em um arquivo chamado my-script.js:</p>
+
+<pre class="brush: js">var self = require("sdk/self");
+
+var button = require("sdk/ui/button/action").ActionButton({
+  id: "style-tab",
+  label: "Style Tab",
+  icon: "./icon-16.png",
+  onClick: function() {
+    require("sdk/tabs").activeTab.attach({
+      contentScriptFile: self.data.url("my-script.js")
+    });
+  }
+});
+</pre>
+
+<p>Você pode carregar mais de um script, e os scripts podem interagir diretamente um com o outro. Então você pode carregar o <a href="http://jquery.com/">jQuery</a>, e então seu script de conteúdo pode usá-lo.</p>
+
+<h2 id="Carregue_vários_arquivos_de_script_de_conteúdo">Carregue vários arquivos de script de conteúdo</h2>
+
+<p>O dado atribuído ao <code>contentScriptFile</code> pode ser um array. Os scripts serão carregados na mesma ordem em que estiverem no array.</p>
+
+<p>No exemplo a seguir, nós carregaremos dois scripts, <code>first.js</code> &amp; <code>second.js</code>. Ambos serão executados no mesmo contexto, então tudo publicamente definido no <code>first.js</code> será acessível do <code>second.js</code>.</p>
+
+<pre class="brush: js">// lib/main.js
+
+var self = require("sdk/self");
+var tabs = require("sdk/tabs");
+
+require("sdk/ui/button/action").ActionButton({
+  id: "load-several",
+  label: "load several scripts",
+  icon: "./icon-16.png",
+  onClick: function () {
+    tabs.activeTab.attach({
+      contentScriptFile: [self.data.url('first.js'),
+                          self.data.url('second.js')]
+    });
+  }
+});
+</pre>
+
+<h2 id="Comunicando_com_o_script_de_conteúdo">Comunicando com o script de conteúdo</h2>
+
+<p>O script do seu add-on e os scripts de conteúdo não podem acessar diretamente as variáveis ou funções um do outro, mas eles podem trocar mensagens.</p>
+
+<p>Para enviar mensagens de um lado para o outro, são usados o emitente de chamadas <code>port.emit()</code> e o recebendor <code>port.on()</code>.</p>
+
+<ul>
+ <li>No script de conteúdo, <code>port</code> é uma propriedade global do objeto <code>self</code>.</li>
+ <li>No script do add-on, <code>tab.attach()</code> retorna um objeto <a href="/en-US/Add-ons/SDK/Low-Level_APIs/content_worker">worker</a> contendo a propriedade <code>port</code> que você usa para enviar mensagens ao script de conteúdo.</li>
+</ul>
+
+<p>Vamos reescrever o exemplo acima para passar mensagens de um add-on para o script de conteúdo.</p>
+
+<p>O script de conteúdo agora precisa parecer com isto:</p>
+
+<pre class="brush: js">// "self" é um objeto global no script de conteúdo
+// Espera por um "drawBorder"
+self.port.on("drawBorder", function(color) {
+  document.body.style.border = "5px solid " + color;
+});
+</pre>
+
+<p>No script do add-on, nós enviaremos ao script de conteúdo uma mensagem "drawBorder" usando o objeto retornado de <code>attach()</code>:</p>
+
+<pre class="brush: js">var self = require("sdk/self");
+var tabs = require("sdk/tabs");
+
+var button = require("sdk/ui/button/action").ActionButton({
+  id: "style-tab",
+  label: "Style Tab",
+  icon: "./icon-16.png",
+  onClick: function() {
+    var worker = tabs.activeTab.attach({
+      contentScriptFile: self.data.url("my-script.js")
+    });
+    worker.port.emit("drawBorder", "red");
+  }
+});
+</pre>
+
+<p>A mensagem <code>drawBorder</code> não é uma mensagem embutida, é uma que este add-on definiu na chamada de <code>port.emit()</code>.</p>
+
+<h2 id="Injetando_CSS">Injetando CSS</h2>
+
+<p>Diferente da API <a href="/en-US/Add-ons/SDK/High-Level_APIs/page-mod"><code>page-mod</code></a>, <code>tab.attach()</code> não permite a você injetar CSS diretamente na página.</p>
+
+<p>Para modificar o estilo de uma página, você tem que usar JavaScript, como no exemplo acima.</p>
+
+<h2 id="Aprendendo_Mais">Aprendendo Mais</h2>
+
+<p>Para aprender mais sobre como trabalhar com tabs no SDK, veja o tutorial <a href="/en-US/Add-ons/SDK/Tutorials/Open_a_Web_Page">Abrindo uma Página da Web</a>, O tutorial <a href="/en-US/Add-ons/SDK/Tutorials/List_Open_Tabs">Lista de Tabs Abertas</a>, e a referência da API <a href="/en-US/Add-ons/SDK/High-Level_APIs/tabs"><code>tabs</code></a>.</p>
+
+<p>Para aprender mais sobre scripts de conteúdo, veja o guia de <a href="/en-US/Add-ons/SDK/Guides/Content_Scripts">scripts de conteúdo</a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/modifying_web_pages_based_on_url/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/modifying_web_pages_based_on_url/index.html
new file mode 100644
index 0000000000..4e846d75c7
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/modifying_web_pages_based_on_url/index.html
@@ -0,0 +1,228 @@
+---
+title: Modificando Página Web Baseado na URL
+slug: Mozilla/Add-ons/SDK/Tutorials/Modifying_Web_Pages_Based_on_URL
+tags:
+  - Add-on SDK
+  - content scripts
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Modifying_Web_Pages_Based_on_URL
+---
+<div class="note">Para seguir este tutorial, você precisará <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Installation">instalar o SDK</a> e ter conhecimento <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Getting_Started_(jpm)">básico de jpm</a> (Firefox 38 em diante) ou <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Getting_Started_With_cfx">básico de cfx</a>.</div>
+
+<p>Para modificar qualquer página que combine com um padrão particular (por exemplo, "http://example.org/") a medida que elas são carregadas, use o módulo <a href="/en-US/Add-ons/SDK/High-Level_APIs/page-mod"><code>page-mod</code></a>.</p>
+
+<p>Para criar um page-mod, você precisa de duas coisas:</p>
+
+<ul>
+ <li>Um ou mais <em>content scripts</em>(script de conteúdo) para executar cuja tarefa é interagir com o conteúdo web.</li>
+ <li>Um ou mais <em>patterns(padrões)</em> para combinar com URLs que você quer modificar.</li>
+</ul>
+
+<p>Um trecho simples de códingo onde o script de conteúdo é fornecido com a opção <code>contentScript</code> e o padrão de busca da URL é dado pela opção <code>include</code> como a seguir:</p>
+
+<pre class="brush: js">// Importe a API page-mod
+var pageMod = require("sdk/page-mod");
+
+// Crie um page-mod
+// Ele executará um script toda vez que uma URL ".org" é carregada
+// O script substitui o conteúdo da página por uma mensagem
+pageMod.PageMod({
+  include: "*.org",
+  contentScript: 'document.body.innerHTML = ' +
+                 ' "&lt;h1&gt;Page matches ruleset&lt;/h1&gt;";'
+});
+</pre>
+
+<p>Faça o seguinte:</p>
+
+<ul>
+ <li>Crie um novo diretório navegue para ele.</li>
+ <li>Execute <code>jpm init </code>ou <code>cfx init</code></li>
+ <li><code>Abra o arquivo index.js</code> e adicione o código acima (<code>lib/main.js se estiver usando</code> <code>cfx</code>)</li>
+ <li>Execute <code>jpm run </code>ou<code> cfx run</code>.</li>
+ <li>Abra no navegador o site <a href="http://www.ietf.org">ietf.org</a>.</li>
+</ul>
+
+<p>Abaixo é o que você deve ver.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6537/pagemod-ietf.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h2 id="Especificando_o_Padão_a_Combinar">Especificando o Padão a Combinar</h2>
+
+<p>O padrão de combinação usa a síntaxe <a href="/en-US/Add-ons/SDK/Low-Level_APIs/util_match-pattern"><code>match-pattern</code></a>. Você pode passar uma única string como padrão a combinar ou um array.</p>
+
+<h2 id="Mantendo_o_Conteúdo_do_Script_em_um_Arquivo_Separado">Mantendo o Conteúdo do Script em um Arquivo Separado</h2>
+
+<p>No exemplo acima, nós fornecemos o script de conteúdo como uma string.</p>
+
+<p>A menos que o script seja extremamente simples, é melhor manter o script em um arquivo separado. Isso torna o código mais fácil para manter, depurar, e revisar. Para fazer isso, você precisa:</p>
+
+<ul>
+ <li>Salvar o script no diretório "<code>data</code>" do add-on.</li>
+ <li>Use a opção <code>contentScriptFile</code> ao invés de <code>contentScript</code> e passe para ela a URL do script que pode ser obtida usando <code>self.data.url("my-script.js")</code>. A partir do Firefox 34, você pode usar <code>"./my-script.js"</code>.</li>
+</ul>
+
+<p>Por exemplo, se você salvar o script acima no diretório data do add-on em um arquivo chamado <code>my-script.js</code>:</p>
+
+<pre class="brush: js">// Importe a API page-mod
+var pageMod = require("sdk/page-mod");
+// Importe a API self
+var self = require("sdk/self");
+
+// Crie um page-mod
+// Ele executará um script toda vez que uma URL ".org" é carregada
+// O script substitui o conteúdo da página por uma mensagem
+pageMod.PageMod({
+  include: "*.org",
+  contentScriptFile: self.data.url("my-script.js")
+});</pre>
+
+<p>Ou a partir do Firefox 34:</p>
+
+<pre class="brush: js">// Importe a API page-mod
+var pageMod = require("sdk/page-mod");
+
+// Crie um page-mod
+// Ele executará um script toda vez que uma URL ".org" é carregada
+// O script substitui o conteúdo da página por uma mensagem
+pageMod.PageMod({
+  include: "*.org",
+  contentScriptFile: "./my-script.js"
+});</pre>
+
+<h2 id="Carregando_Múltiplos_Scripts_de_Conteúdo">Carregando Múltiplos Scripts de Conteúdo</h2>
+
+<p>Você pode carregar mais do que um script, e eles podem interagir um com o outro.</p>
+
+<p>Por exmeplo, você poderia reescrever o <code>my-script.js</code> para usar o jQuery.</p>
+
+<pre class="brush: js">$("body").html("&lt;h1&gt;Page matches ruleset&lt;/h1&gt;");
+</pre>
+
+<p>Então baixe o jQuery para o diretório <code>data</code> do add-on, e carregue o script e o jQuery juntos (tenha certeza de carregar o jQuery primeiro).</p>
+
+<pre class="brush: js">// Importe a API page-mod
+var pageMod = require("sdk/page-mod");
+// Importe a API self
+var self = require("sdk/self");
+
+// Crie um page-mod
+// Ele executará um script toda vez que uma URL ".org" é carregada
+// O script substitui o conteúdo da página por uma mensagem
+pageMod.PageMod({
+  include: "*.org",
+  contentScriptFile: [self.data.url("jquery-1.7.min.js"), self.data.url("my-script.js")]
+});
+</pre>
+
+<p>Você pode usar ambos <code>contentScript</code> e <code>contentScriptFile</code> no mesmo page-mod. Se você fizer isto, o script carregado usando <code>contentScriptFile</code> são carregados primeiro.</p>
+
+<pre class="brush: js">// Importe a API page-mod
+var pageMod = require("sdk/page-mod");
+// Importe a API self
+var self = require("sdk/self");
+
+// Crie um page-mod
+// Ele executará um script toda vez que uma URL ".org" é carregada
+// O script substitui o conteúdo da página por uma mensagem
+pageMod.PageMod({
+  include: "*.org",
+  contentScriptFile: self.data.url("jquery-1.7.min.js"),
+  contentScript: '$("body").html("&lt;h1&gt;Page matches ruleset&lt;/h1&gt;");'
+});
+</pre>
+
+<p>Note, porém, que você não pode carregar um script de um site web. O script deve ser carregado do <code>data</code>.</p>
+
+<h2 id="Comunicando_com_o_Script_de_Conteúdo">Comunicando com o Script de Conteúdo</h2>
+
+<p>Seu script do add-on e o script de conteúdo não podem acessar diretamente a variável de um ou outro ou chamar função dos outros, mas eles podem enviar mensagens um para o outro.</p>
+
+<p>Para enviar mensagens de um lado para o outro, use o emitente de chamadas <code>port.emit()</code> e receba respostas usando <code>port.on()</code>.</p>
+
+<ul>
+ <li>No script de conteúdo, <code>port</code> é uma propriedade do objeto global <code>self</code>.</li>
+ <li>No script do add-on, você precisa capturar evento no <code>onAttach</code> event passando um objeto <a href="/en-US/Add-ons/SDK/Low-Level_APIs/content_worker">worker</a> que contém a <code>port</code>.</li>
+</ul>
+
+<p>Vamos reescrever o exemplo acima para passar uma mensagem do add-on para o script de conteúdo. A mensagem conterá o novo conteúdo para inserir dentro do documento</p>
+
+<p>O script de conteúdo agora precisa parecer com isto:</p>
+
+<pre class="brush: js">// "self" é um objeto global no script de conteúdo
+// Espera pelas mensagens, e substitui o conteúdo do
+// documento com a mensagem recebida
+self.port.on("replacePage", function(message) {
+  document.body.innerHTML = "&lt;h1&gt;" + message + "&lt;/h1&gt;";
+});
+</pre>
+
+<p>No script do add-on, nós enviaremos ao script de conteúdo uma mensagem dentro do <code>onAttach</code>.</p>
+
+<pre class="brush: js">// Importe a API page-mod
+var pageMod = require("sdk/page-mod");
+// Importe a API self
+var self = require("sdk/self");
+
+// Crie um page-mod
+// Ele executará um script toda vez que uma URL ".org" é carregada
+// O script substitui o conteúdo da página por uma mensagem
+pageMod.PageMod({
+  include: "*.org",
+  contentScriptFile: self.data.url("my-script.js"),
+  // Envia ao script de conteúdo uma mensagem dentro de onAttach
+  onAttach: function(worker) {
+    worker.port.emit("replacePage", "Page matches ruleset");
+  }
+});
+</pre>
+
+<p>A mensagem <code>replacePage</code> não é uma mensagem embutida: é uma mensagem definida pelo add-on na chamada do <code>port.emit()</code>.</p>
+
+<div>
+<h2 id="Injetando_CSS">Injetando CSS</h2>
+
+<p><strong>Note que a característica descrita nesta seção é experimental no momento. Nós devemos provavelmente continuar suportando essa característica, mas os detalhes da API devem mudar.</strong></p>
+
+<p>Em vez de injetar JavaScript na página, você pode injetar CSS definindo a opção do <code>contentStyle</code> do mod-page.</p>
+
+<pre class="brush: js">var pageMod = require("sdk/page-mod").PageMod({
+  include: "*",
+  contentStyle: "body {" +
+                "  border: 5px solid green;" +
+                "}"
+});
+</pre>
+
+<p>Como com o <code>contentScript</code>, há uma opção correspondente para <code>contentStyleFile</code> que leva uma URL de um arquivo CSS situado no diretório "data"; é uma boa prática usar essa opção ao invés de <code>contentStyle</code> se o CSS é muito complexo.</p>
+
+<pre class="brush: js">var pageMod = require("sdk/page-mod").PageMod({
+  include: "*",
+  contentStyleFile: require("sdk/self").data.url("my-style.css")
+});
+</pre>
+
+<p>Ou, a partir do Firefox 34, você pode usar a versão mais simples:</p>
+
+<pre class="brush: js">var pageMod = require("sdk/page-mod").PageMod({
+  include: "*",
+  contentStyleFile: "./my-style.css"
+});</pre>
+</div>
+
+<h2 id="Aprendendo_mais">Aprendendo mais</h2>
+
+<p>Para aprender mais sobre o <code>page-mod</code>, veja a referência da API<a href="/en-US/Add-ons/SDK/High-Level_APIs/page-mod"> page</a>. Em particular, o construtor <code>PageMod</code> leva várias opções adicionais para controlar seu comportamento:</p>
+
+<ul>
+ <li>
+  <p>Por padrão, script de conteúdo não são anexados a qualuqer tab que já esteja aberta quando o page-mod é criado, e são anexados à iframes bem como documentos superiores. Para controlar esse comportamento use a opção <code>attachTo</code>.</p>
+ </li>
+ <li>
+  <p>Defina valores somente leitura acessíveis ao script de conteúdo usando a opção<code> contentScriptOptions</code>.</p>
+ </li>
+ <li>
+  <p>Por padrão, o script de conteúdo são anexados depois de todo o (DOM, JS, CSS, imagens) para a página ter sido carregado, no momento o evento <a href="/en-US/docs/Web/API/GlobalEventHandlers.onload">window.onload</a> dispara. Para controlar esse comportamento, use a opção <code>contentScriptWhen</code>.</p>
+ </li>
+</ul>
+
+<p>Para aprender mais sobre o script de conteúdo,, veja o guia <a href="/en-US/Add-ons/SDK/Guides/Content_Scripts">content scripts</a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/mostrar_um_popup/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/mostrar_um_popup/index.html
new file mode 100644
index 0000000000..b66c9fb06a
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/mostrar_um_popup/index.html
@@ -0,0 +1,165 @@
+---
+title: Mostrar um Popup
+slug: Mozilla/Add-ons/SDK/Tutorials/Mostrar_um_Popup
+tags:
+  - Add-on SDK
+  - Painel
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Display_a_Popup
+---
+<div class="note">
+<p>Para seguir este tutorial você precisará ter <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Installation">instalado o SDK</a> e ter conhecimento <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Getting_Started_With_cfx">básico sobre cfx</a>.</p>
+
+<p>Este tutorial usa a API <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a>, que está disponível somente do Firefox 29 em diante.</p>
+</div>
+
+<p>Para mostrar um popup de diálogo, use o módulo <a href="/en-US/Add-ons/SDK/High-Level_APIs/panel"><code>panel</code></a>. Um painel de conteúdo é definido usando HTML. Você pode executar scripts no painel: embora o script em execução no painel não pode acessar diretamente o código de seu add-on, você pode trocar mensagens entre o script do painel e o código do add-on.</p>
+
+<p>Neste tutorial nós criaremos um add-on que adiciona um <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button </a>à barra de ferramentas que mostra um painel quando clicado. O painel contém apenas um elemento <code>&lt;textarea&gt;:</code>quando o usuário aperta a tecla <code>return</code>, o conteúdo da <code>&lt;textarea&gt; </code>é enviado ao código principal do add-on. O código principal do add-on <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Logging">repassa a mensagem ao console</a>. </p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7647/panel.png" style="display: block; margin-left: auto; margin-right: auto;">O add-on consiste em seis arquivos:</p>
+
+<ul>
+ <li><code>main.js</code>: o código principal do addon, que cria o botão e o painel</li>
+ <li><code>get-text.js</code>: o conteúdo do script que interage com o conteúdo do painel</li>
+ <li><code>text-entry.html</code>: o conteúdo do painel em si, especificado como HTML</li>
+ <li><code>icon-16.png</code>, <code>icon-32.png</code>, and <code>icon-64.png</code>: ícone para o botão em três tamanhos diferentes</li>
+</ul>
+
+<p>O "main.js" se parece com isso:</p>
+
+<pre class="brush: js">var data = require("sdk/self").data;
+// Constrói um painel, carrega seu conteúdo do arquivo
+// "text-entry.html" no diretório "data", e carrega o script "get-text.js"
+// para ele.
+var text_entry = require("sdk/panel").Panel({
+  contentURL: data.url("text-entry.html"),
+  contentScriptFile: data.url("get-text.js")
+});
+
+// Cria um botão
+require("sdk/ui/button/action").ActionButton({
+  id: "show-panel",
+  label: "Show Panel",
+  icon: {
+    "16": "./icon-16.png",
+    "32": "./icon-32.png",
+    "64": "./icon-64.png"
+  },
+  onClick: handleClick
+});
+
+//Mostra o painel quando o usuário clica no botão
+function handleClick(state) {
+  text_entry.show();
+}
+
+//Quando o painel é mostrado ele gera um evento chamado
+//"show": nós esperaremos por este evento e quando ele ocorrer
+//enviamos nosso próprio evento "show" para o script do painel,
+//então o script pode preparar o painel para mostrar.
+text_entry.on("show", function() {
+  text_entry.port.emit("show");
+});
+
+//Espera pela mensagem chamada "text-entered" vinda do
+//script do conteúdo. A carga útil da mensagem é o texto
+//digitado pelo usuário.
+//Nesta implementação nós passaremos o texto para o console.
+text_entry.port.on("text-entered", function (text) {
+  console.log(text);
+  text_entry.hide();
+});</pre>
+
+<p>O conteúdo do script "get-text.js" parece com isto:</p>
+
+<div>
+<pre class="brush: js">//Quando o usuário digita return, envia a mensagem "text-entered"
+// para o main.js.
+//A carga útil da mensagem é o conteúdo da caixa de edição.
+var textArea = document.getElementById("edit-box");
+textArea.addEventListener('keyup', function onkeyup(event) {
+  if (event.keyCode == 13) {
+    // Remove a nova linha.
+    text = textArea.value.replace(/(\r\n|\n|\r)/gm,"");
+    self.port.emit("text-entered", text);
+    textArea.value = '';
+  }
+}, false);
+//Espera pelo evento "show" vim do
+//código principal do add-on. O que significa que o
+//painel sobre será mostrado.
+//
+//Configura o foco para a área de texto então o usuário pode
+//começar a digitar.
+self.port.on("show", function onShow() {
+  textArea.focus();
+});</pre>
+
+<div> </div>
+</div>
+
+<p>Finalmente, o arquivo "text-entry.html" define o elemento <code>&lt;textarea&gt;</code>:</p>
+
+<div>
+<div>
+<pre class="brush: html">&lt;html&gt;
+&lt;head&gt;
+    &lt;style type="text/css" media="all"&gt;
+      textarea {
+        margin: 10px;
+      }
+      body {
+        background-color: gray;
+      }
+    &lt;/style&gt;
+  &lt;/head&gt;
+&lt;body&gt;
+    &lt;textarea rows="13" cols="33" id="edit-box"&gt;&lt;/textarea&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<div> </div>
+</div>
+</div>
+
+<p>Finalmente, salve estes três ícones no diretório "data":</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7635/icon-16.png" style="height: 16px; width: 16px;"></td>
+   <td>icon-16.png</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7637/icon-32.png" style="height: 32px; width: 32px;"></td>
+   <td>icon-32.png</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/7639/icon-64.png" style="height: 64px; width: 64px;"></td>
+   <td>icon-64.png</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Teste: o "main.js" está salveo no diretório <code>lib</code> do add-on, e os outros cinco arquivos vão no diretório data do add-on:</p>
+
+<pre>my-addon/
+         data/
+              get-text.js
+              icon-16.png
+              icon-32.png
+              icon-64.png
+              text-entry.html
+         lib/
+             main.js
+</pre>
+
+<p>Execute o add-on, clique no botão, e você deverá ver o painel. Digite algum texto e pressione "return" e você deverá ver a saída no console.</p>
+
+<p>Do Firefox 30 em diante, se você usar o <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_toggle">toggle button</a>, você pode <a href="https://developer.mozilla.org/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_toggle#Attaching_panels_to_buttons">anexar o painel ao botão</a>.</p>
+
+<h2 id="Aprendendo_Mais">Aprendendo Mais</h2>
+
+<p>Para aprender mais sobre o módulo <code>panel</code>, veja a referência da API <a href="/en-US/Add-ons/SDK/High-Level_APIs/panel"><code>panel</code></a>.</p>
+
+<p>Para aprender mais sobre buttons, veja referência da API <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_action">action button</a> e <a href="/en-US/Add-ons/SDK/Low-Level_APIs/ui_button_toggle">toggle button</a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/sdk/tutorials/unit_testing/index.html b/files/pt-br/mozilla/add-ons/sdk/tutorials/unit_testing/index.html
new file mode 100644
index 0000000000..2e65659ed5
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/sdk/tutorials/unit_testing/index.html
@@ -0,0 +1,127 @@
+---
+title: Teste de unidade
+slug: Mozilla/Add-ons/SDK/Tutorials/Unit_testing
+tags:
+  - Add-on SDK
+  - JPM
+translation_of: Archive/Add-ons/Add-on_SDK/Tutorials/Unit_testing
+---
+<div class="note">
+<p><span>Para seguir este tutorial você precisará ter conhecimento básico de<a href="/en-US/docs/Mozilla/Add-ons/SDK/Tutorials/Getting_Started_%28jpm%29"> <code>jpm</code></a> e ter seguido o tutorial de <a href="/en-US/Add-ons/SDK/Tutorials/Using_third-party_modules_(jpm)">criação de módulos reutilizáveis</a>.</span></p>
+</div>
+
+<div class="note">
+<p>Se você está migrando código de teste do cfx para o <a href="/en-US/Add-ons/SDK/Tools/jpm">jpm</a>, veja o guia de migração do cfx, em particular a seção <a href="/en-US/Add-ons/SDK/Tools/cfx_to_jpm#Requiring_modules_from_test_code">loading modules from test code</a>.</p>
+</div>
+
+<p>O SDK fornece um framework para ajudar a criar e executar testes de unidade para seu código. Para demonstrar como ele funciona nós escreveremos um teste de unidade para um módulo simples de codificação <a href="http://en.wikipedia.org/wiki/Base64">Base64</a>.</p>
+
+<h2 id="Um_módulo_simples_Base64">Um módulo simples Base64</h2>
+
+<p>Em uma página web, você pode executar uma codificação Base64 e decodificação usando as funções <code>btoa()</code> e <code>atob()</code>. Infelizmente essas funções pertencem ao objeto <code>window</code>: uma vez que o objeto não está disponível no código principal do add-on, <code>atob()</code> e <code>btoa()</code> não estão disponíveis de qualquer forma. Então nós criaremos um módulo <code>base64</code> para exibir estas funções da plataforma.</p>
+
+<p>Para começar, crie um novo diretório, navegue para ele, e execute o <code>jpm init</code>. Agora crie um novo arquivo chamado "base64.js", e de lhe o seguinte conteúdo:</p>
+
+<pre class="brush: js">const { atob, btoa } = require("chrome").Cu.import("resource://gre/modules/Services.jsm", {});
+
+exports.atob = a =&gt; atob(a);
+exports.btoa = b =&gt; btoa(b);
+</pre>
+
+<p>Este código exporta duas funções, que chamamos <code>btoa()</code> and <code>atob()</code>. Para mostrar o módulo em uso, edit o arquivo "index.js" como segue:</p>
+
+<pre class="brush: js">var base64 = require("./base64");
+
+var button = require("sdk/ui/button/action").ActionButton({
+  id: "base64",
+  label: "base64",
+  icon: "./icon-16.png",
+  onClick: function() {
+    encoded = base64.btoa("hello");
+    console.log(encoded);
+    decoded = base64.atob(encoded);
+    console.log(decoded);
+  }
+});</pre>
+
+<p>Para executar esse exemplo você também terá que ter um ícone chamado "icon-16.png" salvo no diretório data do add-on. Você pode baixar este ícone: <img alt="" src="https://mdn.mozillademos.org/files/7661/icon-16.png" style="height: 16px; width: 16px;">.</p>
+
+<p>Agora o "index.js" importa o módulo base64 e chama suas duas funções exportadas. Se nós executarmos o add-on e clicarmos no botão, nós devemos ver a seguinte saída:</p>
+
+<pre>info: aGVsbG8=
+info: hello
+</pre>
+
+<h2 id="Testando_o_módulo_Base64">Testando o módulo Base64</h2>
+
+<p>Navegue para o diretório <code>test</code> e delete o arquivo <code>test-index.js</code>. Em seu lugar crie um arquivo chamado <code>test-base64.js</code> com o seguinte conteúdo:</p>
+
+<pre class="brush: js">var base64 = require("../base64");
+
+exports["test atob"] = function(assert) {
+      assert.ok(base64.atob("aGVsbG8=") == "hello", "atob works");
+}
+
+exports["test btoa"] = function(assert) {
+  assert.ok(base64.btoa("hello") == "aGVsbG8=", "btoa works");
+}
+
+exports["test empty string"] = function(assert) {
+  assert.throws(function() {
+                  base64.atob();
+                },
+                "empty string check works");
+}
+
+require("sdk/test").run(exports);
+</pre>
+
+<div class="note">
+<p>Note que com o  jpm nós devemos dar o caminho exato do módulo base64.js.</p>
+</div>
+
+<p>Esse arquivo: exporta três funções, cada qual espera receber um único argumento que é o objeto <code>assert</code>. <code>assert</code> é fornecida pelo módulo <a href="/en-US/Add-ons/SDK/Low-Level_APIs/test_assert"><code>test/assert</code></a> e implementa o <a href="http://wiki.commonjs.org/wiki/Unit_Testing/1.1">CommonJS Unit Testing specification</a>.</p>
+
+<ul>
+ <li>
+  <p>As duas primeiras funções chamam <code>atob()</code> e <code>btoa()</code> e usa o <a href="/en-US/Add-ons/SDK/Low-Level_APIs/test_assert#ok(guard.2C_message)"><code>assert.ok()</code></a> para checar que a saída é a esperada</p>
+ </li>
+ <li>
+  <p>A segunda função testo código de manipulação de erro do módulo passando uma string vazia para o <code>atob()</code> e usando <a href="/en-US/Add-ons/SDK/Low-Level_APIs/test_assert#throws(block.2C_error.2C_message)"><code>assert.throws()</code></a> para checar que a exceção esperada foi lançada.</p>
+ </li>
+</ul>
+
+<p>Neste ponto seu add-on deve parecer com isto:</p>
+
+<pre>  /base64
+      /data
+          icon-16.png
+      package.json
+      README.md
+      index.js
+      base64.js
+      /test
+          test-base64.js
+</pre>
+
+<p>Agora execute o <code>jpm --verbose test</code> da pasta principal do add-on. Você deve ver algo como isto:</p>
+
+<pre>console.info: jpm-utest: executing './test/test-base64.test atob'
+console.info: jpm-utest: pass: atob works
+console.info: jpm-utest: executing './test/test-base64.test btoa'
+console.info: jpm-utest: pass: btoa works
+console.info: jpm-utest: executing './test/test-base64.test empty string'
+console.info: jpm-utest: pass: empty string check works
+
+3 of 3 tests passed.
+All tests passed!</pre>
+
+<p>O que aconteceu aqui é que o <code>jpm test</code>:</p>
+
+<ul>
+ <li>procura no diretório <code>test</code> o seu pacote</li>
+ <li>carrega qualquer módulo cujo nome começa com a palavra <code>test- </code>(Note o hífen depois de<span> "test" no nome do módulo. <code>jpm test</code> incluirá um módulo chamado "test-myCode.js", mas excluirá módulos chamados "test_myCode.js" ou "testMyCode.js".)</span></li>
+ <li>chama cada função exportada cujo nome começa com "test", passando um objeto <a href="/en-US/Add-ons/SDK/Low-Level_APIs/test_assert#Assert"><code>assert</code></a> como seu único argumento.</li>
+</ul>
+
+<p>Obviamente, você não tem que passar a opção<code> --verbose</code> para o jpm se você não quiser; fazendo assim torna a saída mais fácil de ler.</p>
diff --git a/files/pt-br/mozilla/add-ons/temas/background/index.html b/files/pt-br/mozilla/add-ons/temas/background/index.html
new file mode 100644
index 0000000000..856e419f31
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/temas/background/index.html
@@ -0,0 +1,110 @@
+---
+title: Temas de fundo
+slug: Mozilla/Add-ons/Temas/Background
+tags:
+  - Aparência do Firefox
+  - Complementos
+  - Firefox
+  - Personalização
+  - Tema
+translation_of: Mozilla/Add-ons/Themes/Lightweight_themes
+---
+<h2 id="Como_criar_o_seu_próprio_tema">Como criar o seu próprio tema</h2>
+
+<div class="primary auto" id="getting-started">
+<p>Os temas são feitos de arquivos gráficos de imagens, para o cabeçalho, semelhantes ao utilizado como aparência padrão de fundo do Firefox UI.</p>
+
+<p>Acabou seu projeto? Você pode <a href="https://addons.mozilla.org/pt-BR/developers/theme/submit">enviá-lo agora mesmo!</a></p>
+
+<h3 id="Criando_um_tema_Imagem_de_Cabeçalho">Criando um tema: Imagem de Cabeçalho</h3>
+
+<p>A imagem do cabeçalho é mostrada no topo da janela do navegador, aninhada atrás da barra de ferramentas, barra de endereço, barra de pesquisa e barra de abas. Ela é <strong>ancorada no canto superior direito</strong> da janela do navegador.</p>
+
+<p class="screenshot"><img alt="" src="https://mdn.mozillademos.org/files/9929/header-step.jpg" style="height: 215px; width: 1059px;"></p>
+
+<ul>
+ <li><a href="https://addons.cdn.mozilla.net/static/img/docs/themes/header.jpg">Veja um exemplo de tema de cabeçalho aqui.</a></li>
+</ul>
+
+<h4 id="Requisitos_de_Imagem">Requisitos de Imagem</h4>
+
+<ul>
+ <li>As dimensões devem ser <strong>3000px de largura </strong>x<strong> 200px de altura</strong></li>
+ <li>Nos formatos de arquivo PNG ou JPG</li>
+ <li>A imagem não deve ter tamanho maior que 300KB</li>
+</ul>
+
+<h4 id="Dicas">Dicas</h4>
+
+<ul>
+ <li>Imagens sutis, de baixo contraste e gradientes funcionam melhor; imagens altamente detalhadas podem competir com a UI do navegador.</li>
+ <li>O Firefox pode revelar mais da parte inferior da imagem, se outra barra de ferramentas ou elemento da UI for adicionado ao topo da janela.</li>
+ <li>O lado superior direito da imagem (na tela) deve ter a informação mais importante — à medida que a largura da janela é ampliada, o navegador revela mais do lado esquerdo da imagem.</li>
+</ul>
+
+<h4 id="Recursos_de_Editores_de_Imagem_Em_Linha">Recursos de Editores de Imagem Em Linha</h4>
+
+<ul>
+ <li><a href="http://www.pixlr.com">Pixlr</a> — Este aplicativo oferece ferramentas profissionais e fáceis de usar, para criação e edição de imagens com o navegador.</li>
+ <li><a href="http://www.photoshop.com">Photoshop</a> — Ajuste, gire e retoque fotos com o Photoshop® Express, um editor de fotos <em>online</em> e gratuito.</li>
+</ul>
+
+<h3 id="Criando_um_tema_Imagem_de_Rodapé">Criando um tema: Imagem de Rodapé</h3>
+
+<p>Em versões antigas do Firefox, ou em versões recentes com certas extensões instaladas, a imagem de rodapé é mostrada como o fundo da parte inferior da janela do navegador, atrás de extensões e barras de pesquisa. Ela é ancorada no canto inferior esquerdo da janela do navegador. Imagens de rodapé são opcionais.</p>
+
+<p class="screenshot"><img alt="" src="https://mdn.mozillademos.org/files/9935/footer-step.jpg" style="height: 56px; width: 1249px;"></p>
+
+<ul>
+ <li><a href="https://addons.cdn.mozilla.net/static/img/docs/themes/footer.jpg">Veja um exemplo de tema de rodapé aqui.</a></li>
+</ul>
+
+<h4 id="Requisitos_de_Imagem_2">Requisitos de Imagem</h4>
+
+<ul>
+ <li>As dimensões devem ser <strong>3000px de largura x 100px de altura</strong></li>
+ <li>Nos formatos de arquivo PNG, ou JPG</li>
+ <li>A imagem não deve ter tamanho maior que 300KB</li>
+</ul>
+
+<h4 id="Dicas_2">Dicas</h4>
+
+<ul>
+ <li>Imagens sutis, de baixo contraste e gradientes funcionam melhor; imagens altamente detalhadas competem com a UI do navegador.</li>
+ <li>O Firefox pode revelar mais da porção superior da imagem, se a barra de pesquisa está aberta, ou se uma extensão adiciona mais altura à parte inferior da janela.</li>
+ <li>O lado esquerdo da imagem deve ter a informação mais importante — à medida que a largura da janela for ampliada, o navegador revela mais do lado direito da imagem.</li>
+</ul>
+
+<h3 id="Submentendo_as_Imagens_de_seus_Temas">Submentendo as Imagens de seus Temas</h3>
+
+<p>Para enviar suas imagens, vá para a página de  <a href="https://addons.mozilla.org/developers/theme/submit">Submissão de Temas</a>:</p>
+
+<ol class="itemized">
+ <li><strong>Nomeie seu tema</strong> — aplique um nome único ao seu tema. Nomes duplos não são permitidos, então, talvez, você precise tentar algumas vezes, até encontrar um nome único disponível.</li>
+ <li><strong>Escolha uma categoria e as etiquetas</strong> — selecione uma categoria e insira algumas etiquetas para melhor descrever o seu tema. Tenha em mente que o revisor poderá rejeitá-lo se, obviamente, a categoria e/ou etiquetas não estiverem relacionadas a ele corretamente.</li>
+ <li><strong>Descreva o seu tema</strong> — escreva uma descrição curta do seu tema. Tenha em mente que o revisor poderá rejeitá-lo, se essa descrição não for uma representação exata dele.</li>
+ <li><strong>Selecione uma licença para seu tema</strong> — decida sobre uma licença de direitos autorais para seu trabalho. <a href="http://creativecommons.org/licenses/">Leia mais sobre os tipos de licenças Creative Commons.</a>
+  <ul>
+   <li><strong>Importante:</strong> Por favor, certifique-se que você tem o direito de usar a imagem em seu tema!</li>
+  </ul>
+ </li>
+ <li><strong>Envie suas imagems</strong> — certifique-se que elas têm menos de 300KB de tamanho e estão no formato JPG, ou PNG!</li>
+ <li><strong>Seleciona a cor do texto e abas</strong> — você pode escolher a cor ("de fundo") da aba e a cor do texto que melhor combinam com sua imagem de cabeçalho.</li>
+ <li><strong>Visualize seu tema</strong> — tudo pronto para você experimentar o seu tema! Simplesmente passe o cursor sobre a imagem acima do botão "Enviar tema" e veja como ele fica, instantaneamente: )</li>
+ <li><strong>Envie seu tema</strong> —  se tudo parece certo, clique no botão Enviar tema e pronto! Você pode ver todos os temas que escreveu na sua página de perfil.
+  <ul>
+   <li><strong>Dica:</strong> para garantir que o seu tema será aprovado para a galeria, certifique-se que ele está em conformidade com as diretrizes de conteúdo e termos de serviço!</li>
+  </ul>
+ </li>
+</ol>
+
+<p class="screenshot"><img alt="" src="https://mdn.mozillademos.org/files/9933/submission-step.jpg" style="height: 1800px; width: 785px;"></p>
+
+<p class="call-to-submit"><a class="button prominent" href="https://addons.mozilla.org/en-US/developers/theme/submit">ENVIE SEu TemA AGORA</a></p>
+
+<p class="call-to-submit"> </p>
+
+<h2 class="call-to-submit" id="Mais_Tutoriais">Mais Tutoriais</h2>
+
+<p><a href="http://vanillaorchidstutorials.blogspot.com/2015/11/mozilla-themes-focal-point-sizing.html">Mozilla Themes Focal Point on Sizing</a> - Um tutorial sobre os temas, com foco em dimensões, por VanillaOrchids.</p>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/temas/index.html b/files/pt-br/mozilla/add-ons/temas/index.html
new file mode 100644
index 0000000000..7f38f0f3e4
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/temas/index.html
@@ -0,0 +1,55 @@
+---
+title: Temas
+slug: Mozilla/Add-ons/Temas
+tags:
+  - Add-ons
+  - Aparência & Comportamento
+  - Complementos
+  - Mozilla-Firefox
+  - Temas
+translation_of: Mozilla/Add-ons/Themes
+---
+<p>Os temas são as capas, ou coberturas, dos diferentes aplicativos Mozilla. Eles permitem que se altere a aparência da interface de acordo com o seu gosto. Um tema pode, simplesmente, mudar as cores da interface de utilização, ou pode mudar cada parte da sua aparência. A documentação sobre temas está desatualizada, mas estamos na esperança de obter alguma ajuda para atualizá-la, em breve.</p>
+
+<div class="column-container">
+<div class="column-half">
+<h2 class="Documentation" id="Documentation" name="Documentation">Documentação</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Building_a_Theme" title="Building a Theme">Construindo um tema</a></dt>
+ <dd>Um tutorial para construir um tema simples no Firefox. <strong>Obs: Conteúdo Obsoleto</strong></dd>
+ <dt><a href="/en-US/docs/Themes/Common_Firefox_Theme_Issues_and_Solutions" title="Themes/Common_Firefox_Theme_Issues_and_Solutions">Problemas Comuns e Suas Soluções</a></dt>
+ <dd>Alguns problemas comuns, que ocorrem quando os editores AMO inspecionam os temas e como corrigí-los.</dd>
+ <dt><a href="/pt-BR/Add-ons/Temas/Temas_leves" title="Themes/Lightweight themes">Temas leves</a></dt>
+ <dd>Construindo temas leves para Firefox</dd>
+ <dt><a href="/en-US/docs/Creating_a_Skin_for_SeaMonkey_2.x" title="Creating_a_Skin_for_SeaMonkey_2.x">Criando uma capa para o SeaMonkey 2</a></dt>
+ <dd>Uma introdução para criar novos temas para o SeaMonkey 2.</dd>
+ <dt><a href="/en-US/docs/Making_Sure_Your_Theme_Works_with_RTL_Locales" title="Making_Sure_Your_Theme_Works_with_RTL_Locales">Assegurando-se de que o Seu Tema Funciona Com Escritas RTL</a></dt>
+ <dd>Como ter certeza de que o seu tema vai aparecer certinho para Hebreus, Árabes, Persas e Paquistaneses.</dd>
+ <dt><a href="/en-US/docs/Theme_Packaging" title="Theme_Packaging">Acondicionando Temas</a></dt>
+ <dd>Como Empacotar Temas para Firefox e Thunderbird.</dd>
+ <dt><a href="http://www.tudobom.de/articles/yatt/" title="http://www.tudobom.de/articles/yatt/">Outro Tutorial</a></dt>
+ <dd>Outro tutorial no construção de temas para Mozilla.</dd>
+ <dt><a href="/en-US/Mozilla/Add-ons/Themes/Obsolete">Documentos Obsoletos</a></dt>
+ <dd>Esses documentos são muito velhos e nunca serão atualizados, mas nós os mantemos, para o caso de serem fonte de informações úteis às pessoas <span class="short_text" id="result_box" lang="pt"><span class="hps">atualizar</span> <span class="hps">a documentação</span> <span class="hps">Tema</span></span></dd>
+</dl>
+</div>
+
+<div class="column-half">
+<h2 id="Buscando_Ajuda">Buscando Ajuda</h2>
+
+<ul>
+ <li><a href="http://forums.mozillazine.org/viewforum.php?f=18">Forum MozillaZine Themes</a></li>
+</ul>
+
+<h2 class="Tools" id="Tools" name="Tools">Ferramentas</h2>
+
+<ul>
+ <li><a href="/en-US/docs/DOM_Inspector" title="DOM_Inspector">Inspetor DOM</a></li>
+ <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/inspectorwidget/">Inspetor Widget</a></li>
+ <li><a class="link-https" href="https://addons.mozilla.org/en-us/firefox/addon/force-rtl/">Force RTL</a>: Teste de compatibilidade RTL</li>
+</ul>
+</div>
+</div>
+
+<p> </p>
diff --git a/files/pt-br/mozilla/add-ons/temas/using_the_amo_theme_generator/index.html b/files/pt-br/mozilla/add-ons/temas/using_the_amo_theme_generator/index.html
new file mode 100644
index 0000000000..a63eb7b624
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/temas/using_the_amo_theme_generator/index.html
@@ -0,0 +1,137 @@
+---
+title: Usando o Gerador de Temas AMO
+slug: Mozilla/Add-ons/Temas/Using_the_AMO_theme_generator
+tags:
+  - AMO
+  - Extensões
+  - Firefox
+  - Gerador de Temas
+  - Guía
+  - Mozilla
+  - Tema
+  - Temas
+  - Tutorial
+  - extensão
+translation_of: Mozilla/Add-ons/Themes/Using_the_AMO_theme_generator
+---
+<p>{{AddonSidebar}}</p>
+
+<p>O gerador de temas na <a href="https://addons.mozilla.org/">addons.mozilla.org</a> (AMO) guia você pelo processo da criação de um tema para o Firefox. Uma vez que você já tenha definido as cores e a imagem para o seu tema, o gerador submeterá seu trabalho à AMO. Você pode publicar os temas na AMO, ou gerenciar a sua distribuição.</p>
+
+<h2 id="Comece">Comece</h2>
+
+<div class="note">
+<p>Você precisa entrar em sua conta no Firefox para acessar o Gerador de Temas.</p>
+</div>
+
+<p>Se você preferir publicar o seu tema na <a href="https://addons.mozilla.org/">addons.mozilla.org</a> (AMO), comece pela <a href="https://addons.mozilla.org/en-US/developers/addon/submit/wizard-listed">listed Theme Generator page</a> </p>
+
+<p>Por outro lado, se você escolher distribuí-lo, vá para a <a href="https://addons.mozilla.org/en-US/developers/addon/submit/wizard-unlisted">unlisted Theme Generator Page</a>. Para mais informações sobre distribuição, visite <a href="/en-US/docs/Mozilla/Add-ons/Distribution">Signing and distributing your add-on</a>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> Você pode gerar um tema mais elaborado, por exemplo, que use múltiplas imagens, criando um tema estático. Para começar os Temas Estáticos, dê uma olhada em: <a href="/en-US/docs/Mozilla/Add-ons/Themes/Theme_concepts">Theme concepts.</a></p>
+</div>
+
+<p>Para usar o Gerador de Temas AMO, preencha os campos com as informações sobre o seu tema novo.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16282/new_theme.png" style="border: 1px solid black; display: block; height: 1058px; margin: 0px auto; width: 988px;"></p>
+
+<p>Comece dando um nome ao seu novo tema.</p>
+
+<p><span class="tlid-translation translation" lang="pt"><span title="">Ao escolher uma imagem para o cabeçalho</span></span>, ela deverá ter:</p>
+
+<ul>
+ <li>200 pixels de altura</li>
+ <li>No máximo 6.9MB</li>
+ <li>O formato pode ser: PNG, JPG, APNG, SVG or GIF (Não use gifs animados.)</li>
+ <li>A imagem será alinhada <span class="tlid-translation translation" lang="pt"><span title="">à extremidade direita do cabeçalho</span></span> .</li>
+</ul>
+
+<p>Nos exemplos acima, a imagem desaparece em uma cor sólida, mantendo seu tamanho.</p>
+
+<p>Os valores das cores podem ser inseridos em hex, rgb, ou rgba. Você também pode usar o seletor de cores para escolher as que preferir em seu tema:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16503/theme_colors.png" style="border: 1px solid black; display: block; margin: 0px auto;"></p>
+
+<p>À medida que você for escolhendo as cores, elas vão sendo exibidas no exemplo abaixo do seletor, assim você pode brincar com elas, até encontrar a combinação exata para a sua criação. O bloco maior representa a intensidade da cor, o deslizante arco-íris permite que você selecione a tonalidade e o deslizante mais à direita define a sua opacidade.</p>
+
+<p>Uma vez que o campo de entrada de cor perder o foco, seu formato será convertido para rgba. Os componentes da cor em RGB (red, green, blue = vermelha, verde, azul) podem variar de 0 a 255, enquanto o "a" em RGBA significa alfa e controla a opacidade da cor. Os valores válidos para alfa variam entre 0 e 1 e o valor padrão é 1.0, ou, completamente opaco.</p>
+
+<div class="note">
+<p>Você pode usar a <a href="https://color.firefox.com">Firefox Color extension</a> para antever a sua criação.</p>
+</div>
+
+<p>As cores na imagem a seguir mostram como você pode definí-las para o seu tema. Todas, menos a <strong>Área de fundo do cabeçalho</strong> e a<strong> Área de texto e ícones do cabeçalho</strong>, são opcionais:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16507/theme_colors_labeled.png" style="display: block; height: 350px; margin: 0px auto; width: 720px;"></p>
+
+<dl>
+ <dt>O Fundo da área do cabeçalho</dt>
+ <dd>A cor de fundo da área de cabeçalho, exibida na área não coberta, ou visível através da imagem de cabeça.<strong> Manifest field</strong>: <em>accentcolor</em>.</dd>
+ <dt>Área de texto e ícones do cabeçalho</dt>
+ <dd>As cores do texto e dos ícones na região do cabeçalho, com exceção da aba ativa. <strong>Manifest field</strong>: <em>textcolor</em>.</dd>
+ <dt>Área de fundo da barra de ferramentas (opcional)</dt>
+ <dd>A cor de fundo da barra de navegação, a barra de favoritos e a aba selecionada. <strong>Manifest field</strong>: <em>toolbar</em>.</dd>
+ <dt>Área de texto e ícones da barra de ferramentas (opcional)</dt>
+ <dd>A cor do texto e dos ícones na barra de ferramentas e a aba ativa.<strong> Manifest field</strong>: <em>toolbar_text</em>.</dd>
+ <dt>Área de fundo dos campos da barra de ferramentas (opcional)</dt>
+ <dd>A cor de fundo para os campos na barra de ferramentas, tais como a barra de pesquisa de URL. <strong>Manifest field</strong>: <em>toolbar_field</em>.</dd>
+ <dt>Campo da área de texto na barra de ferramentas (opcional)</dt>
+ <dd>A cor do texto para os campos na barra de ferramentas, tais como a barra de pesquisa de URL. <strong>Manifest field</strong>: <em>toolbar_field_text</em>.</dd>
+</dl>
+
+<p>Ao fornecer as informações, você verá uma prévia do seu tema no navegador, na parte final do formulário.</p>
+
+<p>Quando completar as informações necessárias, clique no botão <strong>Finish Theme</strong> para continuar.</p>
+
+<div class="note">
+<p>Temas submetidos para sua própria distribuição serão sancionadas imediatamente e um arquivo XPI gerado poderá ser baixado.</p>
+</div>
+
+<h2 id="Enviando_seu_tema">Enviando seu tema</h2>
+
+<p>Se você estiver publicando o seu tema na <a href="https://addons.mozilla.org/">addons.mozilla.org</a> (AMO), a segunda página do criador de temas pedirá que você o descreva. Você, então, deverá fornecer as seguintes informações:</p>
+
+<dl>
+ <dt>Nome</dt>
+ <dd>Este é o nome que será exibido na AMO e pode ser diferente do nome mostrado quando o seu tema for instalado no Firefox.</dd>
+ <dt>Add-on URL</dt>
+ <dd>Este é o endereço a partir do qual o seu tema pode ser baixado. Você pode editar a parte final do valor (após <span>https://addons.mozilla.org</span>/), mas, por favor, use, apenas, letras, números, subtraços e traços no seu URL.</dd>
+ <dt>Resumo (necessário)</dt>
+ <dd>Descreva seu tema. Você dispõe de 250 caracteres para fazê-lo.</dd>
+ <dt>Selecione uma categoria (necessária)</dt>
+ <dd>Selecionar uma categoria exata para o seu tema ajuda as pessoas a encontrá-lo na AMO. As seguintes categorias estão disponíveis:
+ <ul>
+  <li>Abstrato</li>
+  <li>Causas</li>
+  <li>Moda</li>
+  <li>Filme e TV</li>
+  <li>Firefox</li>
+  <li>Foxkeh</li>
+  <li>Férias</li>
+  <li>Música</li>
+  <li>Natureza</li>
+  <li>Outra</li>
+  <li>Cenário</li>
+  <li>Estação do ano</li>
+  <li>Esportes</li>
+  <li><em>Websites</em></li>
+ </ul>
+ </dd>
+ <dt>Email de suporte</dt>
+ <dd>O endereço de <em>email</em> pelo qual as pessoas podem contactar você, caso elas tenham algum problema com o seu tema.</dd>
+ <dt><em>Website</em> de suporte</dt>
+ <dd>A URL para o sítio a partir do qual você oferece suporte ao seu tema.</dd>
+ <dt>Licença (necessária)</dt>
+ <dd>A licença sob a qual o seu tema será publicado vai depender das escolhas que você fizer ao responder as seguintes perguntas:
+ <ul>
+  <li>Outras pessoas podem compartilhar o seu tema, desde que mantenham a sua autoria?</li>
+  <li>As pessoas poderão fazer uso comercial do seu tema?</li>
+  <li>As pessoas poderão criar trabalhos inspirados em seu tema?</li>
+ </ul>
+ </dd>
+</dl>
+
+<p>Uma vez que você tiver preenchido todas as informações requeridas, poderá completar o processo de envio ao clicar no botão <strong>Submit Version</strong>. Você verá alguma coisa que se pareça com isto:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16284/theme_after_submit.png" style="border: 1px solid black; display: block; height: 382px; margin: 0px auto; width: 695px;"></p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/anatomia_de_uma_webextension/index.html b/files/pt-br/mozilla/add-ons/webextensions/anatomia_de_uma_webextension/index.html
new file mode 100644
index 0000000000..231797ec59
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/anatomia_de_uma_webextension/index.html
@@ -0,0 +1,115 @@
+---
+title: Anatomia de uma WebExtension
+slug: Mozilla/Add-ons/WebExtensions/Anatomia_de_uma_WebExtension
+tags:
+  - Extensões
+  - WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension
+---
+<p>Uma extensão consiste de uma coleção de arquivos, empacotados para distribuição e instalação. Nesse artigo vamos falar rapidamente sobre os arquivos que podem estar presentes em uma extensão.</p>
+
+<p>Toda extensão contém um arquivo chamado <a href="/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#manifest.json">"manifest.json"</a>. Ele pode conter ponteiros para quatro outros tipos de arquivos:</p>
+
+<ul>
+ <li><a href="/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#Background_pages">background pages</a>: implementação de lógica de longa duração</li>
+ <li><a href="/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#Content_scripts">content scripts</a>: executado no contexto de páginas web</li>
+ <li><a href="/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#Browser_actions">browser action files</a>: implementação de botões na toolbar</li>
+ <li><a href="/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#Web_accessible_resources">web accessible resources</a>: torna o conteúdo do pacote acessível a páginas web e scripts de conteúdo</li>
+</ul>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11465/webextension-anatomy.svg" style="display: block; height: 871px; margin-left: auto; margin-right: auto; width: 600px;"></p>
+
+<h2 id="manifest.json">manifest.json</h2>
+
+<p>Esse é o único arquivo que está presente em toda WebExtension. Ele contém metadados básicos sobre a extensão, tais como o nome, a versão e as permissões que ela necessita. Também provê ponteiros para outros arquivos na extensão.</p>
+
+<p>Para mais detalhes sobre o arquivo "manifest.json", acesse a <a href="/en-US/Add-ons/WebExtensions/manifest.json">página de referência.</a></p>
+
+<h2 id="Background_pages">Background pages</h2>
+
+<p>Muitas vezes as WebExtensions precisam manter um estado ou performance operativa de longa duração, independentemente do ciclo de vida das páginas ou janelas do navegador. As background pages e os scripts servem pra isso.</p>
+
+<p>Background scripts são carregados assim que a extensão tem sua carga concluída, e permanecem carregados até que ela seja desativada ou desinstalada. No script você pode fazer uso de qualquer uma das WbExtensions APIs.</p>
+
+<p>Os background scripts não possuem acesso direto às páginas web. No entanto, eles podem carregar scripts de conteúdo na página, e podem se comunicar com os scripts de conteúdo usando uma API de envio de mensagens.</p>
+
+<p>Você pode incluir uma background page usando a chave <code>background</code> no "manifest.json". Você não precisa informar a sua própria background page. Se você incluir uma página de background, um arquivo vazio será criado.</p>
+
+<pre class="brush: json">// manifest.json
+
+"background": {
+  "scripts": ["background-script.js"]
+}</pre>
+
+<p>No entanto, você pode escolher informar a página de background como um arquivo HTML a parte:</p>
+
+<pre class="brush: json">// manifest.json
+
+"background": {
+  "page": "background-page.html"
+}</pre>
+
+<h2 id="Scripts_de_conteúdo">Scripts de conteúdo</h2>
+
+<p>Use os scripts de conteúdo para acessar e manipular páginas web. Scripts de conteúdo são carregados dentro das páginas web e executados em um contexto particular nessa página.</p>
+
+<p>Eles podem ver e manipular páginas DOM,</p>
+
+<p>Scripts de conteúdo podem ver e manipular o DOM das páginas, da mesma forma como os scripts normais carregados pela página.</p>
+
+<p>Ao contrário dos scripts normais, os scripts de conteúdo podem:</p>
+
+<ul>
+ <li>fazer requisições XHR cross-domain</li>
+ <li>utilizar um pequeno subconjunto de WebExtension APIs</li>
+ <li>trocar mensagens com os scripts de background e acessar indiretamente todas as WebExtensions APIs.</li>
+</ul>
+
+<p>Scripts de conteúdo não podem acessar diretamente os scripts normais da página, mas podem trocar mensagens com eles através do uso da API window.postMessage.</p>
+
+<p>Normalmente, quando falamos de scripts de conteúdo, estamos nos referindo a JavaScript, mas é possível injetar CSS em paginas web que utilizam o mesmo mecanismo.</p>
+
+<p>Você pode injetar scripts de conteúdo em páginas web de duas formas: anexando os scripts para todas as páginas correspondentes a um padrão de URL, ou através de programação a partir de um script de background.</p>
+
+<p>Para injetar scripts em páginas com base na URL, use a chave <code>content_scripts</code> no "manifest.json", informando um ou mais scripts e um array com os padrões:</p>
+
+<pre class="brush: json">// manifest.json
+
+"content_scripts": [
+  {
+    "matches": ["*://*.mozilla.org/*"],
+    "js": ["my-script.js"]
+  }
+]</pre>
+
+<p>Se a URL da página corresponder aos padrões passados na chave <code>matches</code>, os scripts passados na chave <code>js</code> serão carregados.</p>
+
+<p>Para injetar os scripts na página via programação (por exemplo, quando o usuário clicar em um botão) use a API <code>tabs</code>:</p>
+
+<pre class="brush: js">// background.js
+
+chrome.tabs.executeScript({
+  file: "my-script.js"
+});</pre>
+
+<p>Aprenda mais sobre scripts de conteúdo lendo sua <a href="/en-US/Add-ons/SDK/Guides/Content_Scripts">documentação</a>.</p>
+
+<h2 id="Ações_de_navegador">Ações de navegador</h2>
+
+<p>Uma "ação de navegador" é um botão que você pode adicionar na barra de ferramentas do Firefox. O botão tem um ícone. Você pode informar múltiplos ícones em diferentes tamanhos:  fazendo isso, o navegador irá selecionar o ícone mais adequado para a densidade de pixels da tela.</p>
+
+<p>Opcionalmente, você pode definir um popup para o botão usando HTML, CSS e JavaScript.</p>
+
+<p>Se você não definir um popup, quando o usuário clicar no botão um evento será disparado, que pode ser ouvido nos scripts de background.</p>
+
+<p>Se você define um popup, o evento não é disparado: ao invés disso, o popup será mostrado para que o usuário possa interagir. Os scripts executados em popup são capazes de utilizar WebExtension APIs.</p>
+
+<p>Para aprender mais sobre ações de navegador, consulte a página da API.</p>
+
+<h2 id="Recursos_acessíveis_na_web">Recursos acessíveis na web</h2>
+
+<p>Recursos acessíveis na web são recursos como imagens, HTML, CSS, JavaScript, que podem ser incluídos na extensão e quer tornar acessível aos scripts de conteúdo e aos scripts da página. Eles podem ser referenciados a partir de scripts de página e de conteúdo, usando um URI scheme especial.</p>
+
+<p>Por exemplo, se um script de conteúdo quer inserir algumas imagens em páginas da web, você pode incluí-los na extensão e torná-los acessíveis na web. Em seguida o script de conteúdo pode criar e acrescentar tags <a href="/en-US/docs/Web/HTML/Element/img">img</a> que fazem referência às imagens através do atributo <code>src</code>.</p>
+
+<p>Para entender mais, veja a documentação sobre chaves no manifest.json em <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources">recursos acessíveis na web.</a></p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/alarms/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/alarms/index.html
new file mode 100644
index 0000000000..a4e4bd3254
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/alarms/index.html
@@ -0,0 +1,52 @@
+---
+title: alarms
+slug: Mozilla/Add-ons/WebExtensions/API/alarms
+tags:
+  - alarm
+translation_of: Mozilla/Add-ons/WebExtensions/API/alarms
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Executar um código agendado para um horário específico no futuro. Isto é como o <code><a href="/en-US/docs/Web/API/WindowTimers/setTimeout">setTimeout()</a></code> e <code><a href="/en-US/docs/Web/API/WindowTimers/setInterval">setInterval()</a></code>, exceto essas funções não funcionam no segundo plano com páginas carregadas sob demanda.</p>
+
+<p>Para usar estas API você precisa ter a "alarms" <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permission</a>.</p>
+
+<h2 id="Tipos">Tipos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("alarms.Alarm")}}</dt>
+ <dd>Informações sobre um alarme em particular.</dd>
+</dl>
+
+<h2 id="Funções">Funções</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("alarms.create()")}}</dt>
+ <dd>Cria um alarme.</dd>
+ <dt>{{WebExtAPIRef("alarms.get()")}}</dt>
+ <dd>Obtém um alarme específico dado seu nome.</dd>
+ <dt>{{WebExtAPIRef("alarms.getAll()")}}</dt>
+ <dd>Obtém todos os alarmes agendados.</dd>
+ <dt>{{WebExtAPIRef("alarms.clear()")}}</dt>
+ <dd>Limpa um alarme específico dado seu nome.</dd>
+ <dt>{{WebExtAPIRef("alarms.clearAll()")}}</dt>
+ <dd>Limpa todos os alarmes agendados.</dd>
+</dl>
+
+<h2 id="Eventos">Eventos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("alarms.onAlarm")}}</dt>
+ <dd>Disparado quando o alarme acaba.</dd>
+</dl>
+
+<h2 id="Compatibilidade_dos_browsers">Compatibilidade dos browsers</h2>
+
+<p>{{Compat("webextensions.api.alarms")}} {{WebExtExamples("h2")}}</p>
+
+<div class="note"><strong>Agradecimentos</strong>
+
+<p>Esta API é baseada na API Chromium's <a href="https://developer.chrome.com/extensions/alarms"><code>chrome.alarms</code></a> .</p>
+
+<p>Dados de compatibilidade do Microsoft Edge fornecidos pela Microsoft Corporation aqui inclusos sob a Creative Commons Attribution 3.0 United States License.</p>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/bookmarks/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/bookmarks/index.html
new file mode 100644
index 0000000000..75aa9ada3c
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/bookmarks/index.html
@@ -0,0 +1,119 @@
+---
+title: bookmarks
+slug: Mozilla/Add-ons/WebExtensions/API/bookmarks
+translation_of: Mozilla/Add-ons/WebExtensions/API/bookmarks
+---
+<div>{{AddonSidebar}}</div>
+
+<p>A API <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions">WebExtensions</a> {{WebExtAPIRef("bookmarks")}} permite uma extensão interagir e manipular o sistema de favoritos do navegador. Você pode pode usá-lo para favoritar páginas, obter favoritos existentes e, editar, remover ou organizar os favoritos.</p>
+
+<p>Para utilizar esta API, uma extensão deve ser requisitada para o "bookmarks" <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permission</a> em seu arquivo <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json">manifest.json</a></code> .</p>
+
+<h2 id="Tipos">Tipos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("bookmarks.BookmarkTreeNode")}}</dt>
+ <dd>Representa um favorito ou um diretório de favoritos como árvore.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.BookmarkTreeNodeType")}}</dt>
+ <dd>O enum {{jsxref("String")}} o qual descreve se um nó na árvore é ou não um favorito, uma pasta ou um separador.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.BookmarkTreeNodeUnmodifiable")}}</dt>
+ <dd>O enum {{jsxref("String")}} o qual especifica porque um favorito ou uma pasta não pode ser modificado.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.CreateDetails")}}</dt>
+ <dd>Contém informações ao qual é passada para a função {{WebExtAPIRef("bookmarks.create()")}} quando um novo favorito é criado.</dd>
+</dl>
+
+<h2 id="Funções">Funções</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("bookmarks.create()")}}</dt>
+ <dd>Cria um favorito ou uma pasta.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.get()")}}</dt>
+ <dd>Retrieves one or more {{WebExtAPIRef("bookmarks.BookmarkTreeNode", "BookmarkTreeNode")}}s, given a bookmark's ID or an array of bookmark IDs.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.getChildren()")}}</dt>
+ <dd>Recupera os filhos especificados {{WebExtAPIRef("bookmarks.BookmarkTreeNode", "BookmarkTreeNode")}}.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.getRecent()")}}</dt>
+ <dd>Recupera um número requisitado de favoritos adicionados recentemente.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.getSubTree()")}}</dt>
+ <dd>Recupera uma parte da árvore de favoritos, iniciando por um nó previamente especificado.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.getTree()")}}</dt>
+ <dd>Recupera a árvore de favoritos inteira em um array de objetos {{WebExtAPIRef("bookmarks.BookmarkTreeNode", "BookmarkTreeNode")}}.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.move()")}}</dt>
+ <dd>Move o especificado {{WebExtAPIRef("bookmarks.BookmarkTreeNode", "BookmarkTreeNode")}} para um novo local dentro da árvore de favoritos.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.remove()")}}</dt>
+ <dd>Remove um favorito ou uma pasta de favoritos vazia dado o ID do nó.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.removeTree()")}}</dt>
+ <dd>Remove recursivamente uma pasta de favoritos; isto é; dado o ID do nó da pasta e todos seus descendentes.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.search()")}}</dt>
+ <dd>Procura por {{WebExtAPIRef("bookmarks.BookmarkTreeNode", "BookmarkTreeNode")}}s que batam com o conjunto de critérios especificados.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.update()")}}</dt>
+ <dd>Atualiza o título e/ou autor do favorito de uma URL, ou o nome de uma pasta de favoritos dado o ID do favorito.</dd>
+</dl>
+
+<h2 id="Eventos">Eventos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("bookmarks.onCreated")}}</dt>
+ <dd>Disparado quando um favorito ou uma pasta é criado.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.onRemoved")}}</dt>
+ <dd>Disparado quando um favorito ou uma pasta é removido. Quando uma pasta é removida recursivamente, uma simples notificação é disparada para o diretório, e nenhum para seu conteúdo.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.onChanged")}}</dt>
+ <dd>Disparado quando um favorito ou pasta é modificado. Atualmente, somente mudanças no <code>title</code> e <code>url</code> o disparam.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.onMoved")}}</dt>
+ <dd>Disparado quando um favorito ou pasta é movido para uma pasta pai diferente ou para um novo local dentro deste pasta.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.onChildrenReordered")}}</dt>
+ <dd>Fired when the user has sorted the children of a folder in the browser's UI. This is not called as a result of a {{WebExtAPIRef("bookmarks.move", "move()")}}.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.onImportBegan")}}</dt>
+ <dd>Disparado quando uma sessão de importação de favoritos começa. Custosos observers {{WebExtAPIRef("bookmarks.onCreated")}} atualizam até o {{WebExtAPIRef("bookmarks.onImportEnded")}} ser disparado. Observers deveriam ainda manipular outras notificações imediatamente.</dd>
+ <dt>{{WebExtAPIRef("bookmarks.onImportEnded")}}</dt>
+ <dd>Disparado quando uma sessão de importação de favoritos é finalizada.</dd>
+</dl>
+
+<h2 id="Compatibilidade_nos_navegadores">Compatibilidade nos navegadores</h2>
+
+<p>{{Compat("webextensions.api.bookmarks")}}</p>
+
+<div class="hidden note">
+<p>A sessão "Chrome incompatibilities" está incluso no <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities">https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities</a> usando a macro <a href="/en-US/docs/Template:WebExtChromeCompat">WebExtChromeCompat</a>.</p>
+
+<p>Se precisar atualizar este conteúdo, edite <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities">https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities</a>, então recarregue a página para ver suas alterações.</p>
+</div>
+
+<p>{{WebExtExamples("h2")}}</p>
+
+<div class="note"><strong>Agradecimentos</strong>
+
+<p>Esta API é baseada na API Chromium <a href="https://developer.chrome.com/extensions/bookmarks"><code>chrome.bookmarks</code></a> . Esta documentação é derivada do <a href="https://chromium.googlesource.com/chromium/src/+/master/chrome/common/extensions/api/bookmarks.json"><code>bookmarks.json</code></a> no código do Chromium.</p>
+
+<p>Os dados de compatibilidade do Microsoft Edge são fornecidos pela Microsoft Corporation e aqui estão sob a Creative Commons Attribution 3.0 United States License.</p>
+</div>
+
+<div class="hidden">
+<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+</pre>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/browseraction/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/browseraction/index.html
new file mode 100644
index 0000000000..29eae4f07f
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/browseraction/index.html
@@ -0,0 +1,128 @@
+---
+title: browserAction
+slug: Mozilla/Add-ons/WebExtensions/API/browserAction
+tags:
+  - API
+  - Add-ons
+  - Extensões
+  - Interfaces
+  - Não Padrão
+  - Referencia
+  - browserAction
+translation_of: Mozilla/Add-ons/WebExtensions/API/browserAction
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Adiciona um botão a barra de ferramentas do navegador.</p>
+
+<p>Uma <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Browser_action">browser action</a> é um botão na barra de ferramentas do navegador.</p>
+
+<p>Você pode associar um popup junto ao botão. O popup é especificado usando HTML, CSS e JavaScript, apenas como uma página web normal. O JavaScript rodando no popup tem o mesmo acesso a API WebExtension completa, assim como seus scripts em backend, mas seu contexto global é o popup, não a página exibida no navegador atualmente. Para afetar páginas web você precisa comunicá-las via <a href="/en-US/Add-ons/WebExtensions/Modify_a_web_page#Messaging">messages</a>.</p>
+
+<p>Se você especificar um popup ele está exibido — e o conteúdo será carregado — quando o usuário clicar no ícone. Você não especificar um popup, quando o usuário clicar no ícone um evento será disparado para sua extensão.</p>
+
+<p>Você pode definir muitas ações de propriedades do navegador de modo declarativo usando a chave <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a> </code>no arquivo manifest.json.</p>
+
+<p>Com a API <code>browserAction você pode</code>:</p>
+
+<ul>
+ <li>Usar {{WebExtAPIRef("browserAction.onClicked")}} para escutar por cliques no ícone.</li>
+ <li>Atribuir e obter as propriedades do ícone — icone, titulo, popup, e assim por diante. Você pode obter e atribui-los globalmente para todas as abas, ou para uma aba específica informando o ID como um argumento adicional.</li>
+</ul>
+
+<h2 id="Tipos">Tipos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("browserAction.ColorArray")}}</dt>
+ <dd>Um array de quatro números inteiros entre 0-55 definido uma cor RGB.</dd>
+ <dt>{{WebExtAPIRef("browserAction.ImageDataType")}}</dt>
+ <dd>Dados do pixel de uma imagem. Deve ser um objeto <code><a href="/en-US/docs/Web/API/ImageData">ImageData</a></code> (por exemplo, de um elemento {{htmlelement("canvas")}}).</dd>
+</dl>
+
+<h2 id="Funções">Funções</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("browserAction.setTitle()")}}</dt>
+ <dd>Atribui ação de título do navegador. Ele será exibido em um tooltip.</dd>
+ <dt>{{WebExtAPIRef("browserAction.getTitle()")}}</dt>
+ <dd>Obtém a ação de título do navegador.</dd>
+ <dt>{{WebExtAPIRef("browserAction.setIcon()")}}</dt>
+ <dd>Atribui a ação de ícone ao navegador.</dd>
+ <dt>{{WebExtAPIRef("browserAction.setPopup()")}}</dt>
+ <dd>Atribui o documento HTML que será aberto como um popup quando o usuário clicar na ação de ícone do navegador.</dd>
+ <dt>{{WebExtAPIRef("browserAction.getPopup()")}}</dt>
+ <dd>Obtém o documento HTML atribuido como uma ação de popup do navegador.</dd>
+ <dt>{{WebExtAPIRef("browserAction.openPopup()")}}</dt>
+ <dd>Abre a ação popup do navegador.</dd>
+ <dt>{{WebExtAPIRef("browserAction.setBadgeText()")}}</dt>
+ <dd>Atribui a ação do texto distintivo do navegador. O emblema é exibido acima do ícone.</dd>
+ <dt>{{WebExtAPIRef("browserAction.getBadgeText()")}}</dt>
+ <dd>Obtém o texto do emblema do navegador.</dd>
+ <dt>{{WebExtAPIRef("browserAction.setBadgeBackgroundColor()")}}</dt>
+ <dd>Atribui a cor de fundo do emblema.</dd>
+ <dt>{{WebExtAPIRef("browserAction.getBadgeBackgroundColor()")}}</dt>
+ <dd>Obtém a cor de fundo do emblema.</dd>
+ <dt>{{WebExtAPIRef("browserAction.enable()")}}</dt>
+ <dd>Habilita a ação do navegador para uma aba. Por padrão, ações são habilitadas para todas as abas.</dd>
+ <dt>{{WebExtAPIRef("browserAction.disable()")}}</dt>
+ <dd>Desabilita a ação para uma aba do navegador, significando que ela não pode ser clicada quando aquela aba estiver ativa.</dd>
+ <dt>{{WebExtAPIRef("browserAction.isEnabled()")}}</dt>
+ <dd>Verifica se a ação do navegador está ou não habilitada.</dd>
+</dl>
+
+<h2 id="Eventos">Eventos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("browserAction.onClicked")}}</dt>
+ <dd>Disparado quando uma ação do ícone do navegador é clicada. Este evento não será disparado quando a ação do navegador tiver um popup.</dd>
+</dl>
+
+<h2 id="Compatibilidade_dos_navegadores">Compatibilidade dos navegadores</h2>
+
+<p>{{Compat("webextensions.api.browserAction")}}</p>
+
+<div class="hidden note">
+<p>A sessão "Chrome incompatibilities" está inclusa em <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities"> https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities</a> usando a macro <a href="/en-US/docs/Template:WebExtChromeCompat">WebExtChromeCompat</a>.</p>
+
+<p>Se precisar atualizar este conteúdo edite <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities">https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities</a>, então recarregue esta página para visualizar suas alterações.</p>
+</div>
+
+<p>{{WebExtExamples("h2")}}</p>
+
+<div class="note"><strong>Agradecimentos</strong>
+
+<p>Esta API é baseada na API <a href="https://developer.chrome.com/extensions/browserAction"><code>chrome.browserAction</code></a> do Chromium. Este documento é derivado do <a href="https://chromium.googlesource.com/chromium/src/+/master/chrome/common/extensions/api/browser_action.json"><code>browser_action.json</code></a> no código do Chromium.</p>
+
+<p>Os dados de compatibilidade do Microsoft Edge são fornecidos Microsoft Corporation e estão aqui inclusos sob a Creative Commons Attribution 3.0 United States License.</p>
+</div>
+
+<div class="hidden">
+<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+</pre>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/browsersettings/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/browsersettings/index.html
new file mode 100644
index 0000000000..197bc1ab3e
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/browsersettings/index.html
@@ -0,0 +1,60 @@
+---
+title: browserSettings
+slug: Mozilla/Add-ons/WebExtensions/API/browserSettings
+tags:
+  - Extensões
+  - Referencia
+translation_of: Mozilla/Add-ons/WebExtensions/API/browserSettings
+---
+<div>{{AddonSidebar}}</div>
+
+<div>Habilita uma extensão para modificar certas configurações globais do navegador. Cada propriedade desta API é um objeto {{WebExtAPIRef("types.BrowserSetting", "BrowserSetting")}}, provendo a capacidade de modificar uma configuração particular.</div>
+
+<div> </div>
+
+<div>Devido estas serem configurações globais, é possível haver conflito entre extensões. Veja a documentação <code><a href="/en-US/Add-ons/WebExtensions/API/types/BrowserSetting/set">BrowserSetting.set()</a></code> para detalhes de como ligar com conflitos .</div>
+
+<div> </div>
+
+<div>
+<p>Para usar esta API você precisa ter a <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissão</a> "browserSettings".</p>
+</div>
+
+<h2 id="Propriedades">Propriedades</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("browserSettings.allowPopupsForUserEvents")}}</dt>
+ <dd>Determina se o código em execução nas páginas podem mostrar popups em resposta a eventos do usuário.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.cacheEnabled")}}</dt>
+ <dd>Determina se o cache do navegador está ou não habilitado.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.closeTabsByDoubleClick")}}</dt>
+ <dd>Determina se a aba selecionada pode ser fechada com um duplo click.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.contextMenuShowEvent")}}</dt>
+ <dd>Determina o evento do mouse que dispara um menu de contexto de popup.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.homepageOverride")}}</dt>
+ <dd>Lê o valor da página inicial do navegador.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.imageAnimationBehavior")}}</dt>
+ <dd>Determina como o navegador trata imagens animadas.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.newTabPageOverride")}}</dt>
+ <dd>Lê o valor da nova aba do navegador.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.newTabPosition")}}</dt>
+ <dd>Controla a posição de abas recentemente abertas relativa as abas já presentes.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.openBookmarksInNewTabs")}}</dt>
+ <dd>Determina se os favoritos são abertos na aba atual ou em uma nova aba.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.openSearchResultsInNewTabs")}}</dt>
+ <dd>Determina se a busca de resultados é aberta na aba atual ou em uma nova.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.openUrlbarResultsInNewTabs")}}</dt>
+ <dd>Determina se as sugestões do autocompletar da barra de endereços são abertas  na aba atual ou em uma nova.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.overrideDocumentColors")}}</dt>
+ <dd>Controla se as cores de escolha do usuário sobrescreverão as cores das páginas.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.useDocumentFonts")}}</dt>
+ <dd>Controle se o navegador usará as fontes especificadas pela página web ou somente fontes embutidas.</dd>
+ <dt>{{WebExtAPIRef("browserSettings.webNotificationsDisabled")}}</dt>
+ <dd>Previne que os sites exibam notificações usando a API Web <code><a href="/en-US/docs/Web/API/notification">Notification</a></code>.</dd>
+</dl>
+
+<h2 id="Compatibilidade_de_browser">Compatibilidade de browser</h2>
+
+<p>{{Compat("webextensions.api.browserSettings")}}</p>
+
+<p>{{WebExtExamples("h2")}}</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/browsingdata/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/browsingdata/index.html
new file mode 100644
index 0000000000..e956a583ab
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/browsingdata/index.html
@@ -0,0 +1,120 @@
+---
+title: browsingData
+slug: Mozilla/Add-ons/WebExtensions/API/browsingData
+translation_of: Mozilla/Add-ons/WebExtensions/API/browsingData
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Habilita extensões a limpar os dados que estão acumulados enquando o usuário navega.</p>
+
+<p>Na API <code>browsingData</code>, os dados de navegação são divididos em tipos:</p>
+
+<ul>
+ <li>cache do browser</li>
+ <li>cookies</li>
+ <li>downloads</li>
+ <li>histórico</li>
+ <li>armazenamento local</li>
+ <li>dados de plugin</li>
+ <li>dados de formulários salvos</li>
+ <li>senhas salvas</li>
+</ul>
+
+<p>Você pode usar a função {{WebExtAPIRef("browsingData.remove()")}} para remover qualquer combinação desses tipos. Há também funções específicas para remover cada tipo de data em particular, como por exemplo {{WebExtAPIRef("browsingData.removePasswords()", "removePasswords()")}}, {{WebExtAPIRef("browsingData.removeHistory()", "removeHistory()")}} e assim por diante.</p>
+
+<p>Todas funções <code>browsingData.remove[X]()</code> pegam o objeto {{WebExtAPIRef("browsingData.RemovalOptions")}} que você usa para controlar outros dois aspectos da remoção de dados:</p>
+
+<ul>
+ <li>quão antigos são os dados para a remoção</li>
+ <li>se é para remover dados de páginas normais, ou também para hospedar aplicativos web ou add-ons. Observe que esta opção ainda não é suportada no Firefox.</li>
+</ul>
+
+<p>Finalmente, a API {{WebExtAPIRef("browsingData.settings()")}} fornece uma função que retorna o atual valor das configurações da funcionalidade "Limpar Histórico".</p>
+
+<p>Para usar esta API você deve ter a <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/permissions#API_permissions">permissão de API</a> "browsingData".</p>
+
+<h2 id="Tipos">Tipos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("browsingData.DataTypeSet")}}</dt>
+ <dd>Objeto usado para especificar o tipo de dado para remoção: por exemplo, histórico, downloads, senhas e assim por diante.</dd>
+ <dt>{{WebExtAPIRef("browsingData.RemovalOptions")}}</dt>
+ <dd>Objeto usado para especificar o quanto tempo para remoção de dados, e se remover dados adicionados em uma navegação web normal, por aplicativos hospedados ou por add-ons.</dd>
+</dl>
+
+<h2 id="Methods">Methods</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("browsingData.remove()")}}</dt>
+ <dd>Remove os dados de navegação especificado pelo seu tipo.</dd>
+ <dt>{{WebExtAPIRef("browsingData.removeCache()")}}</dt>
+ <dd>Limpa o cache do navegador.</dd>
+ <dt>{{WebExtAPIRef("browsingData.removeCookies()")}}</dt>
+ <dd>Remove os cookies.</dd>
+ <dt>{{WebExtAPIRef("browsingData.removeDownloads()")}}</dt>
+ <dd>Remove a lista de arquivos baixados.</dd>
+ <dt>{{WebExtAPIRef("browsingData.removeFormData()")}}</dt>
+ <dd>Limpa os dados de um formulário salvo.</dd>
+ <dt>{{WebExtAPIRef("browsingData.removeHistory()")}}</dt>
+ <dd>Limpa o histórico do navegador.</dd>
+ <dt>{{WebExtAPIRef("browsingData.removeLocalStorage()")}}</dt>
+ <dd>Limpa qualquer <a href="/en-US/docs/Web/API/Window/localStorage">local storage</a> criado por websites.</dd>
+ <dt>{{WebExtAPIRef("browsingData.removePasswords()")}}</dt>
+ <dd>Limpa passwords salvos.</dd>
+ <dt>{{WebExtAPIRef("browsingData.removePluginData()")}}</dt>
+ <dd>Limpa os dados associados com plugins.</dd>
+ <dt>{{WebExtAPIRef("browsingData.settings()")}}</dt>
+ <dd>Obtém o valor atual de configuração da funcionalidade "Limpar Histórico" do navegador.</dd>
+</dl>
+
+<h2 id="Compatibilidade_de_browser">Compatibilidade de browser</h2>
+
+<div class="hidden">A tabela de compatibilidade desta página é gerada para dados estruturados. Se deseja contribuir, favor verificar <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e nos enviar um pull request.</div>
+
+<p>{{Compat("webextensions.api.browsingData", 2)}}</p>
+
+<div class="note hidden">
+<p>A sessão "incompatibilidades do Chrome" está inclusa pela <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities"> https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities</a> usando o <a href="/en-US/docs/Template:WebExtChromeCompat">WebExtChromeCompat</a> macro.</p>
+
+<p>Se precisar atualizar este conteúdo, edite <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities">https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Chrome_incompatibilities</a>, então recarregue esta página para visualizar suas alterações.</p>
+</div>
+
+<p>{{WebExtExamples("h2")}}</p>
+
+<div class="note"><strong>Agradecimentos</strong>
+
+<p>Esta API é baseada na API <a href="https://developer.chrome.com/extensions/browsingData"><code>chrome.browsingData</code></a> do Chromium.</p>
+
+<p>Os dados de compatibilidade do Microsoft Edge compatibility são fornecidos pela Microsoft Corporation e aqui estão inclusos sob a Creative Commons Attribution 3.0 United States License.</p>
+</div>
+
+<div class="hidden">
+<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+</pre>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/clipboard/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/clipboard/index.html
new file mode 100644
index 0000000000..4399588cb3
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/clipboard/index.html
@@ -0,0 +1,34 @@
+---
+title: clipboard
+slug: Mozilla/Add-ons/WebExtensions/API/clipboard
+tags:
+  - Área de transferência
+translation_of: Mozilla/Add-ons/WebExtensions/API/clipboard
+---
+<div>{{AddonSidebar}}</div>
+
+<p>A API de área de transferência habilita uma extensão para copiar itens para a área de transferência do sistema. Atualmente a API suporta apenas a cópia de imagens, mas é pretendido suportar a cópia de texto e HTML no futuro.</p>
+
+<p>Esta API WebExtension existe primariamente por causa que o padrão da API web para área de transferência <a href="https://w3c.github.io/clipboard-apis/#writing-to-clipboard">não suporta escrita de imagens</a>. Se e quando esta funcionalidade for adicionada na API wb padrão, esta API pode ser depreciada.</p>
+
+<p>Leitura da área de transfência não é suportada por esta API, devido esta já poder ser lida usando as APIs padrão da plataforma web. Veja <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Interact_with_the_clipboard#Reading_from_the_clipboard">interagindo com a área de transferência</a>.</p>
+
+<p>Esta API é baseada na API <code><a class="external external-icon" href="https://developer.chrome.com/apps/clipboard">clipboard</a></code> do Chrome's API, mas esta API está disponível somente para o Chrome.</p>
+
+<p>Para utilizar esta API voce precisa ter a <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissão</a> "clipboardWrite".</p>
+
+<h2 id="Funções">Funções</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("clipboard.setImageData()")}}</dt>
+ <dd>Copia uma imagem para a área de transferência.</dd>
+</dl>
+
+<h2 id="Compatibilidade_do_navegador">Compatibilidade do navegador</h2>
+
+<p>{{Compat("webextensions.api.clipboard", 1, 1)}} {{WebExtExamples("h2")}}</p>
+
+<div class="note"><strong>Agradecimentos</strong>
+
+<p>Esta API é baseada na API Chromium <a href="https://developer.chrome.com/apps/clipboard"><code>chrome.clipboard</code></a>.</p>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/commands/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/commands/index.html
new file mode 100644
index 0000000000..876c09a9a9
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/commands/index.html
@@ -0,0 +1,83 @@
+---
+title: commands
+slug: Mozilla/Add-ons/WebExtensions/API/commands
+translation_of: Mozilla/Add-ons/WebExtensions/API/commands
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Escuta por usuário executando comandos que você registrou usando o <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/commands"><code>commands</code> manifest.json key</a>.</p>
+
+<h2 id="Tipos">Tipos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("commands.Command")}}</dt>
+ <dd>Objeto representando um comando. Contém a informação especificada no comando <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/commands"><code>commands</code> manifest.json key</a>.</dd>
+</dl>
+
+<h2 id="Funções">Funções</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("commands.getAll")}}</dt>
+ <dd>
+ <p>Obtém todos os comandos registrados para esta extensão.</p>
+ </dd>
+ <dt>{{WebExtAPIRef("commands.reset")}}</dt>
+ <dd>
+ <p>Reseta a descrição do comando dado e atalho para os valores dados na chave do manifesto.</p>
+ </dd>
+ <dt>{{WebExtAPIRef("commands.update")}}</dt>
+ <dd>
+ <p>Modifica a descrição ou atalho dado um comando.</p>
+ </dd>
+</dl>
+
+<h2 id="Eventos">Eventos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("commands.onCommand")}}</dt>
+ <dd>
+ <div>Disparado quando um comando é executado usando seu atalho associado ao teclado.</div>
+ </dd>
+</dl>
+
+<h2 id="Compatibilidade_do_navegador">Compatibilidade do navegador</h2>
+
+<p>{{Compat("webextensions.api.commands")}}{{WebExtExamples("h2")}}</p>
+
+<div class="note"><strong>Agradecimentos</strong>
+
+<p>Esta API é baseada na API <a href="https://developer.chrome.com/extensions/commands"><code>chrome.commands</code></a> do Chromium.</p>
+
+<p>Os dados de compatibilidade do Microsoft Edge são fornecidos pela Microsoft Corporation e estão aqui inclusos sob a Creative Commons Attribution 3.0 United States License.</p>
+</div>
+
+<div class="hidden">
+<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+</pre>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/contentscripts/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/contentscripts/index.html
new file mode 100644
index 0000000000..f158dcdee4
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/contentscripts/index.html
@@ -0,0 +1,38 @@
+---
+title: contentScripts
+slug: Mozilla/Add-ons/WebExtensions/API/contentScripts
+translation_of: Mozilla/Add-ons/WebExtensions/API/contentScripts
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Use esta API para registrar o conteúdo de scripts. Registrando um conteúdo de scripts instrui o navegador para inserir conteúdo de script fornecido em páginas que batem com um padrão de URL fornecida.</p>
+
+<p>Esta API é muito similar a chave do <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/content_scripts">"content_scripts"</a></code>  no manifest.json key, exceto pelo  <code>"content_scripts"</code>, o conjunto de conteúdo de scripts a padrões associados são fixados no momento da instalação. Com a API <code>contentScripts</code>, uma extensão pode registrar e desregistrar scripts em tempo de execução.</p>
+
+<p>Para usar a API, invoque {{WebExtAPIRef("contentScripts.register()")}} passando um objeto definido para registrar os scripts, os padrões de URL e outras opções. Ele retorna uma <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a></code> que é resolvida com o objeto {{WebExtAPIRef("contentScripts.RegisteredContentScript")}}.</p>
+
+<p>O objeto <code>RegisteredContentScript</code> represente os scripts que foram registrados com a chamada <code>register()</code>. Ele define um método <code>unregister()</code> que você pode usar para desregistrar o conteúdo de scripts. O conteúdo de scripts também são desregistrados automaticamente quando a página que os criou é destruida. Por exemplo, se estão registrados para uma página em segundo plano serão desregistrados automaticamente quando esta página for destruida, e se eles estão registrados para uma barra lateral ou popup, também serão desregistrados automaticamente quando essas forem fechadas.</p>
+
+<p>Não há permissão para a API <code>contentScripts</code>, mas uma extensão pode ter a <a href="/en-US/Add-ons/WebExtensions/manifest.json/permissions#Host_permissions">permissão de host</a> apropriada para algum padrão passado para o <code>register()</code>.</p>
+
+<h2 id="Tipos">Tipos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("contentScripts.RegisteredContentScript")}}</dt>
+ <dd>
+ <p>Um objeto deste tipo é retornado pela função {{WebExtAPIRef("contentScripts.register()")}} . Ele representa o conteúdo dos scripts que foram registrados por aquela chamada, e podem ser usados para desregistrar o conteúdo do script.</p>
+ </dd>
+</dl>
+
+<h2 id="Funções">Funções</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("contentScripts.register()")}}</dt>
+ <dd>Registra o conteúdo dos scripts fornecidos.</dd>
+</dl>
+
+<h2 id="Compatibilidade_do_navegador">Compatibilidade do navegador</h2>
+
+<p>{{Compat("webextensions.api.contentScripts", 10, 1)}}</p>
+
+<p> {{WebExtExamples("h2")}}</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/contextualidentities/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/contextualidentities/index.html
new file mode 100644
index 0000000000..652e9d08b2
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/contextualidentities/index.html
@@ -0,0 +1,62 @@
+---
+title: contextualIdentities
+slug: Mozilla/Add-ons/WebExtensions/API/contextualIdentities
+tags:
+  - Extensões Web
+  - Identidade contextual
+translation_of: Mozilla/Add-ons/WebExtensions/API/contextualIdentities
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Trabalhar com identidades contextuais: listar, criar, remover e atualizar identidades contextuais.</p>
+
+<p>"Identidades conceituais", também conhecido como "containers",  consiste em uma funcionalidade do navegador cuja premissa é que usuários assumem multiplas identidades quando navegam na internet, e desejam manter alguma separação entre tais identidades. Por exemplo, um usuário pode considerar sua "identidade de trabalho" separada de sua "identidade pessoal", e não desejar compartilhar cookies entre esses dois contextos.</p>
+
+<p>Com a funcionalidade de identidades contextuais, cada uma possui um nome, cor e um ícone. Novas abas são atribuidas a uma identidade, e o nome, ícone e cor aparecerão na barra de endereço. Internamente, cada identidade guarda seu próprio cookie e não os compartilha entre outras abas.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14719/containers.png" style="display: block; height: 259px; margin-left: auto; margin-right: auto; width: 515px;">Identidade contextual é uma funcionalidade experimental no Firefox e está habilitado apenas no Firefox Nightly. Para habilitá-lo em outras versões do Firefox, atribua true as seguintes preferências: <code>privacy.userContext.enabled</code>. Observe que embora identidades contextuais estejam disponíveis no Firefox para Android, não há uma interface gráfica funcionando com ela para esta versão de navegador.</p>
+
+<p>Antes do Firefox 57, a API <code>contextualIdentities</code> é disponível apenas se a funcionalidade de identidade contextual está habilitada por si mesma. Se uma extensão tentou usar a API <code>contextualIdentities</code> API sem a funcionalidade estar habilitada, então as chamadas do método deveria resolver suas promises com <code>false</code>.</p>
+
+<p>Para o Firefox 57 em diante, se uma extensão que usa a API <code>contextualIdentities</code> está instalada, então a funcionalidade de identidade contextual será habilitada automaticamente. Observe que embora ainda é possível para o usuário desabilitar a funcionalidade usando a preferência "privacy.userContext.enabled". Isse isso ocorrer, então a chamada do método <code>contextualIdentities</code> rejeitará suas promises com uma mensagem de erro.</p>
+
+<p>Para mais informações sobre identidade contextual no Firefox veja <a href="https://wiki.mozilla.org/Security/Contextual_Identity_Project/Containers">este guia</a>.</p>
+
+<p>Identidades contextuais atualmente não são suportadas em outros navegadores.</p>
+
+<p>Para usar esta API você precisará incluir a <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissão</a> "contextualIdentities" em seu arquivo <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json">manifest.json</a>.</p>
+
+<h2 id="Tipos">Tipos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("contextualIdentities.ContextualIdentity")}}</dt>
+ <dd>Contém informações sobre uma identidade contextual.</dd>
+</dl>
+
+<h2 id="Funções">Funções</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("contextualIdentities.create()")}}</dt>
+ <dd>Cria uma nova identidade contextual.</dd>
+ <dt>{{WebExtAPIRef("contextualIdentities.get()")}}</dt>
+ <dd>Recupera uma única identidade contextual, dado o ID do cookie que armazena.</dd>
+ <dt>{{WebExtAPIRef("contextualIdentities.query()")}}</dt>
+ <dd>Recupera todas identidades contextuais, ou todas com um nome em particular.</dd>
+ <dt>{{WebExtAPIRef("contextualIdentities.update()")}}</dt>
+ <dd>Atualiza as propriedades existentes de uma identidade contextual.</dd>
+ <dt>{{WebExtAPIRef("contextualIdentities.remove()")}}</dt>
+ <dd>Exclui uma identidade contextual.</dd>
+ <dt>
+ <h2 id="Eventos">Eventos</h2>
+ </dt>
+ <dt>{{WebExtAPIRef("contextualIdentities.onCreated")}}</dt>
+ <dd>Disparado quando uma identidade contextual é criada.</dd>
+ <dt>{{WebExtAPIRef("contextualIdentities.onRemoved")}}</dt>
+ <dd>Disparado quando uma identidade contextual é removida.</dd>
+ <dt>{{WebExtAPIRef("contextualIdentities.onUpdated")}}</dt>
+ <dd>Disparado quando uma ou mais propriedades de uma identidade contextual é atualizada.</dd>
+</dl>
+
+<h2 id="Compatibilidade_de_navegador">Compatibilidade de navegador</h2>
+
+<p>{{Compat("webextensions.api.contextualIdentities")}} {{WebExtExamples("h2")}}</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/cookies/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/cookies/index.html
new file mode 100644
index 0000000000..ac53214831
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/cookies/index.html
@@ -0,0 +1,162 @@
+---
+title: cookies
+slug: Mozilla/Add-ons/WebExtensions/API/cookies
+translation_of: Mozilla/Add-ons/WebExtensions/API/cookies
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Habilita extensões a obter e atribuir cookies, e ser notificado quando eles mudam.</p>
+
+<p>Para usar esta API, você precisa incluir a <a href="/en-US/Add-ons/WebExtensions/manifest.json/permissions#API_permissions">API permission</a> "cookies" em seu arquivo <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json">manifest.json</a>, bem como a <a href="/en-US/Add-ons/WebExtensions/manifest.json/permissions#Host_permissions">host permissions</a> para os sites cujos cookies você precisa acessar. Veja <a href="/en-US/Add-ons/WebExtensions/API/cookies#Permissions">cookie Permissions</a>.</p>
+
+<h2 id="Permissões">Permissões</h2>
+
+<p>Para usar esta API, uma extensão especificar a "cookies" <a href="/en-US/Add-ons/WebExtensions/manifest.json/permissions#API_permissions">API permission</a> em seu arquivo manifest, junto com a <a href="/en-US/Add-ons/WebExtensions/manifest.json/permissions#Host_permissions">host permissions</a> para qualquer site que deseja acessar os cookies. O add-on pode ler ou escrever qualquer cookie no qual poderia ser lido ou escrito pela URL correspondente nas permissões de host, por exemplo:</p>
+
+<dl>
+ <dt><code>http://*.example.com/</code></dt>
+ <dd>
+ <p>Uma extensão com esta permissão de host pode:</p>
+
+ <ul>
+  <li>Ler um cookie inseguro para <code>www.example.com</code>, com qualquer caminho.</li>
+  <li>Escrever um cookie seguro ou inseguro para <code>www.example.com</code>, com qualquer caminho.</li>
+ </ul>
+
+ <p><em>não </em>pode:</p>
+
+ <ul>
+  <li>Ler um cookie seguro de <code>www.example.com</code>.</li>
+ </ul>
+ </dd>
+ <dt><code>http://www.example.com/</code></dt>
+ <dd>
+ <p>Uma extensão com esta permissão de host pode:</p>
+
+ <ul>
+  <li>Ler um cookie não seguro para <code>www.example.com</code>, com qualquer caminho.</li>
+  <li>Ler um cookie não seguro para <code>.example.com</code>, com qualquer caminho.</li>
+  <li>Escrever um cookie seguro ou não seguro para <code>www.example.com</code> com qualquer caminho.</li>
+  <li>Escrever um cookie seguro ou não seguro para <code>.example.com</code> com qualquer caminho.</li>
+ </ul>
+
+ <p><em>não </em>pode:</p>
+
+ <ul>
+  <li>Ler ou escrever um cookie para <code>foo.example.com</code>.</li>
+  <li>Ler ou escrever um cookie para <code>foo.www.example.com</code>.</li>
+ </ul>
+ </dd>
+ <dt><code>*://*.example.com/</code></dt>
+ <dd>
+ <p>Uma extensão com esta permissão de host pode:</p>
+
+ <ul>
+  <li>Ler ou escrever um cookie seguro ou inseguro para <code>www.example.com</code> com qualquer caminho.</li>
+ </ul>
+ </dd>
+</dl>
+
+<h2 id="Isolamento_de_primera_parte">Isolamento de primera parte</h2>
+
+<p>Cookies de terceiros são aquleles enviados por sites em que você está num dado momento, por exemplo:</p>
+
+<ol>
+ <li>Você acessa <a href="http://bbc.com">bbc.com</a>. Ele contém uma publicidade do <a href="http://tracker.com">tracker.com</a> que atribui um cookie associado com o domínio "<a href="http://tracker.com">tracker.com</a>".</li>
+ <li>Você acessa <a href="http://cnn.com">cnn.com</a>. Ele também contém uma publicidade do <a href="http://tracker.com">tracker.com</a> que atribui um cookie associado ao domínio "<a href="http://tracker.com">tracker.com</a>".</li>
+ <li>Eventualmente ambos os cookies podem ser enviados para <a href="http://tracker.com">tracker.com</a>. Quem então pode descobrir que o mesmo usuário visitou ambos os sites.</li>
+</ol>
+
+<p>Quando um isolamento de primeira parte está ativo, cookies são ainda qualificados pelo domínio da página original visitada pelo usuário (essencialmente, o domínio exibe o usuário na barra da URL, também conhecido como "domínio de primeira parte). Isto significa que não é possivel para um rastreador correlacionar o cookie da <a href="http://bbc.com">bbc.com</a> com o cookie da <a href="http://cnn.com">cnn.com</a>, então o rastreador não pode monitorar um simples usuários através de ambos os sites.</p>
+
+<p>Isolamento de primera parte pode ser habilitado diretamente pelo usuário ajustando a configuração do navegador , e pode ser atribuia do extensões usando a configuração <code><a href="/en-US/Add-ons/WebExtensions/API/privacy/websites#Properties">firstPartyIsolate</a></code> atribuida a API <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/privacy">privacy</a></code>. Observe que este isolamento de primeira parte está habilitado por padrão no navegador <a href="https://www.torproject.org/">Tor</a>.</p>
+
+<p>Na API <code>cookies</code>, o domínio de primeira parte é representado usando o atributo <code>firstPartyDomain</code>. Todos os cookies atribuidos enquanto o isolamento de primeira parte está habilitado terá este atributo atribuito para o domínio da página original. No exemplo acima, deveria ser "<a href="http://bbc.com">bbc.com</a>" para um cookie e "<a href="http://cnn.com">cnn.com</a>" para outro. Todos os cookies atribuidos pelos websites enquanto o isolamento de primeira parte estiver desabilitado terão sua propriedade atribuida a uma string vazia.<br>
+ <br>
+ As APIs {{WebExtAPIRef("cookies.get()")}}, {{WebExtAPIRef("cookies.getAll()")}}, {{WebExtAPIRef("cookies.set()")}} and {{WebExtAPIRef("cookies.remove()")}} aceitam a opção <code>firstPartyDomain</code>.<br>
+ <br>
+ Quando o isolamento de primeira parte está habilitado, você deve informar esta opção ou a chamada da API irá falhar e retornar uma promise rejeitada. For <code>get()</code>, <code>set()</code>, and <code>remove()</code> you must pass a string value. Para um <code>getAll()</code>, você pode passar <code>null</code>, e irá obter todos os cookies que possuem ou não um valor não vazio para o <code>firstPartyDomain</code>.<br>
+ <br>
+ Quando o isolamento de primeira parte está desabilitado, o parâmetro <code>firstPartyDomain</code> é opcional por padrão é uma string vazia.  Uma string não vazia pode ser utilizada para recuperar ou podificar cookies de isolamento de primeira parte.  Da mesma forma, passando <code>null</code> como <code>firstPartyDomain</code> para o <code>getAll()</code> retornará todos os cookies.</p>
+
+<h2 id="Tipos">Tipos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("cookies.Cookie")}}</dt>
+ <dd>Representa a informação sobre um cookie HTTP.</dd>
+ <dt>{{WebExtAPIRef("cookies.CookieStore")}}</dt>
+ <dd>Representa um cookie armazenado no navegador.</dd>
+ <dt>{{WebExtAPIRef("cookies.OnChangedCause")}}</dt>
+ <dd>Representa o motivo da mudança de um cookie.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("cookies.get()")}}</dt>
+ <dd>Recupera informações sobre um único cookie.</dd>
+ <dt>{{WebExtAPIRef("cookies.getAll()")}}</dt>
+ <dd>Recupera todos os cookies com o padrão de um conjunto de filtros fornecido.</dd>
+ <dt>{{WebExtAPIRef("cookies.set()")}}</dt>
+ <dd>Atribui um cookie com um dado fornecido; pode sobrescrever cookies equivalentes caso existam.</dd>
+ <dt>{{WebExtAPIRef("cookies.remove()")}}</dt>
+ <dd>Remove um cookie pelo nome.</dd>
+ <dt>{{WebExtAPIRef("cookies.getAllCookieStores()")}}</dt>
+ <dd>Lista todos os cookies armazenados.</dd>
+</dl>
+
+<h2 id="Manipulador_de_eventos">Manipulador de eventos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("cookies.onChanged")}}</dt>
+ <dd>Disparado quando um cookie é criado ou removido.</dd>
+</dl>
+
+<dl>
+ <dd>
+ <ul>
+ </ul>
+ </dd>
+</dl>
+
+<h2 id="Compatibilidade_de_navegadores">Compatibilidade de navegadores</h2>
+
+<p>{{Compat("webextensions.api.cookies")}}</p>
+
+<p>{{WebExtExamples("h2")}}</p>
+
+<div class="note"><strong>Agradecimentos</strong>
+
+<p>Esta API é baseada na API <a href="https://developer.chrome.com/extensions/cookies"><code>chrome.cookies</code></a> do Chromium. Esta documentação é derivada do <a href="https://chromium.googlesource.com/chromium/src/+/master/chrome/common/extensions/api/cookies.json"><code>cookies.json</code></a> no código do Chromium.</p>
+</div>
+
+<div class="hidden">
+<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+</pre>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/index.html
new file mode 100644
index 0000000000..955086de10
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/index.html
@@ -0,0 +1,53 @@
+---
+title: JavaScript APIs
+slug: Mozilla/Add-ons/WebExtensions/API
+tags:
+  - NeedsTranslation
+  - TopicStub
+  - WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/API
+---
+<div>{{AddonSidebar}}</div>
+
+<div>
+<p>JavaScript APIs for WebExtensions can be used inside the extension's <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#Background_scripts">background scripts</a> and in any other documents bundled with the extension, including <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Browser_action">browser action</a> or <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Page_actions">page action</a> popups, <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Sidebars">sidebars</a>, <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Options_pages">options pages</a>, or <a href="/en-US/Add-ons/WebExtensions/manifest.json/chrome_url_overrides">new tab pages</a>. A few of these APIs can also be accessed by an extension's <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Anatomy_of_a_WebExtension#Content_scripts">content scripts</a> (see the <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Content_scripts#WebExtension_APIs">list in the content script guide</a>).</p>
+
+<p>To use the more powerful APIs you need to <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/permissions">request permission</a> in your extension's manifest.json.</p>
+
+<p>You can access the APIs using the <code>browser</code> namespace:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">logTabs</span><span class="punctuation token">(</span>tabs<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>tabs<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">query</span><span class="punctuation token">(</span><span class="punctuation token">{</span>currentWindow<span class="punctuation token">:</span> <span class="keyword token">true</span><span class="punctuation token">}</span><span class="punctuation token">,</span> logTabs<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+</div>
+
+<div>
+<p>Many of the APIs are asynchronous, returning a <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promise</a></code>:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">logCookie</span><span class="punctuation token">(</span>c<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>c<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="keyword token">function</span> <span class="function token">logError</span><span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span>e<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="keyword token">var</span> setCookie <span class="operator token">=</span> browser<span class="punctuation token">.</span>cookies<span class="punctuation token">.</span><span class="keyword token">set</span><span class="punctuation token">(</span>
+  <span class="punctuation token">{</span>url<span class="punctuation token">:</span> <span class="string token">"https://developer.mozilla.org/"</span><span class="punctuation token">}</span>
+<span class="punctuation token">)</span><span class="punctuation token">;</span>
+setCookie<span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>logCookie<span class="punctuation token">,</span> logError<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+</div>
+
+<div>
+<p>Note that this is different from Google Chrome's extension system, which uses the <code>chrome</code> namespace instead of <code>browser</code>, and which uses callbacks instead of promises for asynchronous functions. As a porting aid, the Firefox implementation of WebExtensions APIs supports <code>chrome</code> and callbacks as well as <code>browser</code> and promises. Mozilla has also written a polyfill which enables code that uses <code>browser</code> and promises to work unchanged in Chrome: <a class="external external-icon" href="https://github.com/mozilla/webextension-polyfill">https://github.com/mozilla/webextension-polyfill</a>.</p>
+
+<p>Firefox also implements these APIs under the <code>chrome</code> namespace using callbacks. This allows code written for Chrome to run largely unchanged in Firefox for the APIs documented here.</p>
+
+<p>Microsoft Edge uses the <code>browser</code> namespace, but doesn't yet support promise-based asynchronous APIs. In Edge, for the time being, asynchronous APIs must use callbacks.</p>
+
+<p>Not all browsers support all the APIs: for the details, see <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs">Browser support for JavaScript APIs</a>.</p>
+</div>
+
+<div>{{SubpagesWithSummaries}}</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/menus/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/menus/index.html
new file mode 100644
index 0000000000..f63d411e76
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/menus/index.html
@@ -0,0 +1,205 @@
+---
+title: menus
+slug: Mozilla/Add-ons/WebExtensions/API/menus
+tags:
+  - API
+  - Add-ons
+  - Extensions
+  - Interface
+  - Non-standard
+  - Reference
+  - WebExtensions
+  - contextMenus
+  - menus
+translation_of: Mozilla/Add-ons/WebExtensions/API/menus
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Adicione itens ao sistema de menu do navegador.</p>
+
+<p>Esta API é modelada sobre a API <a href="https://developer.chrome.com/extensions/contextMenus">"contextMenus"</a> do Chrome, que permite que extensões do Chrome adicione itens para o contexto de menu do navegador. A API <code>browser.menus</code> adiciona alguns recursos à API do Chrome.</p>
+
+<p>Antes do Firefox 55, esta API foi também nomeada, originalmente, de <code>contextMenus</code>, e esse nome <span class="tlid-translation translation" lang="pt"><span title="">era mantido como um alias; portanto, você pode usar o </span></span><code>contextMenus</code> <span class="tlid-translation translation" lang="pt"><span title="">para escrever um código que funcione no Firefox e também em outros navegadores.</span></span></p>
+
+<p>Para usar essa API, você precisa da <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissão</a> de <code>menus</code>. Você também pode usar o alias <code>contextMenus</code> em vez de <code>menus</code>, mas se usar, a API deve ser acessada como <code>browser.contextMenus</code>.</p>
+
+<p>Exceto para <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/menus/getTargetElement">menus.getTargetElement()</a></code>, essa API não pode ser usada de scripts de conteúdo (content scripts).</p>
+
+<h2 id="Criando_itens_de_menu">Criando itens de menu</h2>
+
+<p>Para criar um item de menu, chamme o método {{WebExtAPIRef("menus.create()")}}. Você passa esse método como um objeto contendo opções para o item, incluindo o ID do item, o tipo do item, e os contextos no qual ele deve ser mostrado.</p>
+
+<p>Escute os cliques no seu item de menu adicionando um ouvinte para o evento {{WebExtAPIRef("menus.onClicked")}}. Este ouvinte será passado</p>
+
+<p>Listen for clicks on your menu item by adding a listener to the {{WebExtAPIRef("menus.onClicked")}} event. Este ouvinte receberá um objeto {{WebExtAPIRef("menus.OnClickData")}} que contém os detalhes do evento.</p>
+
+<p>Você pode criar quatro tipos diferentes de itens de menu, com base no valor da propriedade <code>type</code> que você fornece nas opções para <code>create()</code>:</p>
+
+<ul>
+ <li>"normal": um item de menu que apenas mostra um rótulo.</li>
+ <li>"checkbox": um item de menu que representa um estado binário. Ele mostra uma marca de verificação próxima ao rótulo. Clicar no item ativa esta marca. O ouvinte de clique receberá duas propriedades extras: "checked", indicando que o item foi marcado agora, e "wasChecked", indicando que o item foi marcado antes do evento do clique.</li>
+ <li>"radio": um item de menu que representa um de um grupo de escolhas. Como uma marca de verificação, isso também mostra uma marca de verificação próxima ao rótulo, e seu ouvinte de clique receberá "checked" e "wasChecked". No entanto, se você criar mais de um item de rádio, os itens funcionarão como um grupo de itens de rádio: apenas um item no grupo poderá ser verificado e clicar em um item o tornará o item marcado.</li>
+ <li>"separator": uma linha separando um grupo de itens.</li>
+</ul>
+
+<p>Se você criou mais de um item de menu de contexto ou mais de um item de menu de ferramentas, os itens serão colocados em um submenu. O pai do submenu será identificado com o nome da extensão. Por exemplo, aqui está uma extensão chamada "Demonstração de menu" ("Menu demo"), que adicionou dois itens de menu de contexto:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15431/menus-1.png" style="display: block; height: 406px; margin-left: auto; margin-right: auto; width: 500px;"></p>
+
+<h2 id="Ícones">Ícones</h2>
+
+<p>Se você especificou ícones para sua extensão usando a <a href="/en-US/Add-ons/WebExtensions/manifest.json/icons">chave "icons" do manifest</a>, <span class="tlid-translation translation" lang="pt"><span title=""> o item de menu exibirá o ícone especificado ao lado do rótulo.</span> <span title="">O navegador tentará escolher um ícone de 16x16 pixels para uma exibição normal ou um ícone de 32x32 pixels para uma exibição de alta densidade:</span></span></p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15433/menus-2.png" style="display: block; height: 409px; margin-left: auto; margin-right: auto; width: 500px;"></p>
+
+<p>Apenas para itens dentro de um submenu, você pode especificar ícones customizados passando a opção <code>icons</code> para o {{WebExtAPIRef("menus.create()")}}:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15435/menus-3.png" style="display: block; height: 396px; margin-left: auto; margin-right: auto; width: 500px;"></p>
+
+<h2 id="Exemplo">Exemplo</h2>
+
+<p>Aqui está um menu de contexto contendo quatro itens: um item normal, dois itens de rádio com separadores em cada lado, e uma marca de seleção. Os itens de rádio receberam ícones customizados.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15437/menus-4.png" style="display: block; height: 790px; margin-left: auto; margin-right: auto; width: 500px;">Você pode criar um submenu como este usando o código abaixo:</p>
+
+<pre class="brush: js">browser.menus.create({
+  id: "remove-me",
+  title: browser.i18n.getMessage("menuItemRemoveMe"),
+  contexts: ["all"]
+}, onCreated);
+
+browser.menus.create({
+  id: "separator-1",
+  type: "separator",
+  contexts: ["all"]
+}, onCreated);
+
+browser.menus.create({
+  id: "greenify",
+  type: "radio",
+  title: browser.i18n.getMessage("menuItemGreenify"),
+  contexts: ["all"],
+  checked: true,
+  icons: {
+    "16": "icons/paint-green-16.png",
+    "32": "icons/paint-green-32.png"
+  }
+}, onCreated);
+
+browser.menus.create({
+  id: "bluify",
+  type: "radio",
+  title: browser.i18n.getMessage("menuItemBluify"),
+  contexts: ["all"],
+  checked: false,
+  icons: {
+    "16": "icons/paint-blue-16.png",
+    "32": "icons/paint-blue-32.png"
+  }
+}, onCreated);
+
+browser.menus.create({
+  id: "separator-2",
+  type: "separator",
+  contexts: ["all"]
+}, onCreated);
+
+var checkedState = true;
+
+browser.menus.create({
+  id: "check-uncheck",
+  type: "checkbox",
+  title: browser.i18n.getMessage("menuItemUncheckMe"),
+  contexts: ["all"],
+  checked: checkedState
+}, onCreated);</pre>
+
+<h2 id="Tipos">Tipos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("menus.ContextType")}}</dt>
+ <dd>Os diferentes contextos em que um menu pode aparecer.</dd>
+ <dt>{{WebExtAPIRef("menus.ItemType")}}</dt>
+ <dd><span class="tlid-translation translation" lang="pt"><span title="">O tipo de item de menu</span></span>: "normal", "checkbox", "radio", "separator".</dd>
+ <dt>{{WebExtAPIRef("menus.OnClickData")}}</dt>
+ <dd>Informação enviada quando um item do menu é clicado.</dd>
+</dl>
+
+<h2 id="Propriedades">Propriedades</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("menus.ACTION_MENU_TOP_LEVEL_LIMIT")}}</dt>
+ <dd>O número máximo de itens de extensão de nível superior que podem ser adicionados a um item de menu cujo ContextType seja "browser_action" ou "page_action".</dd>
+</dl>
+
+<h2 id="Funções">Funções</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("menus.create()")}}</dt>
+ <dd>Cria um novo item de menu.</dd>
+ <dt>{{WebExtApiRef("menus.getTargetElement()")}}</dt>
+ <dd>Retorna o elemento para um <code>info.targetElementId</code> determinado.</dd>
+ <dt>{{WebExtApiRef("menus.overrideContext()")}}</dt>
+ <dd>Oculta todos os itens de menu padrão do Firefox para fornecer uma interface de usuário personalizada do menu de contexto.</dd>
+ <dt>{{WebExtAPIRef("menus.refresh()")}}</dt>
+ <dd>Atualiza um menu que está sendo exibido no momento.</dd>
+ <dt>{{WebExtAPIRef("menus.remove()")}}</dt>
+ <dd>Remove um item do menu.</dd>
+ <dt>{{WebExtAPIRef("menus.removeAll()")}}</dt>
+ <dd>Remove todos os itens do menu adicionados por esta extensão.</dd>
+ <dt>{{WebExtAPIRef("menus.update()")}}</dt>
+ <dd>Atualiza um item do menu criado anteriormente.</dd>
+</dl>
+
+<h2 id="Eventos">Eventos</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("menus.onClicked")}}</dt>
+ <dd>Ativado quando um item de menu é clicado.</dd>
+ <dt>{{WebExtAPIRef("menus.onHidden")}}</dt>
+ <dd>Ativado quando o navegador esconde um menu.</dd>
+ <dt>{{WebExtAPIRef("menus.onShown")}}</dt>
+ <dd>Ativado quando o navegador mostra um menu.</dd>
+</dl>
+
+<h2 id="Compatibilidade_do_navegador">Compatibilidade do navegador</h2>
+
+<p>{{ Compat("webextensions.api.menus", 1, "true") }}</p>
+
+<p>{{WebExtExamples("h2")}}</p>
+
+<div class="note"><strong>Reconhecimentos</strong>
+
+<p>Esta API é baseada na API <a href="https://developer.chrome.com/extensions/contextMenus"><code>chrome.contextMenus</code> </a>do Chromium. Esta documentação é derivada do <a href="https://chromium.googlesource.com/chromium/src/+/master/chrome/common/extensions/api/context_menus.json"><code>context_menus.json</code></a> do código do Chromium .</p>
+</div>
+
+<div class="hidden">
+<pre>// Copyright 2015 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+</pre>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/tabs/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/tabs/index.html
new file mode 100644
index 0000000000..b6f69f193b
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/tabs/index.html
@@ -0,0 +1,223 @@
+---
+title: tabs
+slug: Mozilla/Add-ons/WebExtensions/API/tabs
+tags:
+  - API
+  - Add-ons
+  - Extensions
+  - Interface
+  - NeedsTranslation
+  - Non-standard
+  - Reference
+  - TopicStub
+  - WebExtensions
+  - tabs
+translation_of: Mozilla/Add-ons/WebExtensions/API/tabs
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Interact with the browser's tab system.</p>
+
+<p>You can use this API to get a list of opened tabs, filtered by various criteria, and to open, update, move, reload, and remove tabs. You can't directly access the content hosted by tabs using this API, but you can insert JavaScript and CSS into tabs using the {{WebExtAPIRef("tabs.executeScript()")}} or {{WebExtAPIRef("tabs.insertCSS()")}} APIs.</p>
+
+<p>You can use most of this API without any special permission. However:</p>
+
+<ul>
+ <li>To access <code>Tab.url</code>, <code>Tab.title</code>, and <code>Tab.favIconUrl</code>, you need to have the <code>"tabs"</code> <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permission</a>.
+
+  <ul>
+   <li>In Firefox, this also means you need <code>"tabs"</code> to {{WebExtAPIRef("tabs.query()")}} by URL.</li>
+  </ul>
+ </li>
+ <li>To use {{WebExtAPIRef("tabs.executeScript()")}} or {{WebExtAPIRef("tabs.insertCSS()")}}, you must have the <a href="/en-US/Add-ons/WebExtensions/manifest.json/permissions#Host_permissions">host permission</a> for the tab</li>
+</ul>
+
+<p>Alternatively, you can get these permissions temporarily, only for the currently active tab and only in response to an explicit user action, by asking for the <a href="/en-US/Add-ons/WebExtensions/manifest.json/permissions#activeTab_permission"><code>"activeTab"</code> permission</a>.</p>
+
+<p>Many tab operations use a Tab <code>id</code>. Tab <code>id</code>s are guaranteed to be unique to a single tab only within a browser session. If the browser is restarted, then it can and will reuse tab <code>id</code>s. To associate information with a tab across browser restarts, use {{WebExtAPIRef("sessions.setTabValue()")}}.</p>
+
+<h2 id="Types">Types</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("tabs.MutedInfoReason")}}</dt>
+ <dd>Specifies the reason a tab was muted or unmuted.</dd>
+ <dt>{{WebExtAPIRef("tabs.MutedInfo")}}</dt>
+ <dd>This object contains a boolean indicating whether the tab is muted, and the reason for the last state change.</dd>
+ <dt>{{WebExtAPIRef("tabs.PageSettings")}}</dt>
+ <dd>
+ <p>Used to control how a tab is rendered as a PDF by the <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/saveAsPDF" title="Saves the current page as a PDF. This will open a dialog, supplied by the underlying operating system, asking the user where they want to save the PDF."><code>tabs.saveAsPDF()</code></a> method.</p>
+ </dd>
+ <dt>{{WebExtAPIRef("tabs.Tab")}}</dt>
+ <dd>This type contains information about a tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.TabStatus")}}</dt>
+ <dd>Indicates whether the tab has finished loading.</dd>
+ <dt>{{WebExtAPIRef("tabs.WindowType")}}</dt>
+ <dd>The type of window that hosts this tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.ZoomSettingsMode")}}</dt>
+ <dd>Defines whether zoom changes are handled by the browser, by the extension, or are disabled.</dd>
+ <dt>{{WebExtAPIRef("tabs.ZoomSettingsScope")}}</dt>
+ <dd>Defines whether zoom changes will persist for the page's origin, or only take effect in this tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.ZoomSettings")}}</dt>
+ <dd>Defines zoom settings {{WebExtAPIRef("tabs.ZoomSettingsMode", "mode")}}, {{WebExtAPIRef("tabs.ZoomSettingsScope", "scope")}}, and default zoom factor.</dd>
+</dl>
+
+<h2 id="Properties">Properties</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("tabs.TAB_ID_NONE")}}</dt>
+ <dd>A special ID value given to tabs that are not browser tabs (for example, tabs in devtools windows).</dd>
+</dl>
+
+<h2 id="Functions">Functions</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("tabs.captureTab()")}}</dt>
+ <dd>Creates a data URI encoding an image of the visible area of the given tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.captureVisibleTab()")}}</dt>
+ <dd>Creates a data URI encoding an image of the visible area of the currently active tab in the specified window.</dd>
+ <dt>{{WebExtAPIRef("tabs.connect()")}}</dt>
+ <dd>Sets up a messaging connection between the extension's background scripts (or other privileged scripts, such as popup scripts or options page scripts) and any <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_scripts">content scripts</a> running in the specified tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.create()")}}</dt>
+ <dd>Creates a new tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.detectLanguage()")}}</dt>
+ <dd>Detects the primary language of the content in a tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.discard()")}}</dt>
+ <dd>Discards one or more tabs.</dd>
+ <dt>{{WebExtAPIRef("tabs.duplicate()")}}</dt>
+ <dd>Duplicates a tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.executeScript()")}}</dt>
+ <dd>Injects JavaScript code into a page.</dd>
+ <dt>{{WebExtAPIRef("tabs.get()")}}</dt>
+ <dd>Retrieves details about the specified tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.getAllInWindow()")}} {{deprecated_inline}}</dt>
+ <dd>Gets details about all tabs in the specified window.</dd>
+ <dt>{{WebExtAPIRef("tabs.getCurrent()")}}</dt>
+ <dd>Gets information about the tab that this script is running in, as a <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/Tabs/Tab" title="This type contains information about a tab."><code>tabs.Tab</code></a> object.</dd>
+ <dt>{{WebExtAPIRef("tabs.getSelected()")}} {{deprecated_inline}}</dt>
+ <dd>Gets the tab that is selected in the specified window. <strong>Deprecated: use <a href="https://wiki.developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/query" title="Gets all tabs that have the specified properties, or all tabs if no properties are specified."><code>tabs.query({active: true})</code></a> instead.</strong></dd>
+ <dt>{{WebExtAPIRef("tabs.getZoom()")}}</dt>
+ <dd>Gets the current zoom factor of the specified tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.getZoomSettings()")}}</dt>
+ <dd>Gets the current zoom settings for the specified tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.goForward()")}}</dt>
+ <dd>Go forward to the next page, if one is available.</dd>
+ <dt>{{WebExtAPIRef("tabs.goBack()")}}</dt>
+ <dd>Go back to the previous page, if one is available.</dd>
+ <dt>{{WebExtAPIRef("tabs.hide()")}} {{experimental_inline}}</dt>
+ <dd>Hides one or more tabs.</dd>
+ <dt>{{WebExtAPIRef("tabs.highlight()")}}</dt>
+ <dd>Highlights one or more tabs.</dd>
+ <dt>{{WebExtAPIRef("tabs.insertCSS()")}}</dt>
+ <dd>Injects CSS into a page.</dd>
+ <dt>{{WebExtAPIRef("tabs.move()")}}</dt>
+ <dd>Moves one or more tabs to a new position in the same window or to a different window.</dd>
+ <dt>{{WebExtApiRef("tabs.moveInSuccession()")}}</dt>
+ <dd>Modifies the succession relationship for a group of tabs.</dd>
+ <dt>{{WebExtAPIRef("tabs.print()")}}</dt>
+ <dd>Prints the contents of the active tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.printPreview()")}}</dt>
+ <dd>
+ <div>Opens print preview for the active tab.</div>
+ </dd>
+ <dt>{{WebExtAPIRef("tabs.query()")}}</dt>
+ <dd>Gets all tabs that have the specified properties, or all tabs if no properties are specified.</dd>
+ <dt>{{WebExtAPIRef("tabs.reload()")}}</dt>
+ <dd>Reload a tab, optionally bypassing the local web cache.</dd>
+ <dt>{{WebExtAPIRef("tabs.remove()")}}</dt>
+ <dd>Closes one or more tabs.</dd>
+ <dt>{{WebExtAPIRef("tabs.removeCSS()")}}</dt>
+ <dd>Removes from a page CSS which was previously injected by calling {{WebExtAPIRef("tabs.insertCSS()")}}.</dd>
+ <dt>{{WebExtAPIRef("tabs.saveAsPDF()")}}</dt>
+ <dd>Saves the current page as a PDF.</dd>
+ <dt>{{WebExtAPIRef("tabs.sendMessage()")}}</dt>
+ <dd>Sends a single message to the content script(s) in the specified tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.sendRequest()")}} {{deprecated_inline}}</dt>
+ <dd>Sends a single request to the content script(s) in the specified tab. <strong>Deprecated</strong>: use {{WebExtAPIRef("tabs.sendMessage()")}} instead.</dd>
+ <dt>{{WebExtAPIRef("tabs.setZoom()")}}</dt>
+ <dd>Zooms the specified tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.setZoomSettings()")}}</dt>
+ <dd>Sets the zoom settings for the specified tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.show()")}} {{experimental_inline}}</dt>
+ <dd>Shows one or more tabs that have been {{WebExtAPIRef("tabs.hide()", "hidden")}}.</dd>
+ <dt>{{WebExtAPIRef("tabs.toggleReaderMode()")}}</dt>
+ <dd>Toggles Reader mode for the specified tab.</dd>
+ <dt>{{WebExtAPIRef("tabs.update()")}}</dt>
+ <dd>Navigate the tab to a new URL, or modify other properties of the tab.</dd>
+</dl>
+
+<h2 id="Events">Events</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("tabs.onActivated")}}</dt>
+ <dd>Fires when the active tab in a window changes. Note that the tab's URL may not be set at the time this event fired.</dd>
+ <dt>{{WebExtAPIRef("tabs.onActiveChanged")}} {{deprecated_inline}}</dt>
+ <dd>Fires when the selected tab in a window changes. <strong>Deprecated:</strong> use {{WebExtAPIRef("tabs.onActivated")}} instead.</dd>
+ <dt>{{WebExtAPIRef("tabs.onAttached")}}</dt>
+ <dd>Fired when a tab is attached to a window, for example because it was moved between windows.</dd>
+ <dt>{{WebExtAPIRef("tabs.onCreated")}}</dt>
+ <dd>Fired when a tab is created. Note that the tab's URL may not be set at the time this event fired.</dd>
+ <dt>{{WebExtAPIRef("tabs.onDetached")}}</dt>
+ <dd>Fired when a tab is detached from a window, for example because it is being moved between windows.</dd>
+ <dt>{{WebExtAPIRef("tabs.onHighlightChanged")}} {{deprecated_inline}}</dt>
+ <dd>Fired when the highlighted or selected tabs in a window change. <strong>Deprecated:</strong> use {{WebExtAPIRef("tabs.onHighlighted")}} instead.</dd>
+ <dt>{{WebExtAPIRef("tabs.onHighlighted")}}</dt>
+ <dd>Fired when the highlighted or selected tabs in a window change.</dd>
+ <dt>{{WebExtAPIRef("tabs.onMoved")}}</dt>
+ <dd>Fired when a tab is moved within a window.</dd>
+ <dt>{{WebExtAPIRef("tabs.onRemoved")}}</dt>
+ <dd>Fired when a tab is closed.</dd>
+ <dt>{{WebExtAPIRef("tabs.onReplaced")}}</dt>
+ <dd>Fired when a tab is replaced with another tab due to prerendering.</dd>
+ <dt>{{WebExtAPIRef("tabs.onSelectionChanged")}} {{deprecated_inline}}</dt>
+ <dd>Fires when the selected tab in a window changes. <strong>Deprecated:</strong> use {{WebExtAPIRef("tabs.onActivated")}} instead.</dd>
+ <dt>{{WebExtAPIRef("tabs.onUpdated")}}</dt>
+ <dd>Fired when a tab is updated.</dd>
+ <dt>{{WebExtAPIRef("tabs.onZoomChange")}}</dt>
+ <dd>Fired when a tab is zoomed.</dd>
+</dl>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("webextensions.api.tabs")}}</p>
+
+<p>{{WebExtExamples("h2")}}</p>
+
+<div class="note"><strong>Acknowledgements</strong>
+
+<p>This API is based on Chromium's <a href="https://developer.chrome.com/extensions/tabs"><code>chrome.tabs</code></a> API. This documentation is derived from <a href="https://chromium.googlesource.com/chromium/src/+/master/chrome/common/extensions/api/tabs.json"><code>tabs.json</code></a> in the Chromium code.</p>
+
+<p>Microsoft Edge compatibility data is supplied by Microsoft Corporation and is included here under the Creative Commons Attribution 3.0 United States License.</p>
+</div>
+
+<div class="hidden">
+<pre class="notranslate">// Copyright 2015 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+</pre>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/api/tema/index.html b/files/pt-br/mozilla/add-ons/webextensions/api/tema/index.html
new file mode 100644
index 0000000000..4eb0dc1b8d
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/api/tema/index.html
@@ -0,0 +1,55 @@
+---
+title: tema
+slug: Mozilla/Add-ons/WebExtensions/API/tema
+tags:
+  - Aplicativo
+  - Extensões
+  - Navegador
+  - Tema
+  - Temas
+  - add-on
+  - extensão
+translation_of: Mozilla/Add-ons/WebExtensions/API/theme
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Permite que extensões do navegador alterem seu tema.</p>
+
+<p>Para usar esta API, uma extensão deve solicitar a <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permission</a> (permissão) de "tema" em seu arquivo<a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json"> manifest.json</a>.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Quando configuramos um arquivo de plano de fundo, devemos declarar a <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permission</a> (permissão) de "tema" e, assim sendo, nós não poderemos usar a função <a href="/en-US/Add-ons/WebExtensions/manifest.json/theme">theme</a>  (de tema), se esta for incompatível.</p>
+</div>
+
+<h2 id="Tipo">Tipo</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("theme.Theme")}}</dt>
+ <dd>Representa o conteúdo de um tema.</dd>
+</dl>
+
+<h2 id="Funções">Funções</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("theme.getCurrent()")}}</dt>
+ <dd>Obtém o tema atual do navegador.</dd>
+ <dt>{{WebExtAPIRef("theme.update()")}}</dt>
+ <dd>Atualiza o tema do navegador.</dd>
+ <dt>{{WebExtAPIRef("theme.reset()")}}</dt>
+ <dd>Remove quaisquer atualizações de temas feitas em uma chamada para {{WebExtAPIRef("theme.update()")}}.</dd>
+</dl>
+
+<h2 id="Evento">Evento</h2>
+
+<dl>
+ <dt>{{WebExtAPIRef("theme.onUpdated")}}</dt>
+ <dd>Disparada<em> </em>quando o navegador tiver sido alterado.</dd>
+</dl>
+
+<h2 id="Compatibilidade">Compatibilidade</h2>
+
+<div class="hidden">A tabela de compatibilidade, nesta página, foi gerada a partir de dados estruturados. Se você apreciar contribuir com ela, por favor, verifique a <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e deixe-nos saber de seu interesse.</div>
+
+<p>{{Compat("webextensions.api.theme")}}</p>
+
+<p>{{WebExtExamples("h2")}}</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/browser_support_for_javascript_apis/index.html b/files/pt-br/mozilla/add-ons/webextensions/browser_support_for_javascript_apis/index.html
new file mode 100644
index 0000000000..4333baf5b1
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/browser_support_for_javascript_apis/index.html
@@ -0,0 +1,15 @@
+---
+title: Browser support for JavaScript APIs
+slug: Mozilla/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs
+translation_of: Mozilla/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs
+---
+<div>{{AddonSidebar}}</div>
+
+<div>{{WebExtAllCompatTables}}</div>
+
+<p class="hidden">A compatibilidade table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<div class="note"><strong>Acknowledgements</strong>
+
+<p>Microsoft Edge compatibility data is supplied by Microsoft Corporation and is included here under the Creative Commons Attribution 3.0 United States License.</p>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/empacotando_e_instalando/index.html b/files/pt-br/mozilla/add-ons/webextensions/empacotando_e_instalando/index.html
new file mode 100644
index 0000000000..2b210f5125
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/empacotando_e_instalando/index.html
@@ -0,0 +1,94 @@
+---
+title: Empacotando e Instalando
+slug: Mozilla/Add-ons/WebExtensions/Empacotando_e_instalando
+translation_of: Mozilla/Add-ons/WebExtensions/Temporary_Installation_in_Firefox
+---
+<h2 id="Packaging_your_extension">Packaging your extension</h2>
+
+<div class="note">
+<p>Nós estamos trabalhando em uma GUI  para empacotar e carregar extensões. Veja <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1185460">Bug 1185460</a> para mais informações. Enquanto isso, siga as etapas abaixo.</p>
+</div>
+
+<p>Firefox extensões são empacotados como arquivos XPI, que nada mais são arquivos ZIP mas com extensão ".xpi".</p>
+
+<p>Uma dica para empacotar o arquivo você precisa "zipar" todos os arquivos que está na root do seu diretório.</p>
+
+<h3 id="Windows">Windows</h3>
+
+<ol>
+ <li>Abra a pasta com seus arquivos da extensão.</li>
+ <li>Selecione todos os arquivos.</li>
+ <li>Clique com o direito e escolha Enviar para → Pasta Compactada.</li>
+ <li>Renomeie o arquivo de "something.zip" para "something.xpi".</li>
+</ol>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11949/install-windows.png" style="display: block; height: 576px; margin-left: auto; margin-right: auto; width: 800px;"></p>
+
+<h3 id="Mac_OS_X">Mac OS X</h3>
+
+<ol>
+ <li>Abra a pasta com seus arquivos da extensão.</li>
+ <li>Selecione todos os arquivos.</li>
+ <li>Clique com o direito e escolha Compress <em>n</em> Items.</li>
+ <li>Renomeie o arquivo de<code> Archive.zip</code> para <code>something.xpi</code>.</li>
+</ol>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11951/install-osx.png" style="display: block; height: 449px; margin-left: auto; margin-right: auto; width: 800px;"></p>
+
+<h3 id="Linux_Mac_OS_X_Terminal">Linux / Mac OS X Terminal</h3>
+
+<ol>
+ <li><code>cd path/to/my-extension/</code></li>
+ <li><code>zip -r ../my-extension.xpi *</code></li>
+</ol>
+
+<h2 id="Installing_your_extension">Installing your extension</h2>
+
+<ol>
+ <li>Digite no caminho de URL <code>about:addons</code></li>
+ <li>Clique e araste o arquivo XPI para dentro da página, ou abra o menu de ferramentas e escolha "Install Add-On From File..."</li>
+ <li>Clique instalar no dialog que irá aparecer</li>
+</ol>
+
+<h2 id="Instalando_suas_extensões_no_Firefox_OS">Instalando suas extensões no Firefox OS</h2>
+
+<p>You can install your extension from <a href="/en-US/docs/Tools/WebIDE">WebIDE</a> running on a Desktop connected via USB or Wifi. Open "path/to/my-extension/" as a Packaged App in WebIDE.</p>
+
+<p>When the manifest.json validation status is valid you will be able to Install and Run your extension on the attached Firefox OS device running a nightly build of Firefox OS.</p>
+
+<p>The extension will first have to be enabled in Settings-&gt;Add-ons on the Firefox OS device.</p>
+
+<h2 id="Soluções_de_problemas">Soluções de problemas</h2>
+
+<p>There are a few common problems that you might run into:</p>
+
+<h3 id="Este_add-on_não_poderá_ser_instalado_porque_não_pode_ser_verificado.">"Este add-on não poderá ser instalado porque não pode ser verificado."</h3>
+
+<ul>
+ <li>Make sure you're using <a href="https://nightly.mozilla.org/">Nightly</a> and that <code>xpinstall.signatures.required</code> is <code>false</code> in <code>about:config</code>.</li>
+ <li>Learn more about <a href="/en-US/docs/Mozilla/Add-ons/Distribution">add-on signing and distribution</a>.</li>
+</ul>
+
+<h3 id="Este_add-on_não_pode_ser_instalado_porque_pode_está_corrompido.">"Este add-on não pode ser instalado porque pode está corrompido."</h3>
+
+<ul>
+ <li>Make sure you zipped your add-ons files directly, <em>not</em> the folder <em>containing</em> your add-ons files. Your manifest.json must be at the root of the zip file.</li>
+ <li>Make sure you are using a <a href="https://nightly.mozilla.org/">Nightly</a> build of Firefox.</li>
+</ul>
+
+<h3 id="Nada_aconteceu">Nada aconteceu</h3>
+
+<ul>
+ <li>Make sure your file name actually ends in <code>.xpi</code>, since some operating systems <em>really</em> like to hide file extensions.
+
+  <ul>
+   <li>On Windows, check with View → Show / Hide: File Name Extensions.</li>
+   <li>On Mac OS X, check with File → Get Info → Name and Extension.</li>
+  </ul>
+ </li>
+ <li>It's possible you misclicked and dismissed the installation prompt. Look for a puzzle piece icon next to the Back button in Nightly. Click that to bring the popup back.</li>
+</ul>
+
+<h3 id="Observe_o_console">Observe o console</h3>
+
+<p>Some additional error information relating to how your extension was extracted and loaded might be available in the <a href="/en-US/docs/Tools/Browser_Console">Browser Console</a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/examples/index.html b/files/pt-br/mozilla/add-ons/webextensions/examples/index.html
new file mode 100644
index 0000000000..3b0c265377
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/examples/index.html
@@ -0,0 +1,30 @@
+---
+title: Exemplos de Extensões
+slug: Mozilla/Add-ons/WebExtensions/Examples
+tags:
+  - WebExntesoes
+translation_of: Mozilla/Add-ons/WebExtensions/Examples
+---
+<div>{{AddonSidebar}}</div>
+
+<div>Para ajudar a ilustrar como desenvolver extensões, nós mantemos um repositório com simples exemplos de extensões em <a href="https://github.com/mdn/webextensions-examples">https://github.com/mdn/webextensions-examples</a>. Este artigo descreve a WebExtension APIs utilizadas neste respositório.</div>
+
+<div> </div>
+
+<div>Estes exemplos funcionam no Firefox Nightly: A maioria funciona em versões anteriores do Firefox, porém verifique a chave <a href="/en-US/Add-ons/WebExtensions/manifest.json/applications">strict_min_version</a> no manifest.json da extensão por certificação.</div>
+
+<div> </div>
+
+<div>Se você quiser experimentar estes exemplos, você tem três opções principais:</div>
+
+<div> </div>
+
+<ol>
+ <li>Clonar o repositório, então carregue a extensão diretamente de seu diretório de origem, usando o recurso <a href="/en-US/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">"Load Temporary Add-on"</a>.  A extensão permanecerá carregada até você reiniciar o Firefox.</li>
+ <li>Clonar o repositório, então use a ferramenta linha de comando <a href="/en-US/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a> para executar o Firefox com a extensão instalada.</li>
+ <li>Clonar o repositório, então vá até o diretório de <a href="https://github.com/mdn/webextensions-examples/tree/master/build">build</a> (construção). Isto contém as versões construídas e assinadas de todos os exemplos, então você pode simplesmente abrir eles no Firefox (usando Arquivo/Abrir arquivo) e instalar eles permanentemente, como uma extensão que você pode instalar de <a href="https://addons.mozilla.org/en-US/firefox/">addons.mozilla.org</a>.</li>
+</ol>
+
+<p>Se você quer contribuir com o respositório, <a href="https://github.com/mdn/webextensions-examples/blob/master/CONTRIBUTING.md">nos envie um pull request.</a></p>
+
+<p>{{WebExtAllExamples}}</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/index.html b/files/pt-br/mozilla/add-ons/webextensions/index.html
new file mode 100644
index 0000000000..862d00ba21
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/index.html
@@ -0,0 +1,138 @@
+---
+title: Extensões do navegador
+slug: Mozilla/Add-ons/WebExtensions
+tags:
+  - Extensões
+  - Passo a passo
+  - WebExtension
+translation_of: Mozilla/Add-ons/WebExtensions
+---
+<p class="summary"><span class="seoSummary">Extensões são capazes de extender e modificar a capacidade de um navegador. As extensões para Firefox são criadas usando a API WebExtensions, um sistema comum a vários navegadores para desenvolvimento de extensões.</span> Em grande parte, o sistema é compatível com a <a class="external-icon external" href="https://developer.chrome.com/extensions">API de extensões</a> suportada pelo Google Chrome, Opera e <a href="https://browserext.github.io/browserext/">W3C Draft Community Group</a>.</p>
+
+<p>Extensões escritas para esses navegadores na maioria dos casos vão funcionar no Firefox ou <a href="https://developer.microsoft.com/microsoft-edge/platform/documentation/extensions/">Microsoft Edge</a> com <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Porting_from_Google_Chrome">apenas algumas alterações</a>. A API é também totalmente compatível com o <a href="https://developer.mozilla.org/Firefox/Multiprocess_Firefox">multiprocessamento do Firefox</a>.</p>
+
+<p>Se você tem dúvidas ou sugestões, ou precisa de ajuda para migrar um complemento legado para usar APIs WebExtensions, pode entrar em contato conosco pela <a class="external external-icon" href="https://mail.mozilla.org/listinfo/dev-addons">newsletter de desenvolvimento de complementos </a>ou <a href="irc://irc.mozilla.org/webextensions">#webextensions</a> no <a class="external-icon external" href="https://wiki.mozilla.org/IRC">IRC</a>.</p>
+
+<div class="row topicpage-table">
+<div class="section">
+<h3 id="Começando">Começando</h3>
+
+<ul>
+ <li><a href="/Add-ons/WebExtensions/What_are_WebExtensions">O que é uma extensão </a></li>
+ <li><a href="/Add-ons/WebExtensions/Your_first_WebExtension">Sua primeira extensão</a></li>
+ <li><a href="/Add-ons/WebExtensions/Your_second_WebExtension">Sua segunda extensão</a></li>
+ <li><a href="/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">Anatomia de uma extensão</a></li>
+ <li><a href="/Add-ons/WebExtensions/Examples">Extensões de exemplo</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/What_next_">E depois?</a></li>
+</ul>
+
+<h3 id="Conceitos">Conceitos</h3>
+
+<ul>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/API">Visão geral da API JavaScript</a></li>
+ <li><a href="/Add-ons/WebExtensions/Content_scripts">Scripts de conteúdo</a></li>
+ <li><a href="/Add-ons/WebExtensions/Match_patterns">Padrões de correspondência</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Working_with_files">Trabalhando com arquivos</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Internationalization">Internacionalização</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Security_best_practices">Melhores práticas de segurança</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Content_Security_Policy">Política de segurança de conteúdo</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Native_messaging">Troca de mensagens nativa</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Using_the_devtools_APIs">Usando as APIs devtools</a></li>
+ <li><a href="/Add-ons/WebExtensions/User_experience_best_practices">Melhores práticas de experiência do usuário</a></li>
+ <li><a href="/Add-ons/WebExtensions/Native_manifests">Manifestos nativos</a></li>
+</ul>
+
+<h3 id="Interface_do_usuário">Interface do usuário</h3>
+
+<ul>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface">Introdução</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/Browser_action">Botão na barra de ferramenta</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/Popups">Botão na barra de ferramenta com um popup</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/Page_actions">Botão na barra de endereços</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/Popups">Botão na barra de endereços com um popup</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/Context_menu_items">Itens de menu de contexto</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/Sidebars">Painéis laterais</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/Options_pages">Página de opções</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/Bundled_web_pages">Páginas da extensão</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/Notifications">Notificação</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/Omnibox">Sugestões na barra de endereços</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/user_interface/devtools_panels">Painéis na ferramenta do desenvolvedor</a></li>
+</ul>
+
+<h3 id="Como">Como</h3>
+
+<ul>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Intercept_HTTP_requests">Interceptar solicitações HTTP</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Modify_a_web_page">Modificar uma página da web</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Add_a_button_to_the_toolbar">Adicionar um botão na barra de ferramenta</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Implement_a_settings_page">Implementar uma página de configurações</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Interact_with_the_clipboard">Interagir com a área de transferência</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Working_with_the_Tabs_API">Trabalhar com a API de abas</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Work_with_the_Bookmarks_API">Trabalhar com a API de favoritos</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Work_with_the_Cookies_API">Trabalhar com a API de cookies</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Work_with_contextual_identities">Trabalhar com identidades contextuais</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Safely_inserting_external_content_into_a_page">Inserir conteúdo externo</a></li>
+</ul>
+
+<h3 id="Portabilidade">Portabilidade</h3>
+
+<ul>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Porting_a_legacy_Firefox_add-on">Portando uma extensão do Google Chrome</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Porting_a_legacy_Firefox_add-on">Portando uma extensão legada do Firefox</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Developing_WebExtensions_for_Firefox_for_Android">Desenvolvendo para o Firefox para Android</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Embedded_WebExtensions">WebExtensions incorporadas</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Comparison_with_the_Add-on_SDK">Comparação com Add-on SDK</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Comparison_with_XUL_XPCOM_extensions">Comparação com extensões XUL/XPCOM</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Chrome_incompatibilities">Incompatibilidades com Chrome</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Differences_between_desktop_and_Android">Diferenças entre desktop e Android</a></li>
+</ul>
+
+<h3 id="Fluxo_de_trabalho_do_Firefox">Fluxo de trabalho do Firefox</h3>
+
+<ul>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/User_experience_best_practices">Experiência do usuário</a></li>
+ <li><a href="/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">Instalando</a></li>
+ <li><a href="/Add-ons/WebExtensions/Debugging">Depurando</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Testing_persistent_and_restart_features">Testando funcionalidades de persistência e reinicialização</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Getting_started_with_web-ext">Começando com web-ext</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/web-ext_command_reference">Referência de comandos web-ext</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/WebExtensions_and_the_Add-on_ID">Extensões e ID de complementos</a></li>
+ <li><a href="/Add-ons/WebExtensions/Alternative_distribution_options">Opções de distribuição alternativas</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Request_the_right_permissions">Solicitando as permissões corretas</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Sharing_objects_with_page_scripts">Compartilhando objetos com scripts de páginas</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension">Publicando sua extensão</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Retiring_your_extension">Descontinuando sua extensão</a></li>
+ <li><a href="/Add-ons/WebExtensions/Tips">Dicas e truques</a></li>
+</ul>
+</div>
+
+<div class="section">
+<h3 id="Referências">Referências</h3>
+
+<h4 id="APIs_JavaScript">APIs JavaScript</h4>
+
+<ul>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/API">Visão geral da API JavaScript </a></li>
+ <li><a href="/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs">Tabelas de compatibilidade de navegadores com APIs JavaScript</a></li>
+</ul>
+
+<div class="twocolumns">{{ ListSubpages ("/en-US/Add-ons/WebExtensions/API") }}</div>
+
+<h4 id="Chaves_do_Manifest">Chaves do Manifest</h4>
+
+<ul>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/manifest.json">Visão geral do manifest.json</a></li>
+ <li><a href="/docs/Mozilla/Add-ons/WebExtensions/Browser_compatibility_for_manifest.json">Compatibilidade de navegadores com manifest.json</a></li>
+</ul>
+
+<div class="twocolumns">{{ ListSubpages ("/Add-ons/WebExtensions/manifest.json") }}</div>
+</div>
+</div>
+
+<div class="SnapLinksContainer" style="margin-left: 0px; margin-top: 0px; display: none;">
+<div class="SL_SelectionRect">
+<div class="SL_SelectionLabel"></div>
+</div>
+</div>
+
+<div>{{AddonSidebar}}</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/intercept_http_requests/index.html b/files/pt-br/mozilla/add-ons/webextensions/intercept_http_requests/index.html
new file mode 100644
index 0000000000..f79b4debaa
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/intercept_http_requests/index.html
@@ -0,0 +1,155 @@
+---
+title: Interceptando requisições HTTP
+slug: Mozilla/Add-ons/WebExtensions/Intercept_HTTP_requests
+translation_of: Mozilla/Add-ons/WebExtensions/Intercept_HTTP_requests
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Para interceptar uma requisição HTTP, utilize a API {{WebExtAPIRef("webRequest")}}. Esta API permite adicionar listeners para vários estágios de uma requisição HTTP. Nos listeners, você pode:</p>
+
+<ul>
+ <li>ter acesso ao cabeçalho e o corpo da requisição e, o cabeçalho da resposta</li>
+ <li>cancelar e redirecionar requisições</li>
+ <li>modificar requisições e o cabeçalho da resposta</li>
+</ul>
+
+<p>Neste artigo você verá três diferentes usos para o módulo <code>webRequest</code>:</p>
+
+<ul>
+ <li>Logando como as URLs da requisição são feitas.</li>
+ <li>Redirecionando requisições.</li>
+ <li>Modificando os cabeçalhos da requisição.</li>
+</ul>
+
+<h2 id="Logando_URLs_de_requisição">Logando URLs de requisição</h2>
+
+<p>Crie um novo diretório chamado "requests". Neste diretório, crie um arquivo chamado "manifest.json" com seguinte conteúdo:</p>
+
+<pre class="brush: json">{
+  "description": "Demonstrating webRequests",
+  "manifest_version": 2,
+  "name": "webRequest-demo",
+  "version": "1.0",
+
+  "permissions": [
+    "webRequest",
+    "&lt;all_urls&gt;"
+  ],
+
+  "background": {
+    "scripts": ["background.js"]
+  }
+}</pre>
+
+<p>A seguir, crie um arquivo chamado"background.js" com o seguinte conteúdo:</p>
+
+<pre class="brush: js">function logURL(requestDetails) {
+  console.log("Loading: " + requestDetails.url);
+}
+
+browser.webRequest.onBeforeRequest.addListener(
+  logURL,
+  {urls: ["&lt;all_urls&gt;"]}
+);
+
+</pre>
+
+<p>Aqui vamos usar {{WebExtAPIRef("webRequest.onBeforeRequest", "onBeforeRequest")}} para chamar a função <code>logURL()</code> antes do inicio da requisição. A função <code>logURL()</code> guarda a URL da requisição para o objeto event e efetua log no console do navegador. O <a href="/en-US/Add-ons/WebExtensions/Match_patterns">padrão</a> <code>{urls: ["&lt;all_urls&gt;"]}</code> significa que iremos interceptar as requisições HTTP para todas URLs.</p>
+
+<p>Para testá-lo, <a href="/en-US/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">instale a extensão</a>, <a href="/en-US/docs/Tools/Browser_Console">abra o console do navegador</a>, e abra alguma página da internet. No console do navegador você pode ver as URLs para alguns recursos que o navegador requisita:</p>
+
+<p>{{EmbedYouTube("X3rMgkRkB1Q")}}</p>
+
+<h2 id="Redirecionando_requisições">Redirecionando requisições</h2>
+
+<p>Agora vamos usar o <code>webRequest</code> para redirecionar requisições HTTP. Primeiro, substitua o manifest.json com o seguinte conteúdo:</p>
+
+<pre class="brush: json">{
+
+  "description": "Demonstrating webRequests",
+  "manifest_version": 2,
+  "name": "webRequest-demo",
+  "version": "1.0",
+
+  "permissions": [
+    "webRequest",
+    "webRequestBlocking",
+    "https://developer.mozilla.org/",
+    "https://mdn.mozillademos.org/"
+  ],
+
+  "background": {
+    "scripts": ["background.js"]
+  }
+
+}</pre>
+
+<p>A única alteração aqui é a adição da <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissão</a> <code>"webRequestBlocking"</code>. Precisamos invocar esta permissão extra toda vez que estamos ativamente modificando a requisição.</p>
+
+<p>A seguir, substitua o "background.js" com o seguinte conteúdo:</p>
+
+<pre class="brush: js">var pattern = "https://mdn.mozillademos.org/*";
+
+function redirect(requestDetails) {
+  console.log("Redirecting: " + requestDetails.url);
+  return {
+    redirectUrl: "https://38.media.tumblr.com/tumblr_ldbj01lZiP1qe0eclo1_500.gif"
+  };
+}
+
+browser.webRequest.onBeforeRequest.addListener(
+  redirect,
+  {urls:[pattern], types:["image"]},
+  ["blocking"]
+);</pre>
+
+<p>Novamente vamos usar event listener {{WebExtAPIRef("webRequest.onBeforeRequest", "onBeforeRequest")}} apenas para executar a função antes que cada requisição seja feita. Está função irá substituir a URL desejada com o <code>redirectUrl</code> especificado na função.</p>
+
+<p>Desta vez não estamos interceptando cada requisição: a opção <code>{urls:[pattern], types:["image"]}</code> especifica apenas o que deveria interceptar requisições(1) para URLs residindo sob o "https://mdn.mozillademos.org/" (2) para o recurso de imagens. Veja mais em {{WebExtAPIRef("webRequest.RequestFilter")}}.</p>
+
+<p>Observe também que estamos passando uma opção chamada <code>"blocking"</code>: precisamos informá-la toda vez que desejamos modificar a requisição. Isto faz com que a função bloqueie a requisição de rede, então o navegador espera pelo event listener retornar antes de continuar. Veja a documentação {{WebExtAPIRef("webRequest.onBeforeRequest")}} para mais no <code>"blocking"</code>.</p>
+
+<p>Teste abrindo uma página no MDN que possua muitas imagens (por exemplo <a href="https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor">https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor</a>), <a href="/en-US/Add-ons/WebExtensions/Temporary_Installation_in_Firefox#Reloading_a_temporary_add-on">recarregue a extensão</a> e então recarregue a página:</p>
+
+<p>{{EmbedYouTube("ix5RrXGr0wA")}}</p>
+
+<h2 id="Modificando_os_cabeçalhos_da_requisição">Modificando os cabeçalhos da requisição</h2>
+
+<p>Finalmente iremos utilizar <code>webRequest</code> para modificar os cabeçalhos da requisição. Neste example iremos modificar o cabeçalho "User-Agent" que identifica o navegador como Opera 12.16, mas apenas quando visitamos páginas sob "http://useragentstring.com/".</p>
+
+<p>O "manifest.json" pode permanecer do mesmo jeito.</p>
+
+<p>Modifique o "background.js" com este código:</p>
+
+<pre class="brush: js">var targetPage = "http://useragentstring.com/*";
+
+var ua = "Opera/9.80 (X11; Linux i686; Ubuntu/14.10) Presto/2.12.388 Version/12.16";
+
+function rewriteUserAgentHeader(e) {
+  e.requestHeaders.forEach(function(header){
+    if (header.name.toLowerCase() == "user-agent") {
+      header.value = ua;
+    }
+  });
+  return {requestHeaders: e.requestHeaders};
+}
+
+browser.webRequest.onBeforeSendHeaders.addListener(
+  rewriteUserAgentHeader,
+  {urls: [targetPage]},
+  ["blocking", "requestHeaders"]
+);</pre>
+
+<p>Aqui vamos usar event listener {{WebExtAPIRef("webRequest.onBeforeSendHeaders", "onBeforeSendHeaders")}} para executar a função somente quando os cabeçalhos forem enviados.</p>
+
+<p>O event listener será chamada somente para requisitar as URLs que batem com o <a href="/en-US/Add-ons/WebExtensions/Match_patterns">padrão</a>. Observe também que  passamos novamente <code>"blocking"</code> como uma opção. Passamos também <code>"requestHeaders"</code>, que significa que o listener será passado como um array contendo os cabeçalhos da requisição que desejamos enviar. Veja {{WebExtAPIRef("webRequest.onBeforeSendHeaders")}} para mais informações dessas opções.</p>
+
+<p>A função listener procura pelo cabeçalho "User-Agent" no array de cabeçalhos da requisição, substitui seu valor com o valor <code>ua</code> da variável, e retorna o array modificado. Este array modificado será agora enviado para o servidor.</p>
+
+<p>Teste abrindo <a href="http://useragentstring.com/">useragentstring.com</a> e veja como ele identifica o navegador como sendo o Firefox. Então, recarregue a extensão, recarregue também o <a href="http://useragentstring.com/">useragentstring.com</a> e veja que agora o Firefox é identificado como Opera:</p>
+
+<p>{{EmbedYouTube("SrSNS1-FIx0")}}</p>
+
+<h2 id="Aprenda_mais">Aprenda mais</h2>
+
+<p>Para aprender sobre todas as coisas que você pode fazer com a API <code>webRequest</code>, veja sua <a href="/en-US/Add-ons/WebExtensions/API/WebRequest">documentação de referência</a>.</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/manifest.json/index.html b/files/pt-br/mozilla/add-ons/webextensions/manifest.json/index.html
new file mode 100644
index 0000000000..b8f93649d2
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/manifest.json/index.html
@@ -0,0 +1,105 @@
+---
+title: manifest.json
+slug: Mozilla/Add-ons/WebExtensions/manifest.json
+tags:
+  - Add-ons
+  - Extensions
+  - NeedsTranslation
+  - TopicStub
+  - WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/manifest.json
+---
+<div>{{AddonSidebar}}</div>
+
+<p>The manifest.json file is a <a href="/en-US/docs/Glossary/JSON">JSON</a>-formatted file, and is the only file that every WebExtension must contain.</p>
+
+<p>Using manifest.json, you specify basic metadata about your extension such as the name and version, and can also specify aspects of your extension's functionality, such as background scripts, content scripts, and browser actions.</p>
+
+<p>manifest.json keys are listed below:</p>
+
+<div class="twocolumns">{{ ListSubpages ("/en-US/Add-ons/WebExtensions/manifest.json") }}</div>
+
+<div class="twocolumns"> </div>
+
+<p><code>"manifest_version"</code>, <code>"version"</code>, and <code>"name"</code> are the only mandatory keys. <code>"default_locale"</code> must be present if the "_locales" directory is present and must be absent otherwise. <code>"applications"</code> is not supported in Google Chrome, and is mandatory in Firefox before Firefox 48 and Firefox for Android.</p>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{Compat("webextensions.manifest")}}</p>
+
+<h2 id="Example">Example</h2>
+
+<p>Quick syntax example for manifest.json:</p>
+
+<pre class="brush: json">{
+  "applications": {
+    "gecko": {
+      "id": "addon@example.com",
+      "strict_min_version": "42.0"
+    }
+  },
+
+  "background": {
+    "scripts": ["jquery.js", "my-background.js"],
+    "page": "my-background.html"
+  },
+
+  "browser_action": {
+    "default_icon": {
+      "19": "button/geo-19.png",
+      "38": "button/geo-38.png"
+    },
+    "default_title": "Whereami?",
+    "default_popup": "popup/geo.html"
+  },
+
+  "commands": {
+    "toggle-feature": {
+      "suggested_key": {
+        "default": "Ctrl+Shift+Y",
+        "linux": "Ctrl+Shift+U"
+      },
+      "description": "Send a 'toggle-feature' event"
+    }
+  },
+
+  "content_security_policy": "script-src 'self' https://example.com; object-src 'self'",
+
+  "content_scripts": [
+    {
+      "exclude_matches": ["*://developer.mozilla.org/*"],
+      "matches": ["*://*.mozilla.org/*"],
+      "js": ["borderify.js"]
+    }
+  ],
+
+  "default_locale": "en",
+
+  "description": "...",
+
+  "icons": {
+    "48": "icon.png",
+    "96": "icon@2x.png"
+  },
+
+  "manifest_version": 2,
+
+  "name": "...",
+
+  "page_action": {
+    "default_icon": {
+      "19": "button/geo-19.png",
+      "38": "button/geo-38.png"
+    },
+    "default_title": "Whereami?",
+    "default_popup": "popup/geo.html"
+  },
+
+  "permissions": ["webNavigation"],
+
+  "version": "0.1",
+
+  "web_accessible_resources": ["images/my-image.png"]
+}</pre>
+
+<p> </p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/manifest.json/permissões/index.html b/files/pt-br/mozilla/add-ons/webextensions/manifest.json/permissões/index.html
new file mode 100644
index 0000000000..41312323b4
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/manifest.json/permissões/index.html
@@ -0,0 +1,184 @@
+---
+title: permissões
+slug: Mozilla/Add-ons/WebExtensions/manifest.json/permissões
+translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/permissions
+---
+<div>{{AddonSidebar}}</div>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 30%;">Tipo</th>
+   <td><code>Array</code></td>
+  </tr>
+  <tr>
+   <th scope="row">Obrigatório</th>
+   <td>Não</td>
+  </tr>
+  <tr>
+   <th scope="row">Examplo</th>
+   <td>
+    <pre class="brush: json no-line-numbers">
+"permissions": [
+  "*://developer.mozilla.org/*",
+  "webRequest"
+]</pre>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Use a chave <code>permissions</code> para solicitar privilégios especiais para sua extensão. Esta chave é um array de strings, onde cada string é uma solicitação para uma permissão.</p>
+
+<p>Se você solicitar permissões usando esta chave, o navegador poderá informar ao usuário que a extensão a ser instalada está solicitando certos privilégios, e perguntar se aceita ou não conceder esses privilégios. O navegador também poderá permitir que o usuário inspecione os privilégios de uma extensão depois que essa for instalada.</p>
+
+<p>A chave pode conter três tipos de permissões:</p>
+
+<ul>
+ <li>permissões de servidor (host)</li>
+ <li>permissões de API</li>
+ <li>a permissão activeTab (aba ativa)</li>
+</ul>
+
+<h2 id="Permissões_de_servidor_(host)">Permissões de servidor (host)</h2>
+
+<p>Permissões de servidor são espscificadas como <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Match_patterns">match patterns</a>. Cada <em>pattern</em> identifica um grupo de URLs para os quais a extensão solicita privilégios adicionais. Por exemplo, uma permissão de servidor poderia ser <code>"*://developer.mozilla.org/*"</code>.</p>
+
+<p>Os privilégios adicionais incluem:</p>
+
+<ul>
+ <li>acesso <a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a> e <a href="/en-US/docs/Web/API/Fetch_API">fetch</a> para aquelas origens sem restrições <em>cross-origin</em> (mesmo para requisições feitas a partir de <em>content scripts</em>)</li>
+ <li>habilidade de injetar scripts programaticamente (usando <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/executeScript">tabs.executeScript</a>) em páginas servidas a partir daquelas origens</li>
+ <li>habilidade de receber eventos a partir da API <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/webRequest">webRequest</a> para aqueles servidores</li>
+ <li>habilidade de acessar cookies daquele servidor usando a API <a href="/en-US/Add-ons/WebExtensions/API/cookies">cookies</a>, caso a permissão de API "cookies" também esteja incluída.</li>
+ <li>desconsiderar a proteção contra rastreamento se o servidor for um domínio completo sem asteriscos. Não funciona com <code>&lt;all_urls&gt;</code>.</li>
+</ul>
+
+<p>No Firefox, da versão 56 em diante, extensões recebem automaticamente permissões de servidor para sua própria origem, que é na forma:</p>
+
+<pre><code>moz-extension://60a20a9b-1ad4-af49-9b6c-c64c98c37920/</code></pre>
+
+<p>onde <code>60a20a9b-1ad4-af49-9b6c-c64c98c37920</code> é o ID interno da extensão. A extensão pode obter essa URL programaticamente chamando <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/extension/getURL">extension.getURL()</a>:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">browser<span class="punctuation token">.</span>extension<span class="punctuation token">.</span><span class="function token">getURL</span><span class="punctuation token">(</span><span class="string token">""</span><span class="punctuation token">);</span>
+// moz-extension://60a20a9b-1ad4-af49-9b6c-c64c98c37920/</code></pre>
+
+<h2 id="Permissões_de_API">Permissões de API</h2>
+
+<p>Permissões de API são especificadas como palavras-chave. Cada palavra-chave nomeia uma API WebExtension que a extensão gostaria de usar.</p>
+
+<p>As seguintes palavras-chave estão atualmente disponíveis:</p>
+
+<ul>
+ <li><code>activeTab</code></li>
+ <li><code>alarms</code></li>
+ <li><code>background</code></li>
+ <li><code>bookmarks</code></li>
+ <li><code>browserSettings</code></li>
+ <li><code>browsingData</code></li>
+ <li><code>contentSettings</code></li>
+ <li><code>contextMenus</code></li>
+ <li><code>contextualIdentities</code></li>
+ <li><code>cookies</code></li>
+ <li><code>debugger</code></li>
+ <li><code>dns</code></li>
+ <li><code>downloads</code></li>
+ <li><code>downloads.open</code></li>
+ <li><code>find</code></li>
+ <li><code>geolocation</code></li>
+ <li><code>history</code></li>
+ <li><code>identity</code></li>
+ <li><code>idle</code></li>
+ <li><code>management</code></li>
+ <li><code>menus</code></li>
+ <li><code>nativeMessaging</code></li>
+ <li><code>notifications</code></li>
+ <li><code>pageCapture</code></li>
+ <li><code>pkcs11</code></li>
+ <li><code>privacy</code></li>
+ <li><code>proxy</code></li>
+ <li><code>search</code></li>
+ <li><code>sessions</code></li>
+ <li><code>storage</code></li>
+ <li><code>tabHide</code></li>
+ <li><code>tabs</code></li>
+ <li><code>theme</code></li>
+ <li><code>topSites</code></li>
+ <li><code>webNavigation</code></li>
+ <li><code>webRequest</code></li>
+ <li><code>webRequestBlocking</code></li>
+</ul>
+
+<p>Na maioria dos casos, a permissão apenas concede acesso à API, com as seguintes exceções:</p>
+
+<ul>
+ <li> <code>tabs</code> dá acesso a <a href="/en-US/Add-ons/WebExtensions/API/tabs">partes privilagiadas da API <code>tabs</code></a>: <code>Tab.url</code>, <code>Tab.title</code> e <code>Tab.faviconUrl</code>. No Firefox, você também precisa <code>tabs</code> se quiser incluir <code>url</code> no parâmetro <code>queryInfo</code> para  <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/query">tabs.query()</a></code>. O resto ad API <code>tabs</code> pode ser usado sem solicitar nenhuma permissão.</li>
+ <li><code>webRequestBlocking</code> permite usar o argumento "blocking", assim você pode <a href="/en-US/Add-ons/WebExtensions/API/WebRequest">modificar e cancelar requisições</a>.</li>
+ <li><code>downloads.open</code> permite usar a API {{WebExtAPIRef("downloads.open()")}}.</li>
+ <li><code>tabHide</code> permite usar a API {{WebExtAPIRef("tabs.hide()")}}.</li>
+</ul>
+
+<h2 id="Permissão_activeTab_(aba_ativa)">Permissão activeTab (aba ativa)</h2>
+
+<p>Esta permissão é especificada como <code>"activeTab"</code>. Se uma extensão tem a permissão <code>activeTab</code>, quando o usuário interage com a extensão, a extensão recebe privilégios adicionais somente para a aba ativa.</p>
+
+<p>"Interação do usuário" inclui:</p>
+
+<ul>
+ <li>o usuário clica na ação da extensão, no navegador ou na página</li>
+ <li>o usuário seleciona um item da extensão no menu de contexto</li>
+ <li>o usuário ativa um atalho de teclado definido pela extensão</li>
+</ul>
+
+<p>Os privilégios adicionais são:</p>
+
+<ul>
+ <li>habilidade de injetar JavaScript ou CSS na aba programaticamente, usando <code><a href="/en-US/Add-ons/WebExtensions/API/tabs/executeScript">browser.tabs.executeScript</a></code> e <code><a href="/en-US/Add-ons/WebExtensions/API/tabs/insertCSS">browser.tabs.insertCSS</a></code></li>
+ <li>acesso a essas partes privilegiadas da API <em>tabs</em> na aba atual: <code>Tab.url</code>, <code>Tab.title</code> e <code>Tab.faviconUrl</code>.</li>
+</ul>
+
+<p>A intenção desta permissão é permitir que extensões executem um caso de uso comum, sem ter que lhes dar permissões poderosas demais. Muitas extensões querem "fazer alguma coisa com a página atual quando o usuário pede". Por exemplo, considere uma extensão que queira executar um script na página atual quando o usuário clicar em uma ação do navegador. Se a permissão  <code>activeTab</code> não existisse, a extensão precisaria pedir a permissão de servidor <code>&lt;all_urls&gt;</code>. Mas isso daria à extensão mais poder que o necessário: ela poderia executar scripts em qualquer aba e quando quisesse, em vez de apenas na aba atual e somente em resposta a uma ação do usuário.</p>
+
+<p>Note que você só pode ter acesso à aba ou dado que estava ali, quando a interação do usuário ocorreu (por exemplo, um clique do mouse). Quando a aba ativa muda para outra página, por exemplo devido a concluir o carregamento ou algum outro evento, a permissão não lhe concede mais acesso à aba.</p>
+
+<p>Normalmente, a aba a qual foi concedido <code>activeTab</code> é somente a aba ativa atual, exceto em um caso. A API <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/menus">menus</a></code> permite a uma extensão criar um item de menu que é exibido se o usuário abrir o menu de contexto sobre uma aba (ou seja, no elemento na lista de abas que permite ao usuário mudar de uma aba para outra). Se o usuário clicar em um item desses, a permissão <code>activeTab</code> é concedida para a aba em que o usuário clicou, mesmo que essa não seja a aba ativa no momento (de acordo com Firefox 63, {{bug(1446956)}}).</p>
+
+<h2 id="Acesso_à_área_de_transferência">Acesso à área de transferência</h2>
+
+<p>Existem duas permissões que permitem à extensão interagir com a área de transferência:</p>
+
+<ul>
+ <li><code>clipboardWrite</code>: escrever para a área de transferência usando <code>document.execCommand("copy")</code> ou <code>document.execCommand("cut")</code></li>
+ <li><code>clipboardRead</code>: ler da área de transferência usando <code>document.execCommand("paste")</code></li>
+</ul>
+
+<p>Consulte <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Interact_with_the_clipboard">Interação com a área de transferência</a> para saber todos os detalhes sobre isso.</p>
+
+<h2 id="Armazenamento_ilimitado">Armazenamento ilimitado</h2>
+
+<p>A permissão <code>unlimitedStorage</code>:</p>
+
+<ul>
+ <li>permite que extensões exceder qualquer quota imposta pela API {{WebExtAPIRef("storage.local")}}</li>
+ <li>no Firefox, permite que extensões criem um <a href="/en-US/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria#Firefox_specifics">banco de dados IndexedDB "persistente"</a>, sem que o navegador peça ao usuário permissão no momento em que o banco de dados é criado.</li>
+</ul>
+
+<h2 id="Examplos">Examplos</h2>
+
+<pre class="brush: json no-line-numbers"> "permissions": ["*://developer.mozilla.org/*"]</pre>
+
+<p>Solicita acesso privilegiado a páginas sob developer.mozilla.org.</p>
+
+<pre class="brush: json no-line-numbers">  "permissions": ["tabs"]</pre>
+
+<p>Solicita acesso a partes privilegiadas da API <code>tabs</code>.</p>
+
+<pre class="brush: json no-line-numbers">  "permissions": ["*://developer.mozilla.org/*", "tabs"]</pre>
+
+<p>Solicita ambas as permissões anteriores.</p>
+
+<h2 id="Compatibilidade_com_navegadores">Compatibilidade com navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("webextensions.manifest.permissions")}}</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/manifest.json/short_name/index.html b/files/pt-br/mozilla/add-ons/webextensions/manifest.json/short_name/index.html
new file mode 100644
index 0000000000..10566678d3
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/manifest.json/short_name/index.html
@@ -0,0 +1,43 @@
+---
+title: short_name
+slug: Mozilla/Add-ons/WebExtensions/manifest.json/short_name
+tags:
+  - Manifesto
+  - Sort name
+translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/short_name
+---
+<div>{{AddonSidebar}}</div>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 30%;">Tipo</th>
+   <td><code>String</code></td>
+  </tr>
+  <tr>
+   <th scope="row">Obrigatório</th>
+   <td>No</td>
+  </tr>
+  <tr>
+   <th scope="row">Exemplo</th>
+   <td>
+    <pre class="brush: json no-line-numbers">
+"short_name": "Minha Extensão"</pre>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Nome abreviado (short name) da extensão. Se informado, ele será usado em contextos onde o campo de nome for muito longo. É recomendado que o nome abreviado não deva exceder 12 caracteres. Se o campo do nome abreviado não for incluído no manifest.json, então o nome será usado em vez disso e pode ser truncado. </p>
+
+<p>Isto é um <a href="/en-US/Add-ons/WebExtensions/Internationalization#Internationalizing_manifest.json">propriedade localizável</a>.</p>
+
+<h2 id="Exemplo">Exemplo</h2>
+
+<pre class="brush: json no-line-numbers">"short_name": "Minha Extensão"</pre>
+
+<h2 id="Compatibilidade_de_navegadores">Compatibilidade de navegadores</h2>
+
+<p class="hidden">A tabela de compatibilidade nesta página é gerada de dados estruturados. Se você gostaria de contribuir para os dados, por favor veja <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e envie-nos um 'pull request'.</p>
+
+<p>{{Compat("webextensions.manifest.short_name")}}</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/manifest.json/web_accessible_resources/index.html b/files/pt-br/mozilla/add-ons/webextensions/manifest.json/web_accessible_resources/index.html
new file mode 100644
index 0000000000..9d13e7e72c
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/manifest.json/web_accessible_resources/index.html
@@ -0,0 +1,97 @@
+---
+title: web_accessible_resources
+slug: Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources
+tags:
+  - Add-ons
+  - Extensões
+translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources
+---
+<p>{{AddonSidebar}}</p>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 30%;">Tipo</th>
+   <td><code>Array</code></td>
+  </tr>
+  <tr>
+   <th scope="row">Obrigatório</th>
+   <td>No</td>
+  </tr>
+  <tr>
+   <th scope="row">Exemplo</th>
+   <td>
+    <pre class="brush: json no-line-numbers">
+"web_accessible_resources": [
+  "images/my-image.png"
+]</pre>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Descrição">Descrição</h2>
+
+<p>As vezes, você precisa empacotar recursos — por exemplo, imagens, HTML, CSS ou Javascript — com a sua extensão e fazê-la acessível para as páginas web.</p>
+
+<p>Por exemplo, a <a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">extensão de exemplo Beastify</a> substitui uma página por uma imagem de um animal selecionado pelo usuário. As imagens foram empacotadas com a extensão. Para fazer visível a imagem selecionada, a extensão adiciona elementos <code><a href="/en-US/docs/Web/HTML/Element/img">&lt;img&gt;</a></code> cujo atributo <code>src</code> aponta para a imagem do animal. Para que a página da web possa carregar as imagens, elas devem estar disponíveis na extensão.</p>
+
+<p>With the <code>web_accessible_resources</code> key, you list all the packaged resources that you want to make available to web pages. You specify them as paths relative to the manifest.json file.</p>
+
+<p>Note that content scripts don't need to be listed as web accessible resources.</p>
+
+<p>If an extension wants to use {{WebExtAPIRef("webRequest")}} to redirect a public URL (e.g., HTTPS) to a page that's packaged in the extension, then the extension must list the page in the <code>web_accessible_resources</code> key.</p>
+
+<h3 id="Using_web_accessible_resources">Using web_accessible_resources</h3>
+
+<p>For example, suppose your extension includes an image file at images/my-image.png, like this:</p>
+
+<pre class="no-line-numbers">my-extension-files/
+    manifest.json
+    my-background-script.js
+    images/
+        my-image.png</pre>
+
+<p>To enable a web page to use an <code><a href="/en-US/docs/Web/HTML/Element/img">&lt;img&gt;</a></code> element whose <code>src</code> attribute points to this image, you would specify <code>web_accessible_resources</code> like this:</p>
+
+<pre class="brush: json no-line-numbers">"web_accessible_resources": ["images/my-image.png"]</pre>
+
+<p>The file is then available using a URL like:</p>
+
+<pre class="no-line-numbers">moz-extension://&lt;extension-UUID&gt;/images/my-image.png"</pre>
+
+<p><code>&lt;extension-UUID&gt;</code> is <strong>not</strong> your extension's ID. This ID is randomly generated for every browser instance. This prevents websites from fingerprinting a browser by examining the extensions it has installed.</p>
+
+<div class="blockIndicator note">
+<p>In Chrome, an extension's ID is fixed. When a resource is listed in <code>web_accessible_resources</code>, it is accessible as <code>chrome-extension://&lt;your-extension-id&gt;/&lt;path/to/resource&gt;</code>.  </p>
+</div>
+
+<p>The recommended approach to obtaining the URL of the resource is to use <code><a href="/en-US/Add-ons/WebExtensions/API/runtime/getURL">runtime.getURL</a></code> passing the path relative to manifest.json, for example:</p>
+
+<pre class="brush: js no-line-numbers">browser.runtime.getURL("images/my-image.png");
+// something like:
+// moz-extension://944cfddf-7a95-3c47-bd9a-663b3ce8d699/images/my-image.png</pre>
+
+<p>This approach gives you have the correct URL regardless of the browser your extension is running on.</p>
+
+<h3 id="Wildcards">Wildcards</h3>
+
+<p><code>web_accessible_resources</code> entries can contain wildcards. For example, the following entry would also work to include the resource at "images/my-image.png":</p>
+
+<pre class="brush: json no-line-numbers">  "web_accessible_resources": ["images/*.png"]</pre>
+
+<h3 id="Security">Security</h3>
+
+<p>Note that if you make a page web-accessible, any website may link or redirect to that page. The page should then treat any input (POST data, for examples) as if it came from an untrusted source, just as a normal web page should.</p>
+
+<h2 id="Example">Example</h2>
+
+<pre class="brush: json no-line-numbers">"web_accessible_resources": ["images/my-image.png"]</pre>
+
+<p>Make the file at "images/my-image.png" web accessible.</p>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("webextensions.manifest.web_accessible_resources")}}</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/o_que_vem_a_seguir_/index.html b/files/pt-br/mozilla/add-ons/webextensions/o_que_vem_a_seguir_/index.html
new file mode 100644
index 0000000000..7050516e82
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/o_que_vem_a_seguir_/index.html
@@ -0,0 +1,56 @@
+---
+title: O que vem a seguir ?
+slug: Mozilla/Add-ons/WebExtensions/O_que_vem_a_seguir_
+translation_of: Mozilla/Add-ons/WebExtensions/What_next_
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Você está pronto para começar a tornar a tua ideia de extensão de navegador uma realidade. Antes de iniciar essa jornada, vale a pena estar ciente de algumas coisas que te ajudarão a torná-la tranquila.</p>
+
+<h2 id="Teu_ambiente_de_desenvolvimento">Teu ambiente de desenvolvimento</h2>
+
+<p>Você não precisa de ferramentas de desenvolvimento especiais para criar extensões de navegador: é inteiramente possível criar ótimas extensões de navegador sem mais que um editor de textos. Porém, talvez você tenha desenvolvido para a web e tenha um conjunto de ferramentas e um ambiente que quer usar. Se for assim, você precisa estar ciente de algumas coisas.</p>
+
+<p>Se você usa ferramentas de minificação ou obfuscação para entregar seu código final, você precisará entregar seu código fonte para <a href="#The_review_process">o processo de revisão AMO</a>. Além disso, as ferramentas que você utiliza, — para minificação,  obfuscação e contrução — devem ser open source ( ou oferecer uso gratuito sem limites ) e disponíveis para execução no computador do revisor (Windows, Mac ou Linux). Infelizmente, nossos revisores não podem trabalhar com ferramentas comerciais ou baseadas em web.</p>
+
+<p><a href="/en-US/Add-ons/Source_Code_Submission#About_build_tools">Aprenda mais acerca de ferramentas de construção</a></p>
+
+<h2 id="Third-party_libraries">Third-party libraries</h2>
+
+<p>Third-party libraries are a great way to add complex features or functionality to your browser extensions quickly. When you submit an extension to the <a href="#The_review_processv">AMO review process</a>, the process will also consider any third-party libraries used. To streamline the review, make sure you always download third-party libraries from their official website or repository, and if the library is minified provide a link to the source code. Please note that third-party libraries cannot be modified in any way.</p>
+
+<p><a href="/en-US/Add-ons/Source_Code_Submission">Learn more about submitting source code</a></p>
+
+<h2 id="The_Firefox_Add-on_Distribution_Agreement">The Firefox Add-on Distribution Agreement</h2>
+
+<p>Browser extensions need to be signed to install into the release or beta versions of Firefox. Signing takes place in addons.mozilla.org (AMO) and is subject to the terms and conditions of the Firefox Add-on Distribution Agreement. The goal of the agreement is to ensure Firefox users get access to well supported, quality add-ons that enhance the Firefox experience.</p>
+
+<p><a href="/Add-ons/AMO/Policy/Agreement">Read the agreement</a></p>
+
+<p><a href="/en-US/Add-ons/WebExtensions/Distribution">Learn more about signing</a></p>
+
+<h2 id="The_review_process">The review process</h2>
+
+<p>When a browser extension is submitted for signing, it's subject to automated review. It may also be subject to a manual review, when the automated review determines that a manual review is needed. Your browser extension won't be signed until it’s passed the automated review and may have its signing revoked if it fails to pass the manual review. The review process follows a strict set of guidelines, so it’s easy to check and avoid any likely review problems.</p>
+
+<p><a href="/en-US/Add-ons/AMO/Policy/Reviews">Check out the review policy and guidelines</a></p>
+
+<h2 id="AMO_featured_browser_extensions">AMO featured browser extensions</h2>
+
+<p>If you choose to list your browser extension on AMO, your extension could be featured on the AMO website, in the Firefox browser’s add-on manager, or elsewhere on a Mozilla website. We've compiled a list of guidelines about how extensions are selected for featuring, by following these guidelines you give your extension the best chance of being featured.</p>
+
+<p><a href="/en-US/Add-ons/AMO/Policy/Featured">Learn more about getting your add-ons featured</a></p>
+
+<h2 id="Continue_your_learning_experience">Continue your learning experience</h2>
+
+<p>Now you know what lies ahead, it's time to dive into more details about browser extension development. In the sections that follow, you’ll discover:</p>
+
+<ul>
+ <li>More about the fundamental concepts behind browser extensions, starting with details on how to <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Using_the_JavaScript_APIs">use the JavaScript APIs</a>.</li>
+ <li>A guide to the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface">user interface components</a> available to your browser extensions.</li>
+ <li>A collection of how-to guides on achieving key tasks in your extensions or making use of the JavaScript APIs.</li>
+ <li>Information on how to port other browser extensions to Firefox.</li>
+ <li>Details about the Firefox specific workflows you can use to develop browser extensions.</li>
+ <li>A full reference guide to the JavaScript APIs.</li>
+ <li>A full reference guide to the Manifest keys.</li>
+</ul>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/passo-a-passo/index.html b/files/pt-br/mozilla/add-ons/webextensions/passo-a-passo/index.html
new file mode 100644
index 0000000000..1e49d92e3c
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/passo-a-passo/index.html
@@ -0,0 +1,306 @@
+---
+title: Passo-a-Passo
+slug: Mozilla/Add-ons/WebExtensions/Passo-a-Passo
+tags:
+  - Extensões Web
+  - extensões firefox
+  - passo-a-passo
+translation_of: Mozilla/Add-ons/WebExtensions/Your_second_WebExtension
+---
+<p>Neste artigo iremos criar uma Extensão para Firefox do início ao fim.</p>
+
+<p>A extensão adicionará um novo botão na barra de ferramentas do Firefox. Quando clicar no botão se exibirá um popup habilitando a escolha de um animal. Uma vez que o usuário escolher um animal, a página atual do navegador será substituida por uma imagem do animal escolhido.</p>
+
+<p>Para implementar esse extensão, será necessário:</p>
+
+<ul>
+ <li><strong>definir a ação do navegador, que é um botão ligado a barra de ferramentas</strong>.<br>
+  Para o botão nós iremos fornecer:
+  <ul>
+   <li>um icone chamado "beasts.png"</li>
+   <li>um popup para abrir quando o botão for pressionado. O popup irá ter incluso HTML, CSS e JavaScript.</li>
+  </ul>
+ </li>
+ <li><strong>escrever um content script, "beastify.js" que irá ser injetado na página web</strong>.<br>
+  Este é o código que irá modificar a página.</li>
+ <li><strong>empacotar alguma imagens de animais para substituir na página</strong>.<br>
+  Nós iremos criar as imagens "web accessible resources" então a página poderá referenciar eles.</li>
+</ul>
+
+<p>Você pode visualizar toda a estrutura da extensão da seguinte forma:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11467/beastify-anatomy.svg" style="display: block; height: 664px; margin-left: auto; margin-right: auto; width: 500px;"></p>
+
+<p>É uma extensão extremamente simples, mas mostra muitos conceitos básicos da API de Extensões:</p>
+
+<ul>
+ <li>adicionando um botão na barra de ferramentas</li>
+ <li>Definindo um panel de popup usando HTML, CSS e JavaScript</li>
+ <li>Injetando content scripts nas páginas</li>
+ <li>comunicação entre content scripts e o resto das extensões</li>
+ <li>empacotando recursos com sua extensão que serão usadas nas páginas</li>
+</ul>
+
+<p>Você pode encontrar o código completo da extensão no <a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">GitHub</a>.</p>
+
+<p>Para criar essa extensão você precisará do Firefox 45 ou mais recente.</p>
+
+<h2 id="Escrevendo_a_WebExtension">Escrevendo a WebExtension</h2>
+
+<p>Crie um novo diretório e navegue até ele:</p>
+
+<pre class="brush: bash">mkdir beastify
+cd beastify</pre>
+
+<h3 id="manifest.json">manifest.json</h3>
+
+<p>Agora crie um novo arquivo chamado "manifest.json", e insira o seguinte conteúdo:</p>
+
+<pre class="brush: json">{
+
+  "manifest_version": 2,
+  "name": "Beastify",
+  "version": "1.0",
+
+  "applications": {
+    "gecko": {
+      "id": "beastify@mozilla.org"
+    }
+  },
+
+  "permissions": [
+    "http://*/*",
+    "https://*/*"
+  ],
+
+  "browser_action": {
+    "default_icon": "button/beasts.png",
+    "default_title": "Beastify",
+    "default_popup": "popup/choose_beast.html"
+  },
+
+  "web_accessible_resources": [
+    "beasts/frog.jpg",
+    "beasts/turtle.jpg",
+    "beasts/snake.jpg"
+  ]
+
+}
+</pre>
+
+<ul>
+ <li>As primeiras três chaves : <strong><code>manifest_version</code></strong>, <strong><code>name</code></strong>, e <strong><code>version</code></strong>, são obrigatórias e contém metadados básicos para a extensão.</li>
+ <li><strong><code>permissions</code></strong> lista as permisões que a extensão precisa. Nós iremos apenas perguntar se pediremos permissão para modificar todas as páginas HTTP e HTTPS : veja a documentação para as chaves de  <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissions</a></code>. Nós prefirimos por usar a permissão <code>activeTab</code> aqui , mas atualmente não é suportada pela Firefox.</li>
+ <li><strong><code>browser_action</code></strong> especifica o botão da barra de ferramentas. Iremos fornecer três informações aqui:
+  <ul>
+   <li><strong><code>default_icon</code></strong> é obrigatório, e aponta para o icone do botão</li>
+   <li><strong><code>default_title</code></strong> é opicional, e mostra a mensagem em um tooltip</li>
+   <li><strong><code>default_popup</code></strong> é usado se você quer que um popup seja mostrado quando o usuário clicar no botão. Nós fazemos isto, então incluímos esta chave e apontamos para um arquivo HTML incluído na extensão.</li>
+  </ul>
+ </li>
+ <li><strong><code>web_accessible_resources</code></strong> lista arquivos que queremos criar tornar acessível para as páginas. Uma vez que a extensão substitui as imagens da página com imagens que já empacotamos com a extensão , nós precisamos fazer estas imagens acessíveis à página.</li>
+</ul>
+
+<p>Perceba que todos os caminhos são relativos ao manifest.json.</p>
+
+<h3 id="O_Botão_na_barra_de_ferramentas">O Botão na barra de ferramentas</h3>
+
+<p>O botão na barra de ferramentas precisa de um icone,  e nosso manifest.json informa que nós teriamos um icone em "button/beasts.png".</p>
+
+<p>Crie o diretório "button" e copie o icone com o nome "beasts.png". Você poderá usar um dos nossos <a href="https://github.com/mdn/webextensions-examples/blob/master/beastify/button/beasts.png">exemplo,</a> que é retirado do  <a href="https://www.iconfinder.com/iconsets/free-retina-icon-set">Aha-Soft’s Free Retina iconset</a> e usado sob os termos de sua <a href="http://www.iconbeast.com/faq/">licença</a>.</p>
+
+<p>Se você não fornecer um popup, então um evento de click é lançado para sua extensão quando o usuário clicar no botão. Se você fornecer um popup, o evento de click não envia, mas ao invés disso, o popup é aberto. Nós queremos abrir um popup, então vamos criá-lo na próxima etapa.</p>
+
+<h3 id="O_popup">O popup</h3>
+
+<p>A função do popup é ativar a escolha do usuário para um dos três animais.</p>
+
+<p>Crie um novo diretório chamado "popup" na raiz do projeto. Aqui é onde nós criar os códigos para o popup. O popup irá ser constituido em três arquivos :</p>
+
+<ul>
+ <li><strong><code>choose_beast.html</code></strong> Define o conteúdo do panel</li>
+ <li><strong><code>choose_beast.css</code></strong> Estilo do conteúdo</li>
+ <li><strong><code>choose_beast.js</code></strong> Captura a escolha do usuário executando um content script a aba ativa</li>
+</ul>
+
+<h4 id="choose_beast.html">choose_beast.html</h4>
+
+<p>O arquivo HTML criado é este:</p>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;link rel="stylesheet" href="choose_beast.css"/&gt;
+  &lt;/head&gt;
+
+  &lt;body&gt;
+    &lt;div class="beast"&gt;Frog&lt;/div&gt;
+    &lt;div class="beast"&gt;Turtle&lt;/div&gt;
+    &lt;div class="beast"&gt;Snake&lt;/div&gt;
+
+    &lt;script src="choose_beast.js"&gt;&lt;/script&gt;
+  &lt;/body&gt;
+
+&lt;/html&gt;</pre>
+
+<p>Nós temos um elemento para cada escolha de animal. Perceba que nós incluimos os arquivo CSS e JS nesse arquivo, igual a uma página web.</p>
+
+<h4 id="choose_beast.css">choose_beast.css</h4>
+
+<p>O CSS ajusta o tamanho do popup, garantindo que as três escolhas irão preencher o espaço, e daremos a eles algum estilo básico:</p>
+
+<pre class="brush: css">html, body {
+  height: 100px;
+  width: 100px;
+  margin: 0;
+}
+
+.beast {
+  height: 30%;
+  width: 90%;
+  margin: 3% auto;
+  padding-top: 6%;
+  text-align: center;
+  font-size: 1.5em;
+  background-color: #E5F2F2;
+  cursor: pointer;
+}
+
+.beast:hover {
+  background-color: #CFF2F2;
+}</pre>
+
+<h4 id="choose_beast.js">choose_beast.js</h4>
+
+<p>No JavaScript para o popup, nós iremos "escutar" o evento de click . Se o clique foi em uma das três escolhas de animais, nós iremos injetar um content script na aba ativa. Um vez que o content script é carregado , nós enviaremos uma mensagem com o animal escolhido:</p>
+
+<pre class="brush: js">document.addEventListener("click", function(e) {
+  if (!e.target.classList.contains("beast")) {
+    return;
+  }
+
+  var chosenBeast = e.target.textContent;
+
+  chrome.tabs.executeScript(null, {
+    file: "/content_scripts/beastify.js"
+  });
+
+  chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
+    chrome.tabs.sendMessage(tabs[0].id, {beast: chosenBeast});
+  });
+
+});
+</pre>
+
+<p>É usado três funções da API WebExtension:</p>
+
+<ul>
+ <li><strong><code>chrome.tabs.executeScript</code></strong> Para injetar um content script que se encontra em "content_scripts/beastify.js" na aba ativa</li>
+ <li><strong><code>chrome.tabs.query</code></strong> Obter a aba ativa</li>
+ <li><strong><code>chrome.tabs.sendMessage</code></strong> para enviar uma mensagem para o content scripts executando na aba ativa. A mensagem irá conter as propriedades do animal escolhido.</li>
+</ul>
+
+<h3 id="O_content_script">O content script</h3>
+
+<p>Crie a novo diretório na pasta root do projeto chamado "content_scripts" e crie um novo arquivo com o nome "beastify.js", com o seguinte conteúdo:</p>
+
+<pre class="brush: js">// Assign beastify() as a listener for messages from the extension.
+chrome.runtime.onMessage.addListener(beastify);
+
+function beastify(request, sender, sendResponse) {
+  removeEverything();
+  insertBeast(beastNameToURL(request.beast));
+  chrome.runtime.onMessage.removeListener(beastify);
+}
+
+function removeEverything() {
+  while (document.body.firstChild) {
+    document.body.firstChild.remove();
+  }
+}
+
+function insertBeast(beastURL) {
+  var beastImage = document.createElement("img");
+  beastImage.setAttribute("src", beastURL);
+  beastImage.setAttribute("style", "width: 100vw");
+  beastImage.setAttribute("style", "height: 100vh");
+  document.body.appendChild(beastImage);
+}
+
+function beastNameToURL(beastName) {
+  switch (beastName) {
+    case "Frog":
+      return chrome.extension.getURL("beasts/frog.jpg");
+    case "Snake":
+      return chrome.extension.getURL("beasts/snake.jpg");
+    case "Turtle":
+      return chrome.extension.getURL("beasts/turtle.jpg");
+  }
+}
+
+</pre>
+
+<p>O content script  adiciona um listener da mensagem para a extensão (especificamente , para "choose_beast.js"). No listener:</p>
+
+<ul>
+ <li>remover todos os elementos em <code>document.body</code></li>
+ <li>transforma os nomes dos animais em uma URL para ser usada na imagem</li>
+ <li>Cria uma tag <code>&lt;img&gt;</code>, e insere no DOM</li>
+ <li>Remove a mensagem da listener</li>
+</ul>
+
+<h3 id="Os_animais">Os animais</h3>
+
+<p>Finalmente, nós precisamos incluir as imagens dos animais.</p>
+
+<p>Crie um novo diretório chamado "beasts", e adicione as três imagens nos diretório, com os nomes apropriados. Você pode obter as imagens aqui no <a href="https://github.com/mdn/webextensions-examples/tree/master/beastify/beasts">GitHub</a>, ou aqui:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11459/frog.jpg" style="display: inline-block; height: 200px; margin: 20px; width: 200px;"><img alt="" src="https://mdn.mozillademos.org/files/11461/snake.jpg" style="display: inline-block; height: 200px; margin: 20px; width: 200px;"><img alt="" src="https://mdn.mozillademos.org/files/11463/turtle.jpg" style="display: inline-block; height: 200px; margin: 20px; width: 200px;"></p>
+
+<h2 id="Empacotando_e_instalando">Empacotando e instalando</h2>
+
+<p>Verifique se os seus arquivos estão estruturados de acordo com as informações abaixo:</p>
+
+<pre>beastify/
+
+    beasts/
+        frog.jpg
+        snake.jpg
+        turtle.jpg
+
+    button/
+        beasts.png
+
+    content_scripts/
+        beastify.js
+
+    popup/
+        choose_beast.css
+        choose_beast.html
+        choose_beast.js
+
+    manifest.json</pre>
+
+<p>Extensões Firefox são empacotados como arquivos XPI, que são apenas arquivos ZIP com a extensão "XPI".</p>
+
+<p>Um truque é que o arquivo ZIP  deve ser um dos arquivos de extensão . Portanto, para criar um XPI a partir dos arquivos beastify , navegue até o diretório " beastify " em um shell de comando e digite:</p>
+
+<pre class="brush: bash">   # in beastify/
+   zip -r ../beastify.xpi *</pre>
+
+
+
+<p>Ou você pode compactar com alguma ferramenta do tipo WinRar escolhe a forma de empacotação ZIP e subistituir .zip para XPI</p>
+
+<p>Para instalar o XPI, você apenas irá abrir o Firefox:</p>
+
+<ul>
+ <li>Vá até o Arquivos, seleciona Abrir arquivo, ou pressione Ctrl/Cmd+O</li>
+ <li>selecione "beastify.xpi" na caixa de dialógo que abriu</li>
+</ul>
+
+<p>Você deverá receber um aviso de que você está instalando uma extensão não assinada. Aceite o aviso de advertência.</p>
+
+<p>Você poderá ver o icone aparecer na barra de ferramentas. Abra uma nova página web, então click no icone, selecione um animal e veja a imagem que você escolheu na página.</p>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/pre-requisitos/index.html b/files/pt-br/mozilla/add-ons/webextensions/pre-requisitos/index.html
new file mode 100644
index 0000000000..4e7e854644
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/pre-requisitos/index.html
@@ -0,0 +1,23 @@
+---
+title: Pré-requisitos
+slug: Mozilla/Add-ons/WebExtensions/pre-requisitos
+translation_of: Mozilla/Add-ons/WebExtensions/Prerequisites
+---
+<p>Para desenvolver utilizando as APIs de uma WebExtension, você precisa de uma configuração mínima.</p>
+
+<ul>
+ <li>baixar, instalar e abrir o <a href="https://www.mozilla.org/en-US/firefox/developer/">Firefox Developer Edition</a> ou o <a class="external text" href="https://nightly.mozilla.org/" rel="nofollow">Firefox Nightly</a>. Use o Nightly caso queira as atualizações mais recentes.</li>
+ <li>altere a preferência que permite que o Firefox instale add-ons sem assinatura. Essa opção de configuração só está disponível nas versões do Firefox citadas no item anterior.
+  <ul>
+   <li>digite <code>about:config</code> na barra de endereço do Firefox</li>
+   <li>na caixa de pesquisa digite <code>xpinstall.signatures.required</code></li>
+   <li>dê um duplo clique na preferência ou clique com o botão direito e selecione a opção "Inverter valor" para alternar de <code>verdadeiro</code> para <code>falso</code>.</li>
+  </ul>
+ </li>
+</ul>
+
+<div id="forvo" style="position: absolute; background-color: green; color: white; top: 87px; left: 100px;"> </div>
+
+<div id="forvo" style="position: absolute; background-color: green; color: white;"> </div>
+
+<div id="forvo" style="position: absolute; background-color: green; color: white;"> </div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/sua_primeira_webextension/index.html b/files/pt-br/mozilla/add-ons/webextensions/sua_primeira_webextension/index.html
new file mode 100644
index 0000000000..9d3045e28a
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/sua_primeira_webextension/index.html
@@ -0,0 +1,150 @@
+---
+title: Sua primeira extensão
+slug: Mozilla/Add-ons/WebExtensions/sua_primeira_WebExtension
+translation_of: Mozilla/Add-ons/WebExtensions/Your_first_WebExtension
+---
+<div>{{AddonSidebar}}</div>
+
+<p><span id="result_box" lang="pt"><span>Neste artigo vamos percorrer, do início ao fim, os passos necessários para a criação de uma extensão para o Firefox.</span> <span>A extensão apenas adicionará uma borda vermelha em todas as páginas carregadas em "mozilla.org" ou qualquer um de seus subdomínios</span></span>.</p>
+
+<p>O código fonte para este exemplo está no GitHub: <a href="https://github.com/mdn/webextensions-examples/tree/master/borderify">https://github.com/mdn/webextensions-examples/tree/master/borderify</a>.</p>
+
+<p><span id="result_box" lang="pt"><span>Para começar, você precisará do Firefox versão 45 ou posterior</span></span>.</p>
+
+<h2 id="Construindo_a_Extensão">Construindo a Extensão</h2>
+
+<p>Crie uma nova pasta dando o nome de "<span id="result_box" lang="pt"><span>borderify</span></span>" e navegue para dentro dela.</p>
+
+<pre class="brush: bash">mkdir borderify
+cd borderify</pre>
+
+<h3 id="manifest.json">manifest.json</h3>
+
+<p><span id="result_box" lang="pt"><span>Dentro dessa pasta crie um novo arquivo chamado "manifest.json" e</span> c<span>oloque o seguinte conteúdo no arquivo</span></span>:</p>
+
+<pre class="brush: json">{
+
+  "manifest_version": 2,
+  "name": "Borderify",
+  "version": "1.0",
+
+  "description": "<span id="result_box" lang="pt"><span>Adiciona uma borda vermelha a todas as páginas da Web correspondentes a</span></span> mozilla.org.",
+
+  "icons": {
+    "48": "icons/border-48.png"
+  },
+
+  "content_scripts": [
+    {
+      "matches": ["*://*.mozilla.org/*"],
+      "js": ["borderify.js"]
+    }
+  ]
+
+}</pre>
+
+<ul>
+ <li>As primeiras tres chaves: <code><a href="/en-US/Add-ons/WebExtensions/manifest.json/manifest_version">manifest_version</a></code>, <code><a href="/en-US/Add-ons/WebExtensions/manifest.json/name">name</a></code>, e <code><a href="/en-US/Add-ons/WebExtensions/manifest.json/version">version</a></code>, são obrigatórias e contém os metadados básicos sobre a extensão.</li>
+ <li><code><a href="/en-US/Add-ons/WebExtensions/manifest.json/description">description</a></code> é opcional contudo é recomendada pois aparece no gerenciador de complementos.</li>
+ <li><code><a href="/en-US/Add-ons/WebExtensions/manifest.json/icons">icons</a></code> é opcional porém recomendada pois define os ícones que aparecem no gerenciador de complementos.</li>
+</ul>
+
+<p><span id="result_box" lang="pt"><span>A chave mais interessante aqui é</span></span> <code><a href="/en-US/Add-ons/WebExtensions/manifest.json/content_scripts">content_scripts</a></code>, <span id="result_box" lang="pt"><span>que diz ao Firefox para carregar um script em páginas da Web cujo URL corresponde a um padrão específico.</span> <span>Nesse caso, pedimos ao Firefox para carregar um script chamado "borderify.js" em todas as páginas HTTP ou HTTPS oriundas de "mozilla.org" ou em qualquer um de seus subdomínios.</span></span></p>
+
+<ul>
+ <li><a href="/en-US/Add-ons/WebExtensions/Content_scripts">Saiba mais sobre scripts de conteúdo.</a></li>
+ <li><a href="/en-US/Add-ons/WebExtensions/Match_patterns">Saiba mais sobre padrões de correspondência</a>.</li>
+</ul>
+
+<div class="warning">
+<p><a href="/en-US/Add-ons/WebExtensions/WebExtensions_and_the_Add-on_ID#When_do_you_need_an_Add-on_ID">Em algumas situações, você precisa especificar uma ID para sua extensão</a>. Se você precisar especificar um ID de extensão, inclua a chave <code><a href="/en-US/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> no <code>manifest.json</code> e configure sua propriedade <code>id</code>:</p>
+
+<pre class="brush: json">"applications": {
+  "gecko": {
+    "id": "borderify@example.com"
+  }
+}</pre>
+</div>
+
+<h3 id="iconsborder-48.png">icons/border-48.png</h3>
+
+<p><span id="result_box" lang="pt"><span>A extensão deve ter um ícone.</span> Ele<span> será mostrado ao lado da listagem de extensões no Gerenciador de Extensões.</span> <span>Nosso manifest.json indica que teríamos um ícone localizado na pasta "icons/border-48.png".</span></span></p>
+
+<p><span id="result_box" lang="pt"><span>Crie o diretório "icons" diretamente sob o diretório "borderify".</span> <span>Salve um ícone chamado "border-48.png"</span></span>. Você pode usar o icone <a href="https://github.com/mdn/webextensions-examples/blob/master/borderify/icons/border-48.png">do nosso exemplo</a>, que foi retirado a coleção de ícone do Google Material Design, e é utilizado sob os termos da licença <a href="https://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-ShareAlike</a>.</p>
+
+<p><span id="result_box" lang="pt"><span>Se você escolher criar seu próprio ícone, deve ser 48x48 pixels formato .PNG e</span><span> também deve criar um ícone de 96x96 pixels também .PNG, para telas de alta resolução, e se você fizer isso será especificado como a propriedade 96 do objeto icons em manifest.json</span></span>:</p>
+
+<pre class="brush: json">"icons": {
+  "48": "icons/border-48.png",
+  "96": "icons/border-96.png"
+}</pre>
+
+<p><span id="result_box" lang="pt"><span>Como alternativa, você pode criar um ícone em formato SVG  e ele será dimensionado corretamente</span></span>.</p>
+
+<ul>
+ <li><a href="/en-US/Add-ons/WebExtensions/manifest.json/icons">Saiba mais sobre como especificar ícones.</a></li>
+</ul>
+
+<h3 id="borderify.js">borderify.js</h3>
+
+<p><span id="result_box" lang="pt"><span>Finalmente, crie um arquivo chamado "borderify.js" diretamente dentro do diretório "borderify" com o seguinte</span><span> conteúdo:</span></span></p>
+
+<pre class="brush: js">document.body.style.border = "5px solid red";</pre>
+
+<p><span id="result_box" lang="pt"><span>Este script será carregado nas páginas que correspondem ao padrão especificado na chave </span></span> <code>content_scripts</code> do manifest.json. <span id="result_box" lang="pt"><span>O script tem acesso direto ao documento, igual aos scripts carregados pela própria página.</span></span></p>
+
+<ul>
+ <li><a href="/en-US/Add-ons/WebExtensions/Content_scripts">Saiba mais sobre scripts de conteúdo.</a></li>
+</ul>
+
+<h2 id="Testando">Testando</h2>
+
+<p>Primeiro, verifique se você está com os arquivos corretos nos lugares certos:</p>
+
+<pre>borderify/
+    icons/
+        border-48.png
+    borderify.js
+    manifest.json</pre>
+
+<h3 id="Instalando">Instalando</h3>
+
+<p><span id="result_box" lang="pt"><span>Acesse a área de Debugging do Firefox digitando diretamente na barra de endereço: "about: debugging", em seguida clique em "Load Temporary Add-on" e selecione o "</span></span>borderify.js<span lang="pt"><span>".</span></span></p>
+
+<p>{{EmbedYouTube("cer9EUKegG4")}}</p>
+
+<p><span id="result_box" lang="pt"><span>A Extensão agora será instalado e ficará assim até que você reinicie o Firefox.</span><br>
+ <br>
+ <span>Como alternativa, você pode executar a Extansão a partir da linha de comando usando a ferramenta </span></span> <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a>.</p>
+
+<h3 id="Testando_2">Testando</h3>
+
+<p><span id="result_box" lang="pt"><span>Agora visitar uma página em "mozilla.org" e você deve ver uma borda vermelha em volta da página:</span></span></p>
+
+<p>{{EmbedYouTube("rxBQl2Z9IBQ")}}</p>
+
+<div class="note">
+<p><span id="result_box" lang="pt"><span>Não tente acessar addons.mozilla.org!</span> <span>Os scripts de conteúdo são bloqueados nesse domínio</span></span>.</p>
+</div>
+
+<p><span id="result_box" lang="pt"><span>Experimente um pouco.</span> <span>Edite o script de conteúdo para alterar a cor da borda ou faça outra coisa com o conteúdo da página.</span> <span>Salve o script de conteúdo e, em seguida, recarregue os arquivos da extensão clicando no botão "Reload" em about: debugging.</span> <span>Você poderá ver as mudanças imediatamente:</span></span></p>
+
+<p>{{EmbedYouTube("NuajE60jfGY")}}</p>
+
+<ul>
+ <li><a href="/en-US/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">Saiba mais sobre o carregamento de extensões</a></li>
+</ul>
+
+<h2 id="Empacotando_e_publicando">Empacotando e publicando</h2>
+
+<p><span id="result_box" lang="pt"><span>Para que outras pessoas usem seu complemento, você precisa compactá-lo e enviá-lo para a Mozilla para assinatura.</span> <span>Para saber mais sobre isso, consulte</span></span> <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension">"Publicando sua Extensão"</a>.</p>
+
+<h2 id="Próximos_passos">Próximos passos</h2>
+
+<p><span id="result_box" lang="pt"><span>Agora você tem uma idéia do processo de desenvolvimento de um WebExtension para o Firefox, que tal:</span></span></p>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">Anatomia de uma Extensão</a></li>
+ <li><a href="/en-US/Add-ons/WebExtensions/Your_second_WebExtension">Criar uma Extensão mais complexa</a></li>
+ <li><a href="/en-US/Add-ons/WebExtensions/API">Saber mais sobre JavaScript APIs disponíveis para Extensões.</a></li>
+</ul>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/user_interface/index.html b/files/pt-br/mozilla/add-ons/webextensions/user_interface/index.html
new file mode 100644
index 0000000000..78b988a523
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/user_interface/index.html
@@ -0,0 +1,97 @@
+---
+title: User interface
+slug: Mozilla/Add-ons/WebExtensions/user_interface
+tags:
+  - Landing
+  - NeedsTranslation
+  - TopicStub
+  - User Interface
+  - WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/user_interface
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Extensions that use WebExtension APIs are provided with several user interface options so that their functionality can be made available to the user. A summary of those options is provided below, with a more detailed introduction to each user interface option in this section.</p>
+
+<div class="note">
+<p>For advice on using these UI components to create a great user experience in your extension, please see the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/User_experience_best_practices">User experience best practices</a> article.</p>
+</div>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">UI option</th>
+   <th scope="col">Description</th>
+   <th scope="col" style="width: 350px;">Example</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><a href="/Add-ons/WebExtensions/user_interface/Browser_action">Toolbar button</a> (browser action)</td>
+   <td>A button on the browser toolbar that dispatches an event to the extension when clicked. By default, the button is visible in all tabs.</td>
+   <td><img alt="Example showing a toolbar button (browser action)." src="https://mdn.mozillademos.org/files/15751/browser-action.png" style="height: 364px; width: 700px;"></td>
+  </tr>
+  <tr>
+   <td>Toolbar button with a <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Popups">popup</a></td>
+   <td>A popup on a button in the browser toolbar that opens when the button is clicked. The popup is defined in an HTML document that handles the user interaction.</td>
+   <td><img alt="Example of the pop-up on a toolbar button" src="https://mdn.mozillademos.org/files/15753/popup-shadow.png" style="height: 624px; width: 700px;"></td>
+  </tr>
+  <tr>
+   <td><a href="/Add-ons/WebExtensions/user_interface/Page_actions">Address bar button</a> (page action)</td>
+   <td>A button on the browser address bar that dispatches an event to the extension when clicked. By default, the button is hidden in all tabs.</td>
+   <td><img alt="Example showing an address bar button (page action) " src="https://mdn.mozillademos.org/files/15745/address_bar_button.png" style="height: 348px; width: 700px;"></td>
+  </tr>
+  <tr>
+   <td>Address bar button with a <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Popups">popup</a></td>
+   <td>A popup on a button in the browser address bar that opens when the button is clicked. The popup is defined in an HTML document that handles the user interaction.</td>
+   <td><img alt="Example of a popup on the address bar button" src="https://mdn.mozillademos.org/files/15747/page_action_popup.png" style="height: 524px; width: 700px;"></td>
+  </tr>
+  <tr>
+   <td><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Context_menu_items">Context menu item</a></td>
+   <td>Menu items, checkboxes, and radio buttons on one or more of the browser's context menus. Also, menus can be structured by adding separators. When menu items are clicked, an event is dispatched to the extension.</td>
+   <td><img alt="Example of content menu items added by a WebExtension, from the context-menu-demo example" src="https://mdn.mozillademos.org/files/15756/context_menu_example.png" style="height: 942px; width: 864px;"></td>
+  </tr>
+  <tr>
+   <td><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Sidebars">Sidebar</a></td>
+   <td>
+    <p dir="ltr">An HTML document displayed next to a web page, with the option for unique content per page. The sidebar is opened when the extension is installed, then obeys the user's sidebar visibility selection. User interaction within the sidebar is handled by its HTML document.</p>
+   </td>
+   <td><img alt="Example of a sidebar" src="https://mdn.mozillademos.org/files/15755/bookmarks-sidebar.png" style="height: 846px; width: 700px;"></td>
+  </tr>
+  <tr>
+   <td><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Options_pages">Options page</a></td>
+   <td>A page that enables you to define preferences for your extension that your users can change. The user can access this page from the browser's add-ons manager.</td>
+   <td><img alt="Example showing the options page content added in the favorite colors example." src="https://mdn.mozillademos.org/files/15748/options_page.png"></td>
+  </tr>
+  <tr>
+   <td><a href="/Add-ons/WebExtensions/user_interface/Extension_pages">Extension page</a></td>
+   <td>Use web pages included in your extension to provide forms, help, or any other content required, within windows or tabs.</td>
+   <td><img alt="Example of a simple bundled page displayed as a detached panel." src="https://mdn.mozillademos.org/files/15752/bundled_page_as_panel_small.png" style="height: 432px; width: 700px;"></td>
+  </tr>
+  <tr>
+   <td><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Notifications">Notification</a></td>
+   <td>Transient notifications displayed to the user through the underlying operating system's notifications mechanism. Dispatches an event to the extension when the user clicks a notification, or when a notification closes (either automatically or at the user's request).</td>
+   <td><img alt="Example of an extension triggered system notification" src="https://mdn.mozillademos.org/files/15754/notify-shadowed.png" style="height: 294px; width: 780px;"></td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Omnibox">Address bar suggestion</a></td>
+   <td>Offer custom address bar suggestions when the user enters a keyword.</td>
+   <td><img alt="Example showing the result of the firefox_code_search WebExtension's customization of the address bar suggestions." src="https://mdn.mozillademos.org/files/15749/omnibox_example_small.png" style="height: 464px; width: 700px;"></td>
+  </tr>
+  <tr>
+   <td><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/devtools_panels">Developer tools panel</a></td>
+   <td>A tab with an associated HTML document that displays in the browser's developer tools.</td>
+   <td><img alt="Example showing the result of the firefox_code_search WebExtension's customization of the address bar suggestions." src="https://mdn.mozillademos.org/files/15746/developer_panel_tab.png" style="height: 224px; width: 700px;"></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>The following how-to guides provide step-by-step guidance to creating some of these user interface options:</p>
+
+<ul>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Accessibility_guidelines">Accessibility guidelines</a></li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Add_a_button_to_the_toolbar">Add a button to the toolbar</a></li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Browser_styles">Browser styles</a></li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Extending_the_developer_tools">Extending the developer tools</a></li>
+ <li><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Implement_a_settings_page">Implement a settings page</a></li>
+</ul>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/user_interface/itens_do_menu_de_contexto/index.html b/files/pt-br/mozilla/add-ons/webextensions/user_interface/itens_do_menu_de_contexto/index.html
new file mode 100644
index 0000000000..cf8e2d7198
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/user_interface/itens_do_menu_de_contexto/index.html
@@ -0,0 +1,58 @@
+---
+title: Itens do menu de contexto
+slug: Mozilla/Add-ons/WebExtensions/user_interface/Itens_do_menu_de_contexto
+tags:
+  - WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/user_interface/Context_menu_items
+---
+<div>{{AddonSidebar}}</div>
+
+<div>
+<p><span class="seoSummary">Esta opção da interface de usuário adiciona um ou mais itens para o menu de contexto do navegador.</span>Este é o menu de contexto disponível quando um usuário clica com o botão direito numa página web. As guias também podem ter menus de contexto, disponível através da API <a href="/en-US/Add-ons/WebExtensions/API/menus">browser.menus</a>.</p>
+
+<p><img alt="Example of content menu items added by a WebExtension, from the context-menu-demo example" src="https://mdn.mozillademos.org/files/15756/context_menu_example.png" style="display: block; height: 382px; margin-left: auto; margin-right: auto; width: 350px;"></p>
+
+<p>Você usaria essa opção para expor recursos relevantes para contextos específicos de navegadores ou páginas da web. Por exemplo, você poderia mostrar recursos para abrir um editor gráfico quando o usuário clica em uma imagem ou pode oferecer um recurso para salvar o conteúdo da página quando uma parte da página é selecionada. Você pode adicionar itens planos de menu, caixas de seleção, grupos de botões de rádio, e separadores para os menus. Quando um item de menu de contexto for adicionado usando {{WebExtAPIRef("contextMenus.create")}}, é mostrado em todas as guias do navegador, mas você pode escondê-lo usando {{WebExtAPIRef("contextMenus.remove")}}.</p>
+
+<p>A lista inteira dos contextos suportados está disponível em {{WebExtAPIRef("menus.ContextType")}} e inclui contextos de fora de uma página web, como itens de favoritos na interface do navegador. Por exemplo, a extensão "<a href="https://github.com/Rob--W/bookmark-container-tab">Open bookmark in Container Tab</a>" adiciona um item de menu que permite que o usuário abra a URL dos favoritos em uma nova guia de container:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16554/extension_context_menu.png" style="border: 1px solid black; display: block; height: 637px; margin: 0px auto; width: 505px;"></p>
+
+<h2 id="Especificando_itens_do_menu_de_contexto">Especificando itens do menu de contexto</h2>
+
+<p>Você controla os itens do menu de contexto programaticamente, usando a API {{WebExtAPIRef("contextMenus")}}. No entanto, você precisa requisitar a permissão <code>contextMenus</code> em seu manifest.json para poder tomar vantagem desta API.</p>
+
+<pre class="brush: json">"permissions": ["contextMenus"]</pre>
+
+<p>Você pode então adicionar (e atualizar ou apagar) os itens do menu de contexto em seu script de "background" (segundo plano) da sua extensão. Para criar um item de menu, você especifica um id, seu título, e os menus de contexto em que ele deve aparecer:</p>
+
+<pre class="brush: js">browser.contextMenus.create({
+  id: "log-selection",
+  title: browser.i18n.getMessage("contextMenuItemSelectionLogger"),
+  contexts: ["selection"]
+}, onCreated);</pre>
+
+<p>Sua extensão então escuta os cliques nos itens do menu. As informações passadas sobre o item clicado, o contexto em que o clique ocorreu e os detalhes da guia em que o clique ocorreu podem ser usadas para chamar a funcionalidade de extensão apropriada.</p>
+
+<pre class="brush: js">browser.contextMenus.onClicked.addListener(function(info, tab) {
+  switch (info.menuItemId) {
+    case "log-selection":
+      console.log(info.selectionText);
+      break;
+    ...
+  }
+})</pre>
+
+<h2 id="Ícones">Ícones</h2>
+
+<p>Para mais detalhes sobre como criar ícones para usar no seu menu de contexto, veja <a href="https://design.firefox.com/photon/visuals/iconography.html">Iconography</a> na documentação <a class="grey-90 no-underline hover-no-underline" href="https://design.firefox.com/photon/index.html">Photon Design System</a>.</p>
+
+<h2 id="Exemplos">Exemplos</h2>
+
+<p>O repositório <a class="external external-icon" href="https://github.com/mdn/webextensions-examples">webextensions-examples</a> no GitHub contém dois exemplos de extensões que implementam itens do menu de contexto:</p>
+
+<ul>
+ <li><a href="https://github.com/mdn/webextensions-examples/tree/master/menu-demo">menu-demo</a> adiciona muitos itens para o menu de contexto do navegador.</li>
+ <li><a href="https://github.com/mdn/webextensions-examples/tree/master/context-menu-copy-link-with-types">context-menu-copy-link-with-types</a> adiciona um item de menu de contexto aos links que copiam o URL do link para a área de transferência, como texto sem formatação e HTML avançado.</li>
+</ul>
+</div>
diff --git a/files/pt-br/mozilla/add-ons/webextensions/what_are_webextensions/index.html b/files/pt-br/mozilla/add-ons/webextensions/what_are_webextensions/index.html
new file mode 100644
index 0000000000..629cc94a9d
--- /dev/null
+++ b/files/pt-br/mozilla/add-ons/webextensions/what_are_webextensions/index.html
@@ -0,0 +1,22 @@
+---
+title: O que são extensões?
+slug: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Extensões são bits de código que modificam a funcionalidade do navegador. Eles são escritos usando as tecnologias padrões da Web - JavaScript, HTML e CSS - além de APIs JavaScript dedicadas. Entre outras coisas, extensões podem adicionar novas funcionalidades para o navegador, ou mudar sua aparência, ou o conteúdo de páginas particulares.</p>
+
+<p>Extensões para Firefox são construídas usando <em>WebExtensions APIs</em>, um sistema multi-navegador (<em>cross-browser</em>) para o desenvolvimento de extensões. Para uma maior portabilidade, a API é compatível com a <a class="external external-icon" href="https://developer.chrome.com/extensions"><em>extension API</em>,</a> suportada pelo Google Chrome e pelo Opera. Extensões escritas para esses navegadores, na maioria dos casos, vão rodar no Firefox ou Microsoft Edge <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Porting_from_Google_Chrome">com poucas mudanças</a>. A API é também totalmente compatível com o <em><a href="https://developer.mozilla.org/en-US/Firefox/Multiprocess_Firefox">multiprocess Firefox</a></em>.</p>
+
+<p>No passado, você poderia desenvolver extensões para Firefox usando um dos três <span class="gt-baf-word-clickable">métodos</span> diferentes: <em><a href="/en-US/Add-ons/Overlay_Extensions">XUL/XPCOM overlays</a>, <a href="/en-US/docs/Mozilla/Add-ons/Bootstrapped_extensions">bootstrapped extensions</a></em> ou o <em><a href="/en-US/docs/Mozilla/Add-ons/SDK">Add-on SDK</a></em>. A partir do fim de Novembro de 2017, <em>WebExtensions APIs</em> será o único meio de desenvolver extensões para Firefox, e os outros <span class="gt-baf-word-clickable">métodos</span> serão descontinuados.</p>
+
+<p>Se você tem dúvidas ou sugestões, ou precisa de ajuda para migrar um <em>add-on</em> antigo para o <em>WebExtensions APIs</em>, você pode entrar em contato conosco pela <a href="https://mail.mozilla.org/listinfo/dev-addons"><em>dev-addon mailing list</em> </a>ou pelo canal <em><a href="irc://irc.mozilla.org/extdev">#extdev</a></em> no <a class="external external-icon" href="https://wiki.mozilla.org/IRC">IRC</a>.</p>
+
+<h2 id="Próximos_passos">Próximos passos</h2>
+
+<ul>
+ <li>Para experimentar alguns exemplos de extensões, veja <a href="/en-US/Add-ons/WebExtensions/Examples">Exemplos de extensões</a></li>
+ <li>Para aprender sobre a estrutura de uma extensão, acesse <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">Anatomia de uma Extensão.</a></li>
+ <li>Para acompanhar <span class="gt-baf-word-clickable">do início ao fim</span> o desenvolvimento de uma simples extensão, veja <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension">Sua primeira Extensão.</a></li>
+</ul>