, , ,

Cambiar el color de la barra del navegador al ver tu web en el móvil

Vamos a hablar de: Cambiar el color de la barra del navegador al ver tu web en el móvil

Cambiar el color de la barra del navegador al ver tu web en el móvil

Este truco, que no es nuevo, nos sirve para dar más valor aún a nuestros colores corporativos. Es muy habitual acudir a páginas como Marca.com y ver que en la versión móvil nos pintan la barra del navegador de color rojo. Su color corporativo.

Y nosotros también lo aplicamos en nuestra página web. Queremos que Livire sea única y diferente a otros. Queremos que nos reconozcáis desde lejos. Y si para ello tenemos que pintar el navegador en la versión móvil de la web… lo haremos. Lo hemos hecho.

¿Cómo podemos cambiar el color de la barra del navegador al ver tu web en el móvil?

versión móvil de livire

Es muy sencillo. Debemos buscar las etiquetas <head> y </head>. En el caso de WordPress estas están en el archivo header.php. Para acceder a este archivo podéis ir desde APARIENCIA / EDITAR en vuestro menú lateral. Otra forma, para evitar tocar el código del theme es instalando algún plugin que nos permita modificar el header. Por ejemplo: Head, Footer and Post Injections

Dentro de estas etiquetas, entre todo el código que hay añadir lo siguiente:

<meta name="theme-color" content="#feea0e" />

 

Este código: #feea0e representa el amarillo verde de livire. Debéis sustituirlo por el vuestro.

¿Y con esto hemos cambiado el color de la barra del navegador al ver tu web en el móvil?

Sí,  un ejemplo es esta misma web. Podéis comprobarlo en cualquier momento accediendo desde un móvil. Como veis es muy sencillo, es rápido y realmente queda muy chulo en nuestra web.

¿Qué más puedes encontrar en este blog?

Diseño Web

Artículos que hablan sobre el diseño y desarrollo web.

Wordpress

Opciones, configuraciones, plugins... un montón de recursos.

Herramientas

Artículos sobre herramientas de que utilizamos para las webs.

SEO

¿Hablamos un poquito de SEO? Unas pinceladas estarán bien...

¿Necesitas ayuda profesional?

× ¿Hablamos?