Empacar un tema para Chrome/Chromium [.crx]

Básicamente un tema para Chrome/Chromium es un zip. He leído maneras de crear un tema .crx y muchos dicen que se crea el tema en un directorio y luego se empaca como .zip, después se renombra y ya. Pero no es la manera correcta de empacarlo, porque los headers de un archivo .zip son muy diferentes a los de un .crx, plus que un .crx lleva una llave RSA que es inexistente y no declarada en un .zip.

Primeramente necesitaremos crear el tema. En mi caso, y es el ejemplo que tomaremos en adelante, necesitaba un tema que me igualara el color de mis bordes de ventana (Hope), así que usé este tema de Chromium como base. A continuación lo renombré como .zip y lo descomprimí en el directorio mod/. Lo que vamos a tener ahí es un directorio images/ y un archivo manifest.json. Mi meta era igualar los colores de mis bordes de ventana, para eso podemos usar Gimp o cualquier otro editor de imágenes. Cambié los colores, guardé y ya sólo me quedó editar el contenido de manifest.json con el nombre de mi nuevo tema y los colores que necesito tenga.


{
 "version": "1.0",
 "name": "mod",
 "theme": {
 "images" : {
 "theme_frame": "images/theme_frame.png",
 "theme_frame_inactive": "images/theme_frame_inactive.png",
 "theme_frame_incognito": "images/theme_frame_incognito.png",
 "theme_frame_incognito_inactive": "images/theme_frame_incognito_inactive.png",
 "theme_toolbar": "images/theme_toolbar.png"
 },
 "colors" : {
 "frame" : [60, 60, 60],
 "frame_inactive" : [60, 60, 60],
 "frame_incognito" : [60, 60, 60],
 "frame_incognito_inactive" : [60, 60, 60],
 "toolbar" : [216, 216, 216],
 "tab_text" : [0, 0, 0],
 "tab_background_text" : [60, 60, 60],
 "bookmark_text" : [60, 60, 60],
 "ntp_background" : [232, 232, 232],
 "ntp_text" : [60, 60, 60],
 "ntp_link" : [60, 60, 60],
 "ntp_link_underline" : [232, 232, 232],
 "ntp_header" : [60, 60, 60],
 "ntp_section" : [186, 186, 186],
 "ntp_section_text" : [60, 60, 60],
 "ntp_section_link" : [60, 60, 60],
 "ntp_section_link_underline" : [232, 232, 232],
 "control_background" : [232, 232, 232],
 "button_background" : [0, 0, 0]
 },

Listo para ser empacado.

Tenemos entonces dos elementos en el directorio mod/, a saber: mod/imagesmod/manifest.json. Abrimos Chrome y en el menú de la llave inglesa nos vamos hasta Tools (Herramientas)>> Extensions (Extensiones), hacemos check en la opción “Developer mode” (Modo Desarrollo) y ahí tenemos ya la opción para empacar el tema. Navegamos hasta el directorio mod/ y empacamos. Tendremos un par de archivos: mod.crx y mod.pem. Listo.

Y pues quedé contento con el tema porque iguala bastante mi tema de bordes de ventana de gtk3.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s