Favicon en WordPress como subirlo o cambiarlo

Al agregar un favicon en WordPress es importante saber que el favicon es un pequeño icono utilizado por los navegadores. Por medio del favicon los usuarios pueden identificar fácilmente las pestañas que tienen abiertas.

WordPress cuenta con diferentes métodos para agregar un favicon en nuestro sitio web y aquí vamos a conocer cuales son.

Recomendaciones antes de subir un favicon

Antes de subir nuestro favicon a WordPress hay que tener en cuenta que el mismo se va a mostrar en las pestañas de los navegadores, lo que quiere decir que pueden existir navegadores con las pestañas claras o las pestañas oscuras como por ejemplo se muestra en la siguiente imagen:

favicon fondo claro y oscuro en wordpress para diferentes navegadores
Capturas del navegador Opera y Firefox

Como podemos apreciar, es importante arreglar la imagen que se utilizará de favicon para que nuestros usuarios no se lleven una mala impresión.

Los fondos claros y oscuros pueden hacer que nuestro logo no se vea por lo que tendremos que tener mucho cuidado.

El formato de imagen que se utiliza en WordPress normalmente como favicon es el formato PNG aunque en realidad el navegador recibe un archivo de formato ICO.

Otra recomendación y también muy importante, la imagen a utilizar como favicon debe ser cuadrada. Un tamaño recomendable para utilizar sería una imagen de 512 píxeles por 512 píxeles.

Lo más común es que utilicemos el logo de nuestro sitio como favicon.

Poner favicon en WordPress desde personalizar

Por defecto podemos subir el icono desde el administrador en el personalizador de WordPress y estos son los pasos:

Personalizar en el escritorio de WordPress
  1. Ir al escritorio
  2. Seleccionar Apariencia
  3. Clic en Personalizar, aquí nos redirigirá a un apartado diferente del escritorio
  4. Luego clic en Identidad del sitio
  5. Haz clic en seleccionar el icono del sitio
  6. Sube la imagen

En el paso 6 una vez subas la imagen aparecerá la opción de recortar la imagen.

Si seguiste nuestras recomendaciones tendrías una imagen cuadrada y simplemente podrías darle en omitir el recorte.

Si tu imagen no es cuadrada podrás utilizar la herramienta de recorte de WordPress para adaptarla.

El resultado que deberíamos obtener sería como en la siguiente imagen:

resultado subir imagen personalización

Para finalizar y guardar los cambios debemos hacer clic en publicar.

Cambiar favicon en WordPress

Para cambiar el favicon de WordPress tendremos que ir del paso 1 al paso 4 damos clic en Eliminar para dejar sin favicon el sitio o en Cambiar la imagen para cambiarlo.

Subir favicon con un plugins

Algunas veces utilizamos temas o configuraciones que no nos permiten subir un favicon desde el administrador de WordPress o simplemente queremos más funciones, es por ello que podemos hacer uso de plugins.

Uno de los plugins más utilizados para subir el favicon en WordPress es Favicon by RealFaviconGenerator y aquí aprenderemos a utilizarlo

  1. Vamos al administrador de WordPress
  2. Seleccionamos Plugins
  3. Damos clic en añadir nuevo
  4. Buscamos favicon
  5. Ubicamos Favicon by RealFaviconGenerator
  6. Clic en instalar ahora
  7. Click en activar

Una vez instalado el plugins nos aparecerá una nueva opción en Apariencia de WordPress

Nueva opción favicon con plugin

Para subir y generar nuestro favicon debemos ir a la nueva opción de Favicon que sale en apariencia, donde dice Seleccionar de la biblioteca de medio hacemos clic. Si ya tenemos la imagen en la biblioteca de medios la ubicamos y le damos en seleccionar, si no la tenemos damos clic en Subir archivos.

Luego de los pasos anteriores ya podemos hacer clic en Generar favicon y nos enviará a la web del plugin donde tendremos muchas opciones para ajustar.

Al seguir nuestras sugerencias van a tener una imagen de 512 píxeles por 512 píxeles, por lo que no dará advertencias a la página del plugin. 

Si tienen una imagen más pequeña de lo recomendado o que no sea cuadrada les saldrá una advertencia.

Favicon by RealFaviconGenerator

Una vez configuramos el favicon a nuestro gusto podemos hacer clic en Generate your Favicons and HTML code.

Esto nos redirigirá a nuestro WordPress y todo quedaría listo con un resultado como el siguiente:

Resultado subir favicon con plugin

Es muy importante que si utilizamos esta opción no podremos desactivar este plugin ya que se perdería nuestro favicon.

El plugin también nos ofrece una opción para comprobar el favicon que es muy útil para asegurarnos que todo está bien.

Agregar favicon con el archivo .ico

Si eres de las personas que les gusta hacer las cosas diferentes, que el tema no les da la opción, que no quieren instalar más plugins o que quieren irse por lo seguro este es para ti.

Aunque cabe aclarar que para esto necesitas unos conocimientos un poco más avanzados.

Para utilizar esta forma debemos crear nuestro archivo en formato ico y para esto hacemos lo siguiente:

  1. Ir a la web Convertir PNG a ICO (Online y Gratis) — Convertio
  2. Ubicamos nuestro icono PNG en el ordenador
  3. Arrastramos o subimos la imagen
  4. Haz clic en convertir
Convertir PNG a ICO online gratis

Una vez tengamos nuestro archivo ICO en el ordenador tenemos que asegurarnos que tenga de nombre favicon.ico

Debería verse algo así:

favicon ico

Una vez tenemos nuestro archivo favicon.ico debemos subirlo a la raíz de WordPress.

Para subirlo a la raíz de WordPress se puede hacer uso de FTP, Desde el administrador de archivos de nuestro hosting o algún plugin para administrar los archivos de WordPress.

Una vez encontremos la raíz de nuestro WordPress subimos el archivo ico y debería quedar así:

Favicon por FTP

Es muy importante resaltar que si el archivo no se llama favicon.ico no va a funcionar, esto se debe a que los navegadores siempre buscan el favicon en esta ruta:

dominioejemplo.com/favicon.ico

Con esto sería todo pero no olvides que siempre que trabajes con imágenes en WordPress podrás utilizar nuestro plugin estrella Femora Compress para optimizarlas.

Leave a Comment