Cómo agregar un favicon a su sitio web de WordPress de 3 maneras

Cada sitio web debe tener un favicon. Aunque es pequeño, los navegadores web utilizan el icono (o íconos del sitio) para representar su sitio (o marca) de manera fuerte. Los favicones no solo se usan para mostrar una pequeña imagen en la pestaña de su navegador, sino que también se pueden usar para marcas y azulejos para ventanas. WordPress facilita agregar un favicon a su sitio desde el personalizador. Y esta es ahora la forma recomendada de hacer esto. Pero hay algunas otras formas que pueden satisfacer sus necesidades. Comprender los favicones en WordPress, que es un favicon (el término “icono favorito”) es un pequeño icono utilizado por los navegadores web para agregar un elemento de marca adicional para los usuarios para reconocer el sitio web / empresa. Si un Favicon se instala correctamente en su sitio, los navegadores lo usarán en diferentes ubicaciones, según sea necesario. Estas ubicaciones incluyen hojas de navegación (al lado del título de la página), barras de dirección (URL cercana), marcas y otras.


En WordPress, la fase se llama “iconos del sitio”, que es una descripción útil que informa a los usuarios que este icono se utilizará para representar su sitio en diferentes casos. La importancia de Favicons Faviconele (o iconos del sitio) es similar al logotipo de la compañía, porque pueden desempeñar un papel pequeño pero crucial en la creación de su sitio web. Un sitio web que no tiene un Favicon puede parecer menos creíble para los usuarios (porque estamos acostumbrados a verlos). Por otro lado, un sitio web que tiene un Favicon le dará al usuario la fuerte visual que necesita y mejorará la experiencia del usuario. Piensa sobre esto. Es mucho más fácil encontrar una marca con un icono al lado que leer el texto. Formato (s) Archivo (s) Hay algunos formatos de imagen aceptables disponibles para fase, pero los más populares son ICO y PNG. Estos formatos tienen el más alto soporte del navegador y aceptan fondos transparentes para su favicon (a diferencia de JPG). Formato ICO Tradicionalmente, las faselets se crean como un archivo ICO (favicon.ico). Un archivo ICO le permite almacenar más imágenes diferentes en un solo archivo, lo que permite que su navegador (escritorio y móvil) elija el tamaño requerido de las imágenes disponibles. El problema con el formato ICO es que no muchas personas saben qué es o cómo crear uno. Puede crear archivos ICO en un editor de fotos, como GIMP, pero parece ser el más importante para usar un generador Favicon Oveline, lo que hace que el proceso sea muy fácil, especialmente para generar fondo transparente.
Afortunadamente, con el lanzamiento de WordPress 4.3, no tenemos que preocuparnos por crear un ICO Favicon para agregar uno a su sitio. El personalizador tiene una opción de icono del sitio que acepta formatos más populares, GIF y JPEG. Más sobre esto más tarde. Nota: Vale la pena mencionar que algunos navegadores más antiguos aceptan solo el formato ICO y nada más y pueden ser una solución de reserva para los viejos navegadores. Entonces, si desea tener lo mejor de ambos mundos (por ejemplo, PNG e ICO), es posible que deba buscar un complemento o agregarlo manualmente. Formato HTML5 PNG, el formato PNG es un formato aceptable para su fase y todos los navegadores principales los aceptan ahora. Probablemente, esta es la mejor opción en el futuro, porque PNG es más consistente debido a su uso generalizado en la web. Sin embargo, debido a que todos los navegadores (incluso viejos) aceptan ICO, puede ser mejor usar versiones PNG e ICO para evitar errores 404 no deseados. El tamaño de su sitio necesita varios tamaños de imagen de Favicon disponibles para mostrarlos de manera óptima en todos los casos de uso (por eso los favicons comenzaron en formato ICO). No entraré en todas las dimensiones diferentes aquí, pero las 4 dimensiones más comunes se generan automáticamente cada vez que agrega un icono del sitio de WordPress Customizer, por lo que no necesita estresarse.
Sin embargo, deberá asegurarse de que la imagen que carga en la aduana es al menos 512 x 512. WordPress creará las otras dimensiones en ese archivo original, de la siguiente manera: Favicon 32x32px. Icono de aplicación 180x180px para iOS a iPhone 6+. Icono de aplicación Android / Chrome 192x192px. Azulejos de tamaño mediano de 270x270px para ventanas. El nombre y la colocación pueden recordar los días en que Favicon tenía que tener el nombre exacto del archivo “Favicon.ico”. Luego lo agregarías al director de la raíz y eso fue práctico. Los tiempos han cambiado y, afortunadamente, WordPress. Ahora puede nombrar su archivo, puede guardarlo en otros formatos y puede almacenarlo en cualquier lugar de su sitio. Si usa WordPress Customizer para agregar el icono del sitio (Favicon), WordPress creará más imágenes y las almacenará en los medios de comunicación carpeta.nota: colocar un favicon.ico en el directorio raíz sigue siendo una buena idea como alternativa, pero tenga cuidado de usar el método correcto o recibir ayuda de un complemento. Creación de su favicon. Un favicon es una imagen, por lo que diseñar su propio favicon no será diferente de crear su propio logotipo. Puede usar un editor de fotos como GIMP o Photoshop. Recuerde diseñar su favicón como un cuadrado perfecto (por ejemplo, 512 × 512 para el icono de su sitio de WordPress). Si desea un fondo transparente, guarde el archivo como PNG (o GIF). Después de eso, puede cargar su imagen a WordPress como un icono de nuestro sitio (más sobre esto más adelante). Si desea convertir PNG en formato ICO, le sugiero que use un convertidor de archivos en línea como Convertico.
Consejo: a veces puede crear su favicón cortando una parte cuadrada de su logotipo. Esta podría ser una buena idea si desea simplificar el proceso. Solo recuerde que este ícono representará su marca, así que no vaya a negligencia. Cómo agregar un favicon a su sitio web de WordPress de 3 maneras suscribirse a nuestro canal de YouTube # 1 Agregue un Favicon con WordPress Customizer para la mayoría, este es el único método que debe considerar para WordPress. Todo lo que necesita es un archivo de imagen (PNG, GIF, JPEG), y WordPress hará el resto. Desde WORDRPESS 4.3, puede agregar fácilmente un Favicon (o icono del sitio) a su sitio web de WordPress en Customizer. Desde el tablero de WordPress, explore la apariencia> Personalización. Luego seleccione la identidad del sitio y encontrará una opción para establecer el icono de su sitio (el icono del sitio es solo otro término para Favicon). Luego puede seleccionar su imagen en la biblioteca de medios o cargar una nueva. Asegúrese de que el archivo tenga al menos 512 x 512 para garantizar la mejor calidad de su imagen para todos los casos de uso.
Una vez que haya seleccionado la imagen deseada, se le pedirá que corte la imagen para que se reproduzca correctamente en su navegador. Esto es útil si carga una imagen que ya no está perfectamente cuadrada.
¡Eso es todo! WordPress hará el resto. Una vez que se haya cortado la imagen, WordPress generará las dimensiones de imagen necesarias para todos los casos de uso de Favicon: 32 PX para el navegador de 180px Favicon para el icono de aplicación iOS 192 PX para el icono de aplicación Chrome 270 PX para Windows la aparición del icono. Publicate Your Your Your Cambios y actualice la página para ver que su favicón aparezca mágicamente en el navegador. Si no puede verlo de inmediato, es posible que deba eliminar el caché del sitio o abrir su sitio en una ventana de incógnito / navegador privado para verlo.
# 2 Agregar un favicon usando un complemento

