¿Cómo puedo hacer que aparezca un favicon en mi aplicación django?


148

Solo quiero dejar caer el favicon.icostaticfiles colocarlo en mi directorio y luego hacer que aparezca en mi aplicación.

¿Cómo puedo lograr esto?

He colocado el favicon.icoarchivo en mi staticfilesdirectorio, pero no aparece y veo esto en mi registro:

127.0.0.1 - - [21/Feb/2014 10:10:53] "GET /favicon.ico HTTP/1.1" 404 -

Si voy http://localhost:8000/static/favicon.ico, puedo ver el favicon.


55
El error GET /favicon.icono está GET /static/favicon.icobuscando http://localhost:8000/static/favicon.icono está relacionado. Parece que algunas solicitudes de navegadores /favicon.icodesprecian el HTML.
congelado el

Respuestas:


168

Si tiene una plantilla base o de encabezado que se incluye en todas partes, ¿por qué no incluir el favicon allí con HTML básico?

<link rel="shortcut icon" type="image/png" href="{% static 'favicon.ico' %}"/>

Suena como una buena idea. ¿Me puede indicar un enlace que explique cómo hacer esto?
jononomo

3
Si. Algo así como:{{STATIC_URL}}favicon.ico
karthikr

16
Eso es solo un ejemplo. Modifíquelo para adaptarlo a sus necesidades.
hanleyhansen

3
Esta respuesta no funcionó para mí, pero otras respuestas que href="{% static 'favicon.ico' %}sí lo hicieron.
Bezewy

44
El tipo MIME ( image/png) y el formato de archivo ( favicon.ico) no coinciden.
x-yuri

122

Un truco ligero es hacer una redirección en su urls.pyarchivo, por ejemplo, agregar una vista como esta:

from django.views.generic.base import RedirectView

favicon_view = RedirectView.as_view(url='/static/favicon.ico', permanent=True)

urlpatterns = [
    ...
    re_path(r'^favicon\.ico$', favicon_view),
    ...
]

Esto funciona bien como un truco fácil para que los favicons funcionen cuando realmente no tienes otro contenido estático para alojar.


3
No veo cómo esto es liviano, en comparación con agregar dos líneas a la plantilla. Y este es un tipo de truco que no usaría en la producción.
x-yuri

16
@ x-yuri La otra respuesta es más fácil, si tiene una plantilla base . El punto es que es posible que no tenga ninguna plantilla o contenido estático, por lo que STATIC_URL ni siquiera puede configurarse. por ejemplo, es una API json. pero aún desea una API navegable sin ver errores 404 en sus registros (Chrome, etc., intentará solicitar favicon.ico automáticamente). No hay ningún daño en usar tal RedirectView en producción.
wim

56

En archivo de plantilla

{% load static %}

Luego dentro de la <head>etiqueta

<link rel="shortcut icon" href="{%  static 'favicon.ico' %}">

Esto supone que tiene archivos estáticos configurados adecuadamente en settings.py.


Nota : las versiones anteriores de Django usan load staticfiles, no load static.


31

Solución universal

Puede hacer que el favicon aparezca en Django de la misma manera que lo puede hacer en cualquier otro marco: solo use HTML puro.

Agregue el siguiente código al encabezado de su plantilla HTML.
Mejor, a su plantilla HTML base si el favicon es el mismo en su aplicación.

<link rel="shortcut icon" href="{% static 'favicon/favicon.png' %}"/>

El código anterior supone:

  1. Tiene una carpeta llamada 'favicon' en su carpeta estática
  2. El archivo favicon tiene el nombre 'favicon.png'
  3. Ha configurado correctamente la variable de configuración STATIC_URL

Puede encontrar información útil sobre el soporte de formatos de archivo y cómo usar favicons en este artículo de Wikipedia https://en.wikipedia.org/wiki/Favicon .
Puedo recomendar usar.png para la compatibilidad universal del navegador.

