Cómo modificar el aspecto de una web en Google Chrome con Local Overrides

Escrito por Javier Jiménez

En muchas ocasiones navegamos diariamente por una serie de páginas determinadas. Esas webs están diseñadas de una manera fija y poco podemos hacer para cambiarlo. Sin embargo puede ocurrir que nos interese cambiarle el color, la fuente o cualquier otra cosa. Todo para hacer que nuestra visita a esa página tan frecuentemente sea más cómoda. Hoy hablamos de Local Overrides, una herramienta que tenemos para Google Chrome y que permite modificar, en cierta medida, una página web.

Local Overrides

Local Overrides es una función experimental relativamente nueva de Developer Tools. Está disponible para el navegador web Google Chrome. La podemos utilizar para realizar cambios permanentes en las páginas web de forma similar a como lo haríamos con los archivos usercripts o userstyles.

La mayoría de los usuarios pueden no querer o no necesitar cambiar el aspecto de una web. Sin embargo puede ocurrir que, debido a que entramos muy frecuentemente, nos sea de utilidad. Algunos usuarios desean hacerlo para eliminar molestias, mejorar la usabilidad o hacer otras modificaciones.

Esto puede ocurrir en diversas situaciones. Un buen ejemplo es un sitio que sea demasiado brillante a los ojos del usuario. Con Local Overrides podemos cambiar el estilo del sitio web a uno más oscuro para que sea más agradable a los ojos. También podemos usarlo para aumentar o disminuir el tamaño de las fuentes, cambiar el tipo de letra, eliminar imágenes de fondo o manipular cualquier otro elemento en la página.

En definitiva puede adaptarse a lo que los usuarios necesiten. Todo con el objetivo de que la navegación por esa página pueda resultar más cómoda.

Como hemos mencionado, Local Overrides es una función experimental de Google Chrome. Está disponible en todas las versiones compatibles del navegador.

Habilitarlo en Google Chrome

Para habilitarlo tenemos que hacer lo siguiente:

  1. Cargar chrome: // flags / # enable-devtools-experiments en la barra de direcciones del navegador y cambie el indicador a habilitado. Esto permite experimentos de Developer Tools.
  2. Reiniciar el navegador web.
  3. Pulsar F12 para abrir la interfaz de Herramientas de desarrollador.
  4. Pulsar F1 en la interfaz para abrir las Preferencias.
  5. Cambiar a la pestaña Experimentos y marcar “Modificar solicitudes con proyecto de espacio de trabajo”.
  6. Visitar una página web en la que queramos realizar cambios permanentes.
  7. Cambiar al panel de Fuentes en las Herramientas de desarrollador.
  8. Hacer clic en el icono con las dos flechas que apuntan hacia la izquierda y seleccionar Overrides (Modificaciones) en el menú.
  9. Seleccionar “Configuraciones de modificaciones” y elegir una carpeta local en la que queramos almacenar estos cambios.
  10. Aceptamos la solicitud de Chrome para acceder a la carpeta.

Usar Overrides es sencillo. Abrimos el panel de red en el navegador para comenzar. Si no vemos ningún archivo cargado, volvemos a cargar la página para completar la lista.

Hacemos clic con el botón derecho en cualquier archivo de recursos que queramos sobrescribir y seleccionamos la opción “Guardar como modificación”. Chrome guarda los datos en el sistema local y los usará en lugar del recurso original cuando carguemos la página web.

Podemos editar el archivo y luego ir a Fuentes> Modificaciones. Esto funciona bien para los estilos, pero podemos modificar prácticamente cualquier archivo fuente, incluidas las páginas HTML y los archivos JavaScript.

Las modificaciones se guardan automáticamente. Podemos eliminarlas de la lista de reemplazos en las Herramientas de desarrollo de Chrome o usar las preferencias en su lugar.

 

Fuente > Ghacks