Si desea la ayuda de un complemento para agregar un Favicon a su sitio de WordPress, tiene suerte. Una simple búsqueda de depósitos de WordPress le dará algunos complementos gratuitos para elegir. Personalmente, no miraría más lejos de Favicon de Realfavicongnerator. Este complemento asegurará que su favicon sea compatible con todos los navegadores, colocando más imágenes en todos los lugares correctos. Incluso le permite personalizar el diseño de cada imagen, que no es fácil de hacer por su cuenta. Para usar agregar un favicon usando el complemento, instale el complemento y explore el aspecto> favicon. Luego cargue la imagen. Asegúrese de que sea perfectamente cuadrado y al menos 260 x 260.


El complemento lo redirigirá al generador en línea para completar su personalización de Favicon para iOS, Android (Chrome), Windows y MacOS (Safari). En solo unos minutos, puede agregar los colores de su marca para que esos íconos se vean geniales para todos los casos. Cuando haya terminado, haga clic en el botón Faviconii y el código HTML en la parte inferior de la página. Usando un complemento, no tendrá que preocuparse por ningún código. Será redirigido a su sitio y recibirá una hermosa vista previa de su pantalla de iconos. ¡Eso es todo! # 3 Adición manual de un Favicon (WordPress 4.2 y más) en versiones anteriores de WordPress (antes de las actualizaciones de personalización), puede agregar un Favicon a su sitio de dos pasos. Asegúrese de usar un tema infantil para cambiar primero los archivos de su sitio, debe cargar el archivo favicon.ico en su sitio (deberá usar un cliente FTP como FileZilla si no es una instalación local). Después de acceder a los archivos del sitio, cargue el favicon en el directorio raíz. También puede optar por agregar el Favicon a la carpeta de temas de su hijo.

