O que são extensões?

As extensões são programas de software pequenos que personalizam a experiência de navegação. Com elas, os usuários podem adaptar as funcionalidades e o comportamento do Chrome a necessidades e preferências individuais. Elas são criadas com tecnologias da Web, como HTML, JavaScript e CSS.

Uma extensão precisa atender a um único propósito, que seja bem definido e fácil de entender. Uma única extensão pode incluir vários componentes e uma variedade de funcionalidades, desde que tudo contribua para um propósito comum.

Captura de tela do ícone de uma extensão na barra do navegador

As interfaces do usuário precisam ser mínimas e ter uma intenção. Elas podem variar de um ícone simples, como a Google Mail Checker extension mostrada acima, até a substituição de uma página inteira.

Os arquivos de extensão são compactados em um único pacote .crx que o usuário faz o download e instala. Isso significa que as extensões não dependem de conteúdo da Web, ao contrário dos apps da Web comuns.

As extensões são distribuídas pelo Painel de controle do desenvolvedor do Chrome e publicadas na Chrome Web Store. Para mais informações, consulte a documentação para desenvolvedores do repositório.

Extensões Hello

Dê um pequeno passo nas extensões com este exemplo rápido de extensões Hello. Comece criando um novo diretório para armazenar os arquivos da extensão ou faça o download deles na página de exemplo.

Em seguida, adicione um arquivo chamado manifest.json e inclua o seguinte código:

{
  "name": "Hello Extensions",
  "description" : "Base Level Extension",
  "version": "1.0",
  "manifest_version": 2
}

Toda extensão requer um manifesto, embora a maioria delas não faça muito com apenas o manifesto. Para este início rápido, a extensão tem um arquivo pop-up e um ícone declarados no campo browser_action:

{
  "name": "Hello Extensions",
  "description" : "Base Level Extension",
  "version": "1.0",
  "manifest_version": 2,
  "browser_action": {
    "default_popup": "hello.html",
    "default_icon": "hello_extensions.png"
  }
}

Faça o download de hello_extensions.png aqui e crie um arquivo chamado hello.html:

<html>
  <body>
    <h1>Hello Extensions</h1>
  </body>
</html>

A extensão agora mostra hello.html quando o ícone é clicado. A próxima etapa é incluir um comando no manifest.json que ative um atalho de teclado. Esta etapa é divertida, mas não necessária:

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

A última etapa é instalar a extensão na sua máquina local.

  1. Navegue até chrome://extensions no navegador. Você também pode acessar essa página clicando no menu do Google Chrome no canto superior direito da omnibox, passando o cursor sobre Mais ferramentas e selecionando Extensões.
  2. Marque a caixa ao lado de Modo de desenvolvedor.
  3. Clique em Carregar extensão descompactada e selecione o diretório da extensão "Hello Extensions".

Parabéns! Agora você pode usar a extensão baseada em pop-up clicando no ícone hello_extensions.png ou pressionando Ctrl+Shift+F no teclado.

E agora?

  1. Siga o tutorial de introdução
  2. Leia a visão geral
  3. Mantenha-se atualizado lendo o blog do Chromium
  4. Inscreva-se no grupo chromium-extensions