Por lo que he visto se puede subir una extensión de navegador la misma base de código para distintos navegadores Chrome, Firefox, Opera y Microsoft Edge, a continuación me gustaría facilitar algunos enlaces para quién esté empezando y comentar alguna diferencias entre navegadores.
Documentación
Centro de desarrolladores
Tiempo de revisión
- Chrome: 5 días
- Firefox: 1 día
- Microsoft Edge: 3 días
- Opera: (por determinar)
Cargar extensión en local para testear
- Chrome: Entra en el menú de 3 puntos – Más herramientas – Extensiones – Cargar descomprimida.
- Firefox: Ejecuta esto en la barra de direcciones «about:debugging», luego entra en Este Firefox – Cargar complemento temporal, para que el zip funcione tienes que seleccionar los ficheros de la extensión y comprimir, no comprimir la carpeta que los contiene o no funcionará.
- Microsoft Edge: Ejecuta esto en la barra de direcciones «about:flags», activa la opción «Habilitar características de desarrollador de extensiones», entra el menú de 3 puntos – Extensiones, Abajo del todo te aparecerá un botón «Cargar extensión».
- Opera: Pulsa la tecla Alt para ver el menú de la aplicación, entra en Extensiones – Extensiones – Cargar descomprimida.
manifest.json
Chrome y Firefox pueden compartir el mismo fichero manifest.json de la extensión, pero para otros navegadores hay que indicar unos campos adicionales.
Opera
- Tienes que indicar: «default_locale»: «es» (esto es para que en la descripción de la tienda te salga el idioma español, si no lo indicas por defecto será en inglés)
- Tienes que indicar en permissions: «activeTab»
Microsoft Edge
- Dentro de background tienes que indicar: «persistent»: false
- Dentro de browser_action tienes que indicar: «default_icon»: {«20»: «icon20.png», «40»: «icon40.png»}
Carpetas
Chrome
- Si defines default_locale en manifest.json tienes que crear un fichero en la raíz de la extensión:
_locales/es/messages.json
Imagenes de la tienda
Opera
- El icono tiene que tener un tamaño de 64 x 64 píxeles
- La captura de pantalla tiene que tener un tamaño de 640 x 400 píxeles
Chrome
- El icono tiene que tener un tamaño de 128 x 128 píxeles (lo recoge automáticamente del manifest.json)
- La captura de pantalla tiene que tener un tamaño de 640 x 400 o 1280 x 800 píxeles
Microsoft Edge
- El icono tiene que tener un tamaño de 128 x 128 píxeles
- La captura de pantalla tiene que tener un tamaño de 640 x 400 o 1280 x 800 píxeles
Firefox
- El icono tiene que tener un tamaño de 128 x 128 píxeles
- La captura de pantalla tiene que tener un tamaño de 640 x 400, hasta un máximo de 2400 x 1800 píxeles
browserAction
Las aplicaciones suelen añadir un botón en la barra de dirección del navegador que al pinchar en este podemos mandar el usuario a una web, la única diferencia que he visto aquí es que el objeto al que le asignamos la acción en Microsoft Edge es browser y en el resto de navegadores chrome.
var obj_browser = ( navigator.userAgent.search(‘Edge’) > -1 ) ? browser : chrome;
var url_open = ‘https://dominio.com’;
obj_browser.browserAction.onClicked.addListener(function() {
obj_browser.tabs.create({‘url’: url_open});
});
Cosas que recomiendo tener a la hora de subir tu extensión en las distintas tiendas
- Título de la extensión
- Descripción de la extensión
- Iconos en distintos tamaños que he comentado arriba
- Captura de pantalla
- Explicación paso a paso de como funciona la extensión en inglés
- URL a tu web
- URL a la página de Política de Privacidad de la web de tu extensión
- URL a un vídeo a youtube (si lo tienes)
Política de privacidad
Si no tienes ninguna página puedes usar este generador de política de privacidad o con la misma instalación de WordPress en español te crea automáticamente una en borrador.
- Chrome: Es un poco raro la política de privacidad se tiene que indicar a nivel de cuenta no dentro de la extensión en el panel de control de Chrome Web Store – Cuenta – Política de privacidad.
- Firefox: Edita tu extensión en el centro de desarrolladores – Administrar autores y licencia – Política de privacidad.
- Microsoft Edge: Edita tu extensión en el Centro de partners de Microsoft – Propiedades – URL de la directiva de privacidad.
- Opera: Edita tu extensión en el panel de Opera Addons – Versions – Selecciona la versión – Privacy policy URL.
¿Y como crear extensiones para el navegador Safari de Apple?
Aquí ya no he entrado ya que por lo que he visto hace falta una licencia activa y usar xcode por lo que te obliga a tener un mac.