Cómo crear y agregar un favicon a WordPress – Guia completa

La identidad visual de un sitio se puede definir de muchas maneras, los colores que se usan, las tipografías e incluso el tipo de imágenes que se usan en la misma. Un punto muchas veces olvidado por los creadores de páginas web es el favicon. En esta guía paso a paso, te enseñaremos cómo crear y agregar un favicon a WordPress de la manera más sencilla y sin el uso de plugins.

¿Qué es un favicon?

Un favicon es la una pequeña imagen ubicada en la pestaña del navegador justo al lado izquierdo del título del sitio. Se usa para identificar de forma rápida y visual la pestaña de navegación de una página web o a diferenciarla en la barra de marcadores. Si eres como yo y acostumbras a tener muchas ventanas abiertas en el navegador, te habrás dado cuenta ya de la importancia de tener un favicon.

Vale la pena aclarar que, debido a las dimensiones de los favicon, es mejor usar imágenes con pocos colores que se puedan leer bien a tamaños muy pequeños. Si usas imágenes muy complejas o con muchos colores, probablemente perderás legibilidad y tus usuarios no lo lograrán reconocer con facilidad.



¿Cómo crear un favicon?

La creación de un ícono favicon suele ser una tarea muy sencilla, se suele usar como favicon el logo símbolo de las marcas como por ejemplo el chulo de Nike o la letra M de Mc Donalds, por la misma razón de conservar la identidad de marca y la recordación.

Para crear un favicon procura tener una imagen de base cuadrada, las medidas recomendadas son de mínimo 512px X 512px, si quieres usar un fondo transparente procura usar una imagen con formato PNG.

Ingresa al administrador de WordPress y haz clic en Apariencia > Personalizar. Entrarás al personalizador de WordPress, desde allí haz clic en el menú Identidad del sitio.

pestaña identidad del sitio


Verás una nueva sección en la que podrás cambiar el nombre del sitio y su descripción corta, debajo de estas opciones encontrarás la opción para cambiar el ícono del sitio.

cambiar el ícono del sitio


Haz clic en el botón “Seleccionar ícono del sitio” y seguido se abrirá la galería de medios de WordPress en la que podrás subir tu propio ícono o elegir una imagen ya subida en la galería. Recuerda que las dimensiones de imagen sugeridas son: 512 por 512 píxeles.

seleccionando un icono del sitio


Una vez selecciones tu imagen, haz clic en el botón “Elegir” ubicado en la parte inferior derecha de la galería de medios de WordPress. Se abrirá una nueva ventana para recortar la imagen, si la subiste de 512px X 512px no habrá necesidad de recortarla, en caso de haberla subido de otra dimensión la recomendación sería recortarla para encajar en un cuadrado perfecto. Presiona el botón “No recortar” o “Recortar imagen” según sea el caso.

Esta ventana incluso te dará una previsualización de cómo se verá tu favicon en la pestaña del navegador.

recortar favicon


Ya deberías tener un favicon asignado a tu página web, ahora solo resta publicar los cambios para hacerlos visibles a los usuarios. Presiona el botón “Publicar” y revisa tu página web para asegurarte de que funciona correctamente.

publicar cambios


Insertar Favicon en WordPress con código

Algunas veces resulta útil saber agregar un favicon a una plantilla o tema personalizado para WordPress, si este es tu caso deberás primero generar el favicon con extensión .ico

Generar un favicon .ico

Lo primero que deberás tener es la imagen en formato cuadrado, incluso puedes usar las mismas dimensiones sugeridas por WordPress (512px X 512px), aquí lo importante es que sea cuadrada. Dirígete al sitio web https://www.favicon-generator.org/ y carga tu imagen haciendo clic en el recuadro “Choose file”, cargala desde tu computador y asegúrate de desmarcar la opción “Include your favicon.ico in the public gallery” esto para evitar que nuestro favicon quede guardado en la galería de esta página web.



Una vez seleccionada la imagen, haz clic en el botón “Create favicon”, espera unos segundos a que la imagen se cargue y se procese.

Haz clic en el enlace “Download the generated favicon”, se descargará un archivo zip que contendrá multiples versiones del favicon para difrerentes dispositivos, abre el archivo zip y busca el archivo favicon.ico.

descargar el zip con los favicon




Copia el archivo y pégalo en la carpeta de imágenes de tu tema. Ahora abre el archivo header.php de tu tema t pega la siguiente etiqueta meta que hace referencia al favicon:

<link rel=”shortcut icon” type=”image/x-icon” href=”url del favicon”/>

Guarda tu archivo y verifica que tu favicon carga sin problema. Podrás agregar las otras versiones del ícono si así lo deseas.

Conclusión

Como ves, agregar un favicon o ícono personalizado a tu web es una tarea muy sencilla que no requiere de ningún plugin y la puedes hacer tú mismo con la interfaz de WordPress. Queremos que compartas con nosotros qué te ha parecido este post, ¿has tenido algún problema? Escríbenos en la caja de comentarios y no olvides compartir.

