PythonのWEBフレームワークDjangoを利用したアプリケーションの公式テュートリアルに沿ったWEBアプリケーション作成のメモ第12回です。

前回はビューのテストを実施しました。
今回は静的ファイルの管理について進めていきます。
通常、Web アプリケーションは、サーバーによって生成された HTML とは別に、完全な Web ページをレンダリングするために必要な追加ファイル (画像、JavaScript、CSS など) を提供する必要があります。 Django では、これらのファイルを「静的ファイル」と呼びます。
小規模なプロジェクトの場合、Web サーバーが見つけられる場所に静的ファイルを保存できるため、これは大した問題ではありません。ただし、大規模なプロジェクト、特に複数のアプリで構成されるプロジェクトでは、各アプリケーションが提供する複数の静的ファイルのセットを扱うのが難しくなり始めます。
これが django.contrib.staticfiles の目的です。これは、各アプリケーション (および指定したその他の場所) から静的ファイルを、運用環境で簡単に提供できる 1 つの場所に収集します。
アプリの見栄えのカスタマイズ
まず、polls ディレクトリに static というディレクトリを作成します。 Django は、polls/templates/ 内でテンプレートを見つける方法と同様に、そこで静的ファイルを探します。
Django の STATICFILES_FINDERS 設定には、さまざまなソースから静的ファイルを検出する方法を知っているファインダーのリストが含まれています。デフォルトの 1 つは AppDirectoriesFinder で、先ほど作成した polls のような、各 INSTALLED_APPS 内の「静的」サブディレクトリを検索します。管理サイトは、静的ファイルに同じディレクトリ構造を使用します。
作成した static ディレクトリ内に、polls という名前の別のディレクトリを作成し、その中に style.css というファイルを作成します。つまり、スタイルシートは、polls/static/polls/style.css にある必要があります。 AppDirectoriesFinder 静的ファイル ファインダーの仕組みにより、テンプレートのパスを参照する場合と同様に、Django でこの静的ファイルを polls/style.css として参照できます。
静的ファイルの名前空間
テンプレートと同じように、静的ファイルを (polls サブディレクトリを別に作成するのではなく) 直接、polls/static に置くことで回避できるかもしれませんが、実際にはそれは悪い考えです。 Django は、名前が一致する最初に見つかった静的ファイルを選択します。別のアプリケーションに同じ名前の静的ファイルがある場合、Django はそれらを区別できません。 Django に正しいものを指定できる必要があります。これを確実に行う最善の方法は、名前空間を設定することです。つまり、それらの静的ファイルをアプリケーション自体にちなんで名付けられた別のディレクトリ内に置くことによって行われます。
そのスタイルシートに次のコードを入れます
▼「polls/static/polls/style.css」を新規作成
li a {
color: green;
}
次に、polls/templates/polls/index.html の先頭に次の行を追加します。
{% load static %}
<link rel="stylesheet" href="{% static 'polls/style.css' %}">
{% static %} テンプレート タグは、静的ファイルの絶対 URL を生成します。
開発のために必要なのはこれだけです。
サーバーを起動します (すでに実行中の場合は再起動します)。
python manage.py runserver

http://localhost:8000/polls/ をリロードすると、質問リンクが緑色 (Django スタイル!) になっていることがわかります。これは、スタイルシートが正しく読み込まれたことを意味します。

背景画像の追加
次に、画像用のサブディレクトリを作成します。images サブディレクトリを、polls/static/polls/ ディレクトリに作成します。このディレクトリ内に、背景として使用する画像ファイルを追加します。このチュートリアルでは、background.png という名前のファイルを使用します。このファイルのフルパスは、polls/static/polls/images/background.png になります。
次に、スタイルシートに画像への参照を追加します。
▼背景画像の準備
このサイトからダウンロードした画像

を使ってみます。
自分で好きな画像を用意しましょう。
この画像を「polls/static/polls/images/background.png」として保存します。

▼「polls/static/polls/style.css」の末尾に追記]
body {
background: white url("images/background.png") no-repeat;
}
http://localhost:8000/polls/ をリロードすると、画面の左上に背景が読み込まれているのが表示されます。

警告
{% static %} テンプレート タグは、スタイルシートなど、Django によって生成されない静的ファイルでは使用できません。静的ファイルを相互にリンクするには常に相対パスを使用する必要があります。これにより、静的ファイル内の多数のパスを変更することなく、STATIC_URL (URL を生成するためにstaticテンプレート タグによって使用される) を変更できるためです。
これらが基本です。フレームワークに含まれる設定やその他のビットの詳細については、静的ファイルの使用方法と静的ファイルのリファレンスを参照してください。 「静的ファイルのデプロイ」では、実サーバーで静的ファイルを使用する方法について説明します。
静的ファイルに慣れてきたら、このチュートリアルのパート 7 を読んで、Django の自動生成された管理サイトをカスタマイズする方法を学習してください。
今回は以上です。次回は管理サイトのカスタマイズを予定しています。
- 0
- 0
- 0
- 0


コメント