はじめに

当記事は下記の環境にて動作を確認しています。
1. Python 3.6.2
2. Django 1.11.4

結論

個別画面のtemlateでもstaticファイルを扱うときは{% load static %}を書こう！

Djangoのtemplateからstaticファイルを参照するには？

Djangoのチュートリアルには下記のように記載されています。

sample.html

{% load static %}

<link rel="stylesheet" type="text/css" href="{% static 'polls/style.css' %}" />

この{% load static %}を書いておくことによって、
以降のstaticでsetting.pyで指定した静的フォルダのパスを指定できますよ、
という話なんですが…。

例えば下記のようなtemplateを作成します。

base.html

{% load static %}
<!DOCTYPE html>
<html lang="{{ LANGUAGE_CODE|default:"en-us" }}">
<head>
<meta charset="UTF-8">
<title>{% block title %}Register{% endblock %}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="{% static 'css/bootstrap.min.css' %}" rel="stylesheet">
<link href="{% static 'css/bootstrap-theme.css' %}" rel="stylesheet">
<script src="{% static 'js/jquery-3.2.1.min.js' %}"></script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>
{% block extrahead %}{% endblock %}
</head>
<body>
  <div class="container">
    {% block content %}
      {{ content }}
    {% endblock %}
  </div>
</body>
</html>

extend.html

{% extends "base.html" %}

{% block title %}タイトル{% endblock title %}

{% block content %}
    <img src="{% static 'graph.png' %}">
{% endblock content %}

実は上記コードでは、graph.pngは表示できません。
実際に画面表示してみると、TemplateSyntaxErrorが表示されます。

なんで表示できないの？

stack overflowに似たような質問がありました。

継承したtemplateでロードしていても、
継承先のtemplateでももう一度、ロードするtemplateタグを書かないといけないようです。
つまり上記の例で言うと、extend.htmlを下記のように修正すればOKです。

extend.html

{% extends "base.html" %}
{% load static %}

{% block title %}タイトル{% endblock title %}

{% block content %}
    \<img src="{% static 'graph.png' %}">
{% endblock content %}

参考URL

Djangoのチュートリアル

https://docs.djangoproject.com/ja/1.11/intro/tutorial06/

stack overflow

https://stackoverflow.com/questions/22650371/django-is-it-impossible-to-static-tag-into-block-tag

Djangoの画面個別templateからstaticファイルを参照する時にハマった話

はじめに

結論

Djangoのtemplateからstaticファイルを参照するには？

なんで表示できないの？

参考URL