¡Hola! Soy Cristian González
Trafficker Digital (Paid Media)

Formulario de contacto

Nombre

Correo electrónico

Mensaje

Video

Personalizar Favicon en Blogger

Agregar Favicon en Blogger
Un favicon, también llamado favorite icon, es un pequeño icono que figura al lado del nombre de los sitios web y blogs. En esta entrada te mostraré cómo personalizar el favicon en los blogs de Blogger.

Al comienzo, dicho icono solo aparecía en la lista de favoritos de los navegadores, tiempo después comenzó a utilizarse en la barra de direcciones.

Su tamaño universal es de 16x16 píxeles, aunque una variante del mismo comprende 32x32px.

En Blogger, todos los blogs disponen de un favicon que, por defecto, es el logotipo de la plataforma (una B en mayúscula de color blanco sobre un fondo naranja).

No hay que considerar al favicon como un simple detalle gráfico. Es mucho más que eso, brinda una gran posibilidad de identificación, aunque para ello debes crear uno desde cero y personalizar el proporcionado por Blogger.

Entonces, lo primero que debes hacer es crear un nuevo favicon. Un icono que sea representativo de aquello que deseas transmitir a tus lectores. Para esta tarea, puedes recurrir a programas de edición de imágenes (Photoshop, Gimp), de diseño gráfico (Adobe Illustrator), o herramientas online (Faviconer).

Cualquiera de los casos mencionados servirá. Una vez que tengas el favicon listo, bastará con cambiar el predeterminado ofrecido por Blogger.

Para personalizar el favicon en Blogger, cuentas con dos posibilidades:
  • El editor proporcionado por la plataforma Blogger.
  • El mismo código fuente de tu blog.

Desde el editor de Blogger

Para cambiar el favicon con el editor debes seguir los siguientes pasos:
  1. Accedé a Blogger.
  2. En el menú vertical de la izquierda hacé clic en Diseño.
  3. Hacé clic en Editar, dentro del elemento que corresponde al favicon.
  4. Se abrirá una ventana emergente en la que tendrás que cargar tu favicon. La imagen que utilices debe ser cuadrada (16x16px o 32x32px) y con un tamaño menor a 100KB. Una vez seleccionada, hacé clic en Guardar. Y de vuelta en "Diseño", clic en Guardar Diseño para confirmar los cambios.
Listo. Sencillo pero no siempre seguro. Puede suceder que tras realizar los pasos mencionados el favicon no aparezca, esto suele pasar cuando se realizaron muchas modificaciones en el código o si tenes una de las primeras plantillas de Blogger. Para dichos casos existe la siguiente solución.

Desde el código fuente del blog

Para cambiar el favicon a través del código fuente debes seguir los siguientes pasos:
  1. Accedé a Blogger.
  2. Una vez en el escritorio de Blogger, hacé clic en el menú vertical desplegable. Luego clic en Plantilla y en Editar HTML.
  3. Visualizarás dentro de un marco todo el código del blog. Hacé clic sobre dicho marco, luego Ctrl + F. Emergerá un buscador. Buscá la etiqueta <head> y justo debajo pegá el código del favicon:
    
    <!-- FAVICON -->
    <link href='URL DEL FAVICON' rel='icon' type='image/x-icon'/>
    
    El elemento debería quedar encerrado entre las etiquetas <head> y <b:skin>.
  4. Ahora debes agregar la URL de la imagen que deseas utilizar como favicon. Si bien los navegadores aceptan varios formatos, a veces pueden no reconocerlos todos. Por eso, te recomiendo utilizar el formato ICO, que siempre es leído.
Si tu imagen se encuentra en formato PNG, JPG, o cualquier otro, puedes utilizar algún conversor online para transformarla a ICO.

Pasos para transformar imagen a formato ICO

  1. Accedé al conversor online.
  2. Carga el archivo desde la computadora o subí la imagen a través de su propia URL, y luego clic en Convertir archivo. Se descargará automáticamente el archivo ICO.
  3. Una vez que tengas el archivo ICO, lo subís a Blogger (puede hacerse desde el editor de entradas). Tras obtener la URL, la ubicás en el lugar indicado dentro del código del favicon proporcionado y haces clic en Guardar plantilla.

No hay comentarios.

Publicar un comentario

Con tecnología de Blogger.