logo标签列表

如何让我的Django应用程序显示网站图标？

pythondjangodjango-templatesfavicondjango-staticfiles
211

我只想将 favicon.ico 放在我的 staticfiles 目录中，并且让它在我的应用程序中显示。

我该如何实现这个目标？

我已经将 favicon.ico 文件放在了我的 staticfiles 目录中，但是它并没有显示出来，并且我在日志中看到了这个信息：

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

如果我访问 http://localhost:8000/static/favicon.ico，我可以看到网站图标。
9
错误是 GET /favicon.ico 而不是 GET /static/favicon.ico，查看 http://localhost:8000/static/favicon.ico 与此无关。看起来一些浏览器会在 HTML 中没有指定时请求 /favicon.ico。 - freezed
@freezed，同意取决于浏览器。我不喜欢使用静态解决方案，我们必须检查所有浏览器的favicon.ico框架/协议。 - NegaOverflow
1
这是一个完整的教程：https://learndjango.com/tutorials/django-favicon-tutorial - Sunchock
21个回答
3

最佳解决方案是覆盖Django的base.html模板。在admin目录下创建另一个base.html模板。如果admin目录不存在，请先创建它。app/admin/base.html。

在重写的模板中添加{% block extrahead %}。

{% 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
在寻求帮助时遇到了这个问题。我尝试在我的Django项目中实现网站图标，但它没有显示 - 想加入讨论。
在尝试在我的Django项目中实现网站图标时，我将 'favicon.ico' 文件重命名为 'my_filename.ico' - 图像将不会显示。 将文件重新命名为 'favicon.ico' 后问题得到解决并且图形显示。下面是解决我的问题的代码：
<link rel="shortcut icon" type="image/png" href="{% static 'img/favicon.ico' %}" />
我把我的网站图标直接放在了static/文件夹里。结果发现需要在static/和图标之间再加一个文件夹。现在按照你的方法做就可以了！ - Song Yang
1

只需将您的favicon复制到以下位置： /yourappname/mainapp(ex:core)/static/mainapp(ex:core)/img

然后进入您的主应用程序模板（例如：base.html），在{% load static %}之后粘贴此代码，因为您必须首先加载静态文件。

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

最佳实践：

与您想象的相反，网站图标可以是任何大小和任何图片类型。点击此链接了解详情。

如果不放置网站图标链接，可能会减慢页面加载速度。

在 Django 项目中，假设您的网站图标路径为：

myapp/static/icons/favicon.png

在您的Django模板中（最好是在基础模板中），将以下行添加到页面的头部：
<link rel="shortcut icon" href="{%  static 'icons/favicon.png' %}">

注意：

我们假设在settings.py中已经正确配置了静态设置。

1
现在（2020年），您可以在HTML文件中添加一个基本标签。
<head>
<base href="https://www.example.com/static/"> 
</head>
0

关于这个问题我遇到了一些困扰，但是已经解决了。 确保你的目录设置正确。例如，你的图片应该放在这样的路径下 "templates-->users-->static-->images-->your-image.jpg"。

** settings.py **

STATIC_URL = '/static/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'templates/users/static')
]

** base.html **

{% load static %}
<img src="{% static 'images/your-image.jpg' %}" alt="Your Image">

希望这能帮到你~

这并没有回答问题。一旦您拥有足够的声望，您将能够评论任何帖子；相反，提供不需要询问者澄清的答案。- 来自审核 - Janusz 'Ivellios' Kamieński
0
对我来说，我需要在settings.py中添加另一组静态变量。我尝试了上面的大多数答案，并将我的静态文件夹移动到不同的位置，但结果总是出现404错误。

settings.py

上面没有提到的要求是什么？
STATICFILES_DIRS = [
    BASE_DIR / "static",
]

在其他答案中的所有内容都一样：

模板/HTML文件

在部分：

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

urls.py

urlpatterns = [
    ...
    path("favicon.ico", RedirectView.as_view(url='static/favicon.ico')),
    ...

编辑：这个SO页面上有最相关的答案解决了我的问题，但是favicon仍然没有显示。其他回答都没有直接涉及到STATICFILES_DIRS。有几个人提到了settings.py和设置静态文件（例如STATIC_URL等），但是设置STATICFILES_DIRS立即解决了问题。似乎只有在投票较低的答案中才特别提到这一点。
0
你可以在Django开发服务器上显示浏览器的favicon。*我的回答解释了如何在Django Admin中设置favicon。
例如，static/目录下有favicon.ico文件，templates/目录下有base.html文件，如下所示：
django-project
 |-core
 |  └-settings.py
 |-my_app1
 |-my_app2
 |-static
 |  └-favicon.ico # Here
 └-templates
    └-base.html # Here

然后，在TEMPLATES中将BASE_DIR / 'templates'设置为DIRS，并在settings.py中将BASE_DIR / 'static/'设置为STATICFILES_DIRS，如下所示，以便Django可以识别django-project下的templates和static文件夹。*我的答案解释了如何设置Django模板，我建议你根据我的答案设置whitenoise，以禁用浏览器缓存Django的静态文件。
# "settings.py"

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [
            BASE_DIR / 'templates' # Here
        ],
        ...
    },
]

...

STATIC_URL = 'static/'
STATICFILES_DIRS = [
    BASE_DIR / 'static/' # Here
]

最后，在base.html中，将<link rel="icon" ...>添加到<head></head>中，如下所示：
{# "base.html" #}

<head>
...
<link rel="icon" href="{% static 'favicon.ico' %}"/> {# Here #}
...
</head>

此外，如果网站图标在您的浏览器中未显示，请使用以下所示的不同网址。 * 我的答案解释了这一点：
http://localhost:8000/...
http://localhost:8001/...
http://localhost:8002/...
http://localhost: :: /...

http://127.0.0.1:8000/...
http://127.0.0.1:8001/...
http://127.0.0.1:8002/...
http://127.0.0.1: :: /...
0
最佳解决方案：
from django.urls import path
from django.views.generic.base import RedirectView
from .views import *
from django.templatetags.static import static


urlpatterns = [
     ...
]

urlpatterns += [
    path("favicon.ico", RedirectView.as_view(url=static("favicon.ico"), permanent=True))
]
0
这是一种实现方式，它将 favicon.ico 保留在网站根路径，并且不会修改标准的 Django 模板。

  1. 将 favicon.ico 文件放置在 collectstatic 可访问的位置，这样它将被安装为 ${STATIC_ROOT}/favicon.ico：

    $ ls tax_refund/static/favicon.ico
tax_refund/static/favicon.ico
$ ./manage.py collectstatic
(...)
$ ls static/favicon.ico
static/favicon.ico

  2. 对于内置的开发服务器，请添加 favicon.ico 路由（生产服务器将忽略该路由）：

from django.contrib.staticfiles import views

(...)
urlpatterns += [
    path('favicon.ico', lambda req: views.serve(req, 'favicon.ico'))
]

对于生产服务器，直接在根路径上提供服务：
  • uwsgi：--static-map /favicon.ico=static/favicon.ico
  • nginx：location /favicon.ico { alias static/favicon.ico; }
  • 等等。
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接