¿Qué son las extensiones?

Las extensiones son pequeños programas de software que personalizan la experiencia de navegación. Permiten a los usuarios adaptar la funcionalidad y el comportamiento de Chrome a las necesidades o preferencias individuales. Se basan en tecnologías web, como HTML, JavaScript y CSS.

Las extensiones deben cumplir con un solo propósito que esté definido de forma concreta y sea fácil de comprender. Una sola extensión puede incluir varios componentes y una variedad de funciones, siempre y cuando todo contribuya a un propósito común.

Captura de pantalla del ícono de una extensión en la barra del navegador

Las interfaces de usuario deben ser mínimas y tener una intención. Pueden variar desde un ícono simple, como la extensión Google Mail Checker que se muestra arriba, hasta anular una página completa.

Los archivos de extensión se comprimen en un solo paquete .crx que el usuario descarga e instala. Esto significa que las extensiones no dependen del contenido de la Web, a diferencia de las apps web comunes.

Las extensiones se distribuyen a través del Panel del desarrollador de Chrome y se publican en Chrome Web Store. Para obtener más información, consulta la documentación para desarrolladores de Play Store.

Extensiones de Hello

Da un pequeño paso hacia las extensiones con este ejemplo rápido de Hello Extensions. Comienza por crear un directorio nuevo para almacenar los archivos de la extensión o descárgalos desde la página de ejemplo.

A continuación, agrega un archivo llamado manifest.json y, luego, incluye el siguiente código:

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

Todas las extensiones requieren un manifiesto, aunque la mayoría de las extensiones no harán mucho solo con el manifiesto. Para esta guía de inicio rápido, la extensión tiene un archivo emergente y un ícono declarados en el 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"
  }
}

Descarga hello_extensions.png aquí y, luego, crea un archivo llamado hello.html:

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

Ahora, la extensión muestra hello.html cuando se hace clic en el ícono. El siguiente paso es incluir un comando en manifest.json que habilite una combinación de teclas. Este paso es divertido, pero no necesario:

{
  "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"
    }
  }
}

El último paso es instalar la extensión en tu máquina local.

  1. En tu navegador, ve a chrome://extensions. También puedes acceder a esta página haciendo clic en el menú de Chrome, que se encuentra en el lado superior derecho del cuadro multifunción, colocando el cursor sobre Más herramientas y seleccionando Extensiones.
  2. Marca la casilla junto a Modo de desarrollador.
  3. Haz clic en Cargar extensión sin empaquetar y selecciona el directorio de tu extensión "Hello Extensions".

¡Felicitaciones! Ahora puedes usar tu extensión basada en ventanas emergentes haciendo clic en el ícono hello_extensions.png o presionando Ctrl+Shift+F en el teclado.

¿Qué hacer a continuación?

  1. Sigue el instructivo para comenzar
  2. Lee la Descripción general
  3. Mantente al día leyendo el blog de Chromium
  4. Suscríbete al grupo chromium-extensions