EDITAR:
Como se publicó en un comentario,
"¡No olvides agregar la {% load staticfiles %}parte superior de tu archivo de plantilla!"


Consejo: favicon.ico no lo hizo por mí, después de probar con la extensión .png ¡funcionó!
kaya

Tienes razón @kaya. El formato .ico no es el mejor en cuanto a compatibilidad. Sin embargo .png siempre funciona.
ePi272314

15

En su settings.pyagregar un directorio raíz de archivos estáticos:

   STATICFILES_DIRS = [
        os.path.join(BASE_DIR, 'static')
        ]

Crear /static/images/favicon.ico

Agregue el favicon a su plantilla (base.html):

{% load static %}
<link rel="shortcut icon" type="image/png" href="{% static 'images/favicon.ico' %}"/>

Y cree una redirección de URL urls.pyporque los navegadores buscan un favicon en/favicon.ico

from django.contrib.staticfiles.storage import staticfiles_storage
from django.views.generic.base import RedirectView

urlpatterns = [
    ...
    path('favicon.ico', RedirectView.as_view(url=staticfiles_storage.url('images/favicon.ico')))
]

9
<link rel="shortcut icon" href="{% static 'favicon/favicon.ico' %}"/>

Simplemente agregue eso en su archivo base como la primera respuesta pero extensión ico y agréguelo a la carpeta estática


4

si tienes permiso entonces

Alias /favicon.ico /var/www/aktel/workspace1/PyBot/PyBot/static/favicon.ico

agregue alias a su host virtual. (en el archivo de configuración de apache) de manera similar para robots.txt

Alias /robots.txt /var/www/---your path ---/PyBot/robots.txt

3

La mejor solución es anular la plantilla Django base.html. Cree otra plantilla base.html en el directorio de administración. Haga un directorio de administrador primero si no existe.app/admin/base.html.

Agregar {% block extrahead %}a la plantilla de anulación.

{% extends 'admin/base.html' %}
{% load staticfiles %}
{% block javascripts %}
    {{ block.super }}
<script type="text/javascript" src="{% static 'app/js/action.js' %}"></script>

{% endblock %}

{% block extrahead %}
    <link rel="shortcut icon" href="{% static 'app/img/favicon.ico'  %}" />
{% endblock %}
{% block stylesheets %}

    {{ block.super }}
{% endblock %}

3
        <link rel="shortcut icon" type="image/png" href="{% static 'favicon/sample.png' %}" />

También ejecute: python manage.py collectstatic


2

Probé las siguientes configuraciones en django 2.1.1

base.html

<head>
  {% load static %}
  <link rel="shortcut icon" type="image/png" href="{% static 'images/favicon.ico' %}"/>
</head>

settings.py

 STATIC_ROOT = os.path.join(BASE_DIR, 'static')
 STATIC_URL = '/static/'` <br>`.............

Estructura de directorios del proyecto

Imagen

ver en vivo aquí


1

Simplemente copie su favicon en: / yourappname / mainapp (ex: core) / static / mainapp (ex: core) / img

Luego vaya a su plantilla mainapp (ej: base.html) y simplemente copie esto, después de {% load static%} porque debe cargar primero las estadísticas.

<link href="{% static 'core/img/favi_x.png' %}" rel="shortcut icon" type="image/png" />

0

Mejores prácticas :

Al contrario de lo que pueda pensar, el favicon puede ser de cualquier tamaño y de cualquier tipo de imagen. Siga este enlace para más detalles.

No poner un enlace a tu favicon puede ralentizar la carga de la página.

En un proyecto django, suponga que la ruta a su favicon es:

myapp/static/icons/favicon.png

en sus plantillas de django (preferiblemente en la plantilla base), agregue esta línea al encabezado de la página:

<link rel="shortcut icon" href="{%  static 'icons/favicon.png' %}">

Nota :

Suponemos que la configuración estática está bien configurada en settings.py.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.