Hay diferentes opiniones sobre si debe agregar el Favicon al director de la raíz, la carpeta temática o ambos. Por ejemplo, algunos sugieren mantener un favicón en el directorio raíz que se mostrará en los lectores de alimentación. Entonces, para estar seguro, siempre mantén uno en el directorio de la raíz. Donde sea que elija ponerlo, asegúrese de conectarse a la ubicación del archivo en el encabezado. No solo deje que confíe en su carpeta que todos los navegadores lo encontrarán automáticamente. Algunos navegadores viejos pueden no serlo. Iniciar sesión en Favicon requiere el uso de una etiqueta de enlace HTML en el encabezado (o child.php) la etiqueta de cabeza. Aquí hay dos ejemplos. Para conectarse a Favicon (en formato ICO) desde la raíz (o hijo) de la carpeta, puede agregar el siguiente código a la etiqueta de cabeza. <link rel = "icon" type = "image/x-icon" href = "/favicon.ico”> para colocar el archivo favicon.ico (por ejemplo, www.yourwebsite.com /wp-content/themes/twentyfourteen/favicon.ico), usaría: para colocar favicon.ico en el director de la raíz principal, use lo siguiente:

No sé sobre ti, pero estoy muy agradecido por WordPress 4.3. Agregar un favicon utilizando las opciones básicas en general, sigue siendo la mejor práctica para usar la función de sitio web en WordPress Customizer si está disponible porque ha sido especialmente construido para WordPress. Pero algunos temas de WordPress (especialmente los más antiguos) incluyen una opción de carga Favicon directamente desde la configuración del tema. Tenga cuidado al usar esta opción de tema personalizada, ya que puede usar un método obsoleto y generar una sola imagen para usar para múltiples tribunales. Los principales Takeays Si necesita un pequeño resumen, aquí hay algunas revisiones principales sobre la adición de fase en su sitio de WordPress: debe agregar su Favicon con el personalizador de WordPress si está disponible.
Si desea asegurarse de que colocar su favicon esté donde tenga que tener más control sobre cómo se verá su favicon, use un complemento como el complemento RealFavicGenerator.

Si, por una determinada razón, se encuentra atrapado en la era oscura de WordPress o si necesita adoptar un enfoque manual, asegúrese de utilizar los métodos correctos