Toma favicon.ico usando las herramientas de desarrollo de Google Chrome

33

¿Dónde puedo obtener el favicon de un sitio web con las herramientas de desarrollo de Google Chrome? Tengo acceso a los recursos (html, css, js, imágenes, etc.) pero no puedo encontrar el favicon.

¿Dónde está oculto el favicon en las herramientas de desarrollo de Chrome?

google-chrome favicon Randomblue
fuente
1
Tuve el mismo problema con una página HTML, luego me di cuenta de que el favicon no necesitaba especificarse explícitamente. En cambio, el navegador estaba leyendo automáticamente por arte de magia /favicon.ico. Ref: mathiasbynens.be/notes/rel-shortcut-icon
kevinarpe

Respuestas:

19

A veces puede ser un poco tedioso encontrar el enlace "icono de acceso directo" en el HTML. Otro enfoque es crear un acceso directo a Internet (es decir, un "Favorito" en IE, también conocido como "Marcador") y abrirlo con el Bloc de notas:

    [DEFAULT]
    BASEURL=http://superuser.com/questions/532616/grab-favicon-ico-…
    [{000214A0-0000-0000-C000-000000000046}]
    Prop3=19,2
    [InternetShortcut]
    URL=http://superuser.com/questions/532616/grab-favicon-ico-using-google-…
    IDList=
->  IconFile=http://cdn.sstatic.net/superuser/img/favicon.ico
    IconIndex=1

IconFile e IconIndex suelen estar al final.

Scott
fuente
¿Cómo puedo abrir uno de mis sitios de barras favoritos en un editor de texto como este?
Joel Balmer
1
Intente esto: inicie el Bloc de notas, minimícelo, arrastre el favorito al botón de tareas del Bloc de notas en la barra de tareas (no lo suelte allí) y espere a que se abra la ventana del Bloc de notas, luego arrástrelo a la ventana abierta y suéltelo allí.
Scott
1
Gracias Scott, lamentablemente en Mac, uso textedit / xcode / sublime para editar código, y realizar su sugerencia básicamente parece pegar el enlace del sitio favorito. ¡Ojalá haya un camino!
Joel Balmer
2
Sé que el autor de la pregunta aceptó esta respuesta, pero no responde la pregunta formulada, que era explícita sobre "el uso de las herramientas de desarrollo de Chrome". Esto también es útil en el caso de que el sistema operativo del usuario sea Windows.
jsejcksn
10

Puede hacer clic en Ctrl+ Upara ver la fuente y buscar el favicon en el código ( <link rel="shortcut icon"). Por lo general, se encuentra en la parte superior del archivo fuente HTML, ya que está dentro de <head>.

Para esta página, está en la 7ma línea:

<!DOCTYPE html>
<html>

<head>

    <title>Grab favicon.ico using Google Chrome dev tools - Super User</title>
    <link rel="shortcut icon" href="http://cdn.sstatic.net/superuser/img/favicon.ico">
amiregelz
fuente
44
¿Por qué no está en "Recursos", con todas las otras imágenes?
Randomblue
@randomblue ¿Dónde debería estar? bajo Marcos> superusuario.com> Imágenes ?
amiregelz
3
Sí, o en algún lugar del panel "Recursos".
Randomblue
Esto no funciona de manera confiable. Hay múltiples formas de especificar un favicon; un <link>elemento es solo uno de ellos.
yo_y
9

Puedes usar el poder de google para hacer esto:

http://www.google.com/s2/favicons?domain=www.google.de

Reemplazar el nombre de dominio anterior tomará el favicon para ese dominio dado.

También puedes usar esta variante:

http://www.google.com/s2/favicons?domain_url=http%3A%2F%2Fwww.google.de%2F

eso obtendrá el favicon para cualquier url.

blo0p3r
fuente
Esto definitivamente no funciona para todas las URL. En particular, no he logrado que funcione para ninguna variante que probé de pactcoffee.com .
yo_y
@me_and https://www.google.com/s2/favicons?domain=media.pactcoffee.com/terminó trabajando. Supongo que no funcionó en el original ya que estaba obteniendo el favicon de un subdominio diferente.
blo0p3r
4

Aquí hay una herramienta que en realidad es parte de Google Chrome (como se solicitó en la pregunta) y funciona para sitios que requieren un inicio de sesión.

En la barra de direcciones, ingrese chrome://favicon/, seguido de la url.

Por ejemplo, chrome://favicon/https://example.com/private-page.html

Fuente

ceñudo
fuente
2

Use la pestaña Red de herramientas de desarrollo de Chrome. Filtrar por favicon Vuelva a cargar la página con Shift + F5 Obtendrá el icono independientemente de si se cargó con un enlace o desde la ubicación predeterminada

Sin esperanza
fuente
0

¿Por qué no haces clic derecho en la página y seleccionas inspect element? Eso le da el código html de la página y el favicon aparece allí. Simplemente haga clic en el enlace.

Ejemplo http://cdn.sstatic.net/superuser/img/favicon.ico

CalvT
fuente
1
en páginas donde está explícitamente vinculado. Si la página no especifica, el navegador web probará la ubicación predeterminada de /favicon.ico, que no
inicia