Personaliza Firefox 57 con CSS

Custom CSS for Fx es una colección de estilos CSS para Firefox 57 y versiones posteriores del autor del popular complemento Firefox Classic Theme Restorer.

Firefox 57 ya no admitirá Classic Theme Restorer o cualquier otra interfaz que cambie extensiones o temas debido al cambio a un sistema exclusivo de WebExtensions. El nuevo sistema de WebExtensions evita cambios en la interfaz de usuario del navegador al no proporcionar API a los desarrolladores de extensiones.

La única opción que les queda a los usuarios de Firefox para modificar la interfaz de usuario, aparte de lo que Mozilla proporciona de forma nativa en Firefox, es usar CSS.

Los usuarios de Firefox que conocen bien CSS pueden editar archivos CSS manualmente para modificar su versión del navegador web. La mayoría de los usuarios de Firefox, por otro lado, probablemente no, y ahí es donde entra en juego CSS personalizado para Fx.

Personaliza Firefox 57 con CSS

El proyecto está alojado en GitHub, y lo mantiene Aris, conocido por los complementos populares de Firefox como Classic Theme Restorer y NoiaButtons. Classic Theme Restorer fue creado como respuesta a la interfaz Australis que Mozilla lanzó en Firefox 29. La extensión ya no funcionará en Firefox 57 o más reciente porque Mozilla dejó de admitir complementos heredados en esa versión de Firefox y no introdujo capacidades para modificar la interfaz de usuario como API de WebExtensions.

La página de inicio del proyecto ofrece información sobre cómo ubicar la carpeta de perfil del navegador web Firefox y usar los estilos proporcionados para modificar Firefox.

La forma más fácil de localizar la carpeta de perfil es cargando sobre: ​​soporte en la barra de direcciones del navegador y haciendo clic en el botón "abrir carpeta" en Conceptos básicos de la aplicación> Carpeta de perfil.

Debe crear una carpeta llamada Chrome si no existe en la raíz del directorio del perfil. Una vez hecho esto, copie el contenido del archivo en esa carpeta. Asegúrese de que userChrome.css y userContent.css estén ubicados en la raíz de la carpeta de Chrome.

Esto es todo lo que hay que hacer para agregar estos estilos personalizados a Firefox. Sin embargo, hay otro paso que puede tomar, y es personalizar los ajustes.

El conjunto predeterminado de ajustes puede atraer a algunos usuarios, pero los archivos CSS vienen con opciones para habilitar o deshabilitar diferentes ajustes para cambiar aún más la interfaz.

Abra el archivo userChrome.css en un editor de texto sin formato. El archivo utiliza el comando @import para importar los estilos CSS reales de los archivos CSS. Esto se hace para mantener ordenado el userChrome.css principal y facilitar a los usuarios de Firefox modificarlo.

Las líneas que comienzan con / * se comentan y los archivos CSS con los que se vinculan no se importan debido a eso.

Lo que debe hacer es revisar la sección de una lista a la vez para determinar cuáles de los ajustes disponibles le gustaría habilitar en Firefox.

Descargue los ajustes agregando / * delante de la línea y * / en la parte posterior. Del mismo modo, eliminas / * delante y * / detrás para habilitar un ajuste.

Aquí está la lista de ajustes que está disponible en este momento:

  • Modificar los botones de la barra de herramientas de navegación.
  • Habilitar botones cuadrados
  • Cambiar la apariencia del ícono
  • Cambiar la ventana emergente del botón de la aplicación.
  • Cambiar el menú de marcadores y la apariencia emergente.
  • Apariencia de botones de barra de herramientas de marcadores antiguos
  • Otras configuraciones de botones (botón de avance oculto, botones de retroceso y avance separados ventanas emergentes de historial, botones de zoom ocultar restablecimiento).
  • Apariencia personalizada de botones hacia atrás y hacia adelante
  • Botón de aplicación / hamburguesa en la barra de herramientas de navegación
  • Botón de aplicación / hamburguesa en la barra de título de Firefox (solo Windows)
  • Apariencia de las pestañas (estilo, posición de la barra de herramientas, por ejemplo debajo de las barras de herramientas (léase: pestañas no en la parte superior), títulos de pestañas, iconos y más.
  • Modifique la barra de búsqueda, los menús contextuales, los iconos y otras barras de herramientas.
  • Cambiar el estilo de la barra de ubicación.

Algunos de estos se explican por sí mismos. Otros no lo son, pero tiene dos opciones cuando se trata de estos. Habilítelos y revíselos directamente, o abra el archivo CSS que se carga para averiguar qué hacen. Sin embargo, esto último requiere cierto conocimiento de CSS.

El archivo userContent.css usa el mismo diseño. Importa archivos CSS, y depende de usted habilitarlos o deshabilitarlos.

El proyecto proporciona una lista de ajustes sugeridos de la interfaz nativa y acerca de los ajustes de configuración para modificar aún más la apariencia de Firefox.

Palabras de clausura

CSS personalizado para Fx ofrece muchas modificaciones de interfaz para la interfaz de Firefox 57 que no se pueden hacer con extensiones o con funciones integradas. Los usuarios existentes de Firefox pueden encontrarlo útil, especialmente si han usado Classic Theme Restorer o un complemento comparable hasta ahora.

Aris publica regularmente actualizaciones; eso es bueno no solo para la nueva funcionalidad que se puede introducir a través de ajustes, sino también para mantener los estilos compatibles con las nuevas versiones de Firefox.