Crear extensiones en Google Chrome o Chromium no es una tarea muy complicada. A continuación os mostraré paso a paso como crear una extensión sencilla.
Lo primero será crear la carpeta donde guardaremos todos los ficheros que necesitaremos (imágenes, javascripts, HTML, CSS...)
Dentro de esta carpeta crearemos un fichero llamado "manifest.json" que contendrá la información principal de la extensión. Nombre de la extensión, número de versión, descripción y la acción a realizar. En el ejemplo:
{
"name": "Hola Mundo",
"version": "1.0",
"description": "Mi primera extension",
"browser_action":
{
"default_icon": "ubuntu.jpeg",
"popup":"popup.htm"
}
}En la acción a realizar, he puesto las opciones "default_icon" y "popup", contienen el nombre del icono que se usará para la extensión y el nombre de la página html, que se ejecutará cuando hagas click sobre el icono de la extensión.
Como puedes observar en el contenido del fichero "manifest.json", en la carpeta donde esta dicho fichero he añadido los ficheros "ubuntu.png" y "popup.htm". El codigo del fichero "popup.htm" es el siguiente, aquí es donde podrías poner tú código:
<html>
<body>
<b>Hola Mundo!</b>
</body>
</html>
Ahora sólo nos queda añadir nuestra extensión a Chromium/Chrome. Para ello debes ir a la apartado de herramienas del menu y seleccionar "Extensions". Se abrirá una nueva pestaña en la que deberás pulsar "Developer mode" para desplegar 3 nuevos botones:
- "Load unpacked extension...": cargar extension desempaquetada.
- "Pack extension...": empaquetar extensión.
- "Update extensions now": actualizar lista de extensiones.
Ya esta creada la extensión. En la barra superior de Chromium/Chrome aparecerá el icono nuevo y al hacer click sobre él se ejecutará el código asociado.
Si la extensión ha funcionado correctamente podemos compilar a un fichero en formato .crx, para ello deberás usar la opción "Pack extensión...", te pedirá la ruta de la carpeta y creará el fichero crx para instalar tú extensión en otro PC.
Basado en "Tutorial: Getting Started (Hello, World!)"
No hay comentarios:
Publicar un comentario
Nota: solo los miembros de este blog pueden publicar comentarios.