The post appeared first on Tutopress.

Fuente: este post proviene de Tutopress, donde puedes consultar el contenido original.
¿Vulnera este post tus derechos? Pincha aquí.
Creado:
¿Qué te ha parecido esta idea?

Esta idea proviene de:

Y estas son sus últimas ideas publicadas:

Con la masificación de internet y su vasto uso en dispositivos móviles, comenzamos a usar diferentes herramientas para comunicarnos, incluyendo redes sociales, aplicaciones de mensajería, buscadores, ...

Etiquetas: Blog

Recomendamos

Relacionado

Blog home Wordpress ...

Si estás interesado en WordPress es porque has decidido dar el gran paso y montar tu propio negocio digital, tu blog, una web o simplemente, un espacio virtual a través de una landing page en el que mostrar tu trabajo. Por ello, queremos premiaros ofreciéndonos una guía básica y rápida con todo lo que debes saber sobre cómo crear un blog en WordPress, pasando por qué es WordPress y terminando con ...

Diseño web wordpress

Migrar wordpress de local a remoto Si estás leyendo este artículo es porque habrás instalado WordPress en tu servidor local, habrás construido tu web y ahora quieres tenerla online. Veamos los pasos necesarios para que la misma instalación en local, la puedas tener exactamente funcionando en tu propio servidor. 1. Aclaración inicial. Si aún no has hecho la instalación de WordPress en local, no pas ...

Blog Google Analytics Tag Manager ...

Si tienes un sitio web creado con WordPress, es importante que tengas instalado Google Analytics 4 para poder medir y analizar el tráfico del mismo. En este artículo, te explicaremos cómo configurar Google Analytics 4 en tu sitio web WordPress para que puedas obtener información valiosa sobre tus visitantes. ¿Qué es Google Analytics 4 y para qué sirve? Google Analytics 4 es una herramienta de anál ...

design diseño wordpress

¿Tu escritorio está un poco apagado últimamente? Si es así, o si simplemente quieres darle un poquito de amor a WordPress, tenemos el remedio perfecto: 30 fondos de escritorio de WordPress únicos para darle nueva vida a tus fondos. Los fondos de pantalla Cómo descargarlos Para poner un fondo de pantalla en tu escritorio: Haz clic en cualquier imagen para abrir el ca ...

Ayuda WordPress Temas WordPress WordPress ...

Actualizar Temas de WordPress Tal vez ya te has enfrentado alguna vez a ello, actualizar temas de WordPress, cada vez que recibes el aviso de que hay una actualización disponible. Actualizar tu tema de WordPress es muy importante para el mantenimiento y seguridad de tu página web. No es lo mismo actualizar temas de WordPress que actualizar WordPress en sí. WordPress es el software o marco de tra ...

general hacer una web web coaching ...

Bienvenid@ a un nuevo post de Coach2Coach. El único servicio de Coaching de posicionamiento y marketing online en España. WordPress Tutorial: Cómo Hacer tu Blog con WordPress en Menos de Tres Horas Este WordPress Tutorial forma parte del tutorial SEO que he creado para que empieces con buen pie tu negocio online. Sin embargo, he querido separarlo por motivos técnicos simplemente. Creo que un WordP ...

Wordpress

Los mejores plugins de seguridad para WordPress Posiblemente uno de los fallos más problemáticos del CMS WordPress sea su vulnerabilidad. Sí lo comparamos con PrestaShop o Magento parte en clara desventaja, pero por suerte existen varios plugins de seguridad para WordPress que harán de tu página web un lugar más seguro. Las brechas de seguridad en WordPress suelen provenir de los plugins y de las ...

WordPress: Nivel A2

Finalizando el mes WordPress te traigo este artículo para hablar de todos los plugins que necesitas en tu WordPress, ya sea un foro o una tienda online o simplemente un blog. Algunos de los plugins que menciono son de pago mientras que otros son totalmente gratuitos, aunque claramente también cuentan con su versión de pago. Algunos son simplemente para cubrir temas legales mientras que otros son p ...

blog top seo

Search Console WordPress. En este artículo te he preparado una super guia para que integres y empieces a usar desde cero esta poderosa herramienta de Google con el gestor de contenidos más usado de mundo. ¿Listo? ¿Por qué usar la Consola de búsqueda? Primero déjame aclarar esto, la consola de búsqueda (Search Console) es una herramienta creada por Google para medir el rendimiento de cualquier siti ...

Ayuda WordPress cosas de wordpress soluciones wordpress

Bienvenid@ a un nuevo post de Coach2Coach. Usuarios WordPress: Cómo añadir perfiles, usuarios y roles Usuarios WordPress: A menos que seas el único usuario de tu web, seguramente en algún momento tendrás que añadir usuarios con distintos perfiles, roles o nivel de autorización. Al empezar con WordPress, tu usuario se crea automáticamente con un perfil determinado por defecto. Siempre es necesario ...