Colocar un icono en tu web – Favicon

Published:

 1) Primero creamos una imagen, que se identifique con el diseño corporativo de nuestra página, con cualquier herramienta de edición gráfica (Photoshop, Gimp…) con el fondo transparente (mejor en .gif que conserva las capas), le damos el tamaño de 16×16 píxeles, lo guardamos en formato .ico.

favicon

Nómbrale favicon.ico (En realidad vale cualquier nombre siempre que esté en el formato .ico).

En alguna de estas webs podes generar tu favicon online que te transforman cualquier imagen en un archivo listo para ser usado.

http://www.chami.com/html-kit/services/favicon/

http://tools.dynamicdrive.com/favicon/

http://www.generatefavicon.com/

2) Una vez generado sube mediante ftp el archivo favicon.ico al directorio raíz de tu web.

Entre las etiquetas <HEAD> y </HEAD> de la página principal o de tu plantilla, copia las siguientes líneas de código:

<link rel=”icon” href=”http://www.tudominio.com/favicon.ico” type=”image/x-icon”>

<link rel=”shortcut icon” href=”http://www.tudominio.com/favicon.ico” type=”image/x-icon”>

3) Para hacerlo en wordpress solo hay que modificar el archivo header.php de tu tema, y entre los tags <HEAD> y </HEAD> agregas las líneas:

<link rel=”shortcut icon” href=”La url de tu icono”>

4) Limpia el cache de tu navegador y mira como quedo.

Saludos

- Advertisement -
Jorge
Jorgehttps://nksistemas.com
Soy Jorge, Sr Sysadmin Linux/DevOps/SRE y creador de NKSistemas.com Trabajo con plataformas: Linux, Windows, AWS, GCP, VMware, Helm, kubernetes, Docker, etc.

Related articles