Templates
本章，我們將會加上一些 HTML/CSS 美化網頁，並動態顯示每次進來這個頁面的時間。
我們會將前端的程式碼獨立出來，放在 templates 資料夾裡。不僅增加可讀性，也方便與設計師或前端工程師分工。
Template 資料夾
首先建立 Template 資料夾。開啟終端機 ，並確認目前所在位置為 djangogirls/mysite/。
新增一個名為 templates 的資料夾：
(djangogirls_venv) ~/djangogirls/mysite$ mkdir templates設定Template資料夾的位置
建立好資料夾以後，需要修改 mysite/settings.py 中的 TEMPLATES 設定：
# mysite/settings.py
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates').replace('\\', '/')],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
我們將 'DIRS' 原本的[]修改成：
[os.path.join(BASE_DIR, 'templates').replace('\\', '/')]好讓 Django 找得到剛剛建立的 templates 資料夾。
建立第一個 Template
新增檔案 templates/hello_world.html：
mysite
├── mysite
├── templates
│ └── hello_world.html
├── trips
└── manage.py並將下列的 HTML 複製到 hello_world.html：
<!-- hello_world.html -->
<!DOCTYPE html>
<html>
<head>
<title>I come from template!!</title>
<style>
body {
background-color: lightyellow;
}
em {
color: LightSeaGreen;
}
</style>
</head>
<body>
<h1>Hello World!</h1>
<em>{{ current_time }}</em>
</body>
</html>
在 Template 中顯示變數
以上 Template 中，有個地方要特別注意：
<em>{{ current_time }}</em>在 Template 裡面．我們會使用兩個大括號，來顯示變數current_time。
{{<variable_name>}}是在 Django Template 中顯示變數的語法。其它 Django Template 語法，我們會在後面的章節陸續練習到。
使用 render function
最後，將 view function hello_world 修改如下：
# trips/views.pyfrom datetime import datetime
from django.shortcuts import render
def hello_world(request):
return render(request, 'hello_world.html', {
'current_time': str(datetime.now()),
})
import datetime：顯示目前時間： 為了顯示動態內容，我們 import時間模組，並用datetime.now()取得現在的時間。
render： 我們改成用 render 這個 function 產生要回傳的 HttpResponse 物件。render(request, template_name, dictionary)
這次傳入的參數有：
request — HttpRequest 物件
template_name — 要使用的 template
dictionary — 包含要新增至 template 的變數
測試網頁
