ジャンゴと奏でる〜数時間でおぼえるDjango〜「04継承と管理画面とCSSと」

変更：CSSと画像の素材ダウンロード用ファイルリンクを変更

テンプレートの継承を使ってみる

テンプレートの継承機能を使って、entriesのテンプレートすべてに「記事の追加」ボタンを入れてみます。

ベースとなる/hoge/jam/entries/templates/entries/base_entries.htmlを新しくを作成。

<dd div class="operation">
  <a href="/entries/create/">記事の追加</a>
</dd><hr />

{% block entry_content %}
{% endblock entry_content %}

次の４つのファイルbase_entries.html、entry_detail.html、entry_form.html、entry_list.htmlの内容を頭に

{% extends "entries/base_entries.html" %}
{% block entry_content %}

と最後に

{% endblock %}

で挟みます

entry_detail.htmlでの例

{% extends "entries/base_entries.html" %}
{% block entry_content %}

<dt>
  {{ object.title }}
</dt>

<dd>
  {{ object.content}}
</dd><br />

<dd div class="operation">
  <a href="/entries/update/{{ object.id }}">編集</a>
  <a href="/entries/delete/{{ object.id }}">削除</a>
</dd><br />

<dd div class="operation">
  <a href="/entries/">一覧に戻る</a>
</dd>

{% endblock %}

Webブラウザで確認

http://127.0.0.1:8000/entries/からアクセスして一通り確認してみましょう。

Djangoの完成された管理画面

実はDjangoの管理画面は、プロジェクト作成時あたりから使えたりします。Djangoの管理画面は始めから完成されたもので、Djangoの大きな売りのひとつだったりします。（実はプロジェクト作成時あたりから使えます）

使用するにはsetting.pyにすでに追加済みの'django.contrib.admin'を書くことと、jam/urls.pyに次の行を追加修正。（「from django.contrib import admin」と「admin.autodiscover()
」と「(r'^admin/(.*)', admin.site.root),」）

from django.conf.urls.defaults import *

from django.contrib import admin
admin.autodiscover()

urlpatterns = patterns('',
                       (r'^entries/', include('entries.urls')),
                       (r'^admin/(.*)', admin.site.root),
                       )

そしてjam/entries/admin.pyを新しく作成。

from jam.entries.models import Entry
from django.contrib import admin

admin.site.register(Entry)

Webブラウザで確認

http://127.0.0.1:8000/admin/にアクセスして確認してみましょう。

認証画面

ログインします。

EntriesのEntrysから追加・削除してみてください。

/entries/

http://127.0.0.1:8000/entries/

CSSで見た目を整えてみる。

管理画面だけが見栄えするのは、レストランに例えると豪華な厨房に質素な店内みたいで違和感がありませんか？
なので少しばかり見た目を変更してみます。

jam/urls.pyに次を追加修正してください。

from django.conf import settings
import os

if settings.DEBUG:
    urlpatterns += patterns('',
                            (r'^static/(?P<path>.*)',
                             'django.views.static.serve',
                             {'document_root' : os.path.dirname(__file__) +
                              '/static'}),
                            )

を追加してください。

jam/entries/templates/entries/base_entries.htmlに次を追加。

{% extends "base.html" %}
{% block main %}

と

{% endblock main %}

で挟む。
例

{% extends "base.html" %}
{% block main %}

<dd div class="operation">
  <a href="/entries/create/">記事の追加</a>
</dd><hr />

{% block entry_content %}
{% endblock entry_content %}

{% endblock main %}

CSSと画像

~~ここから『django_tutorial.zip』をダウンロードしてください。~~
http://park.geocities.jp/cortyuming/ の『ここから『django_tutorial.zip』ダウンロード』からCSSと画像ファイルを落としてください。（うまくいかない時は、右クリックでリンク先のファイルをダウンロード）
ファイルを解凍してできた「static」と「templates」フォルダを/hoge/jam/に置く。

ブラウザで確認する時に、キャッシュから読まないようシフト押しながらとかで再描画してください。