在 Django 中使用網頁樣板：入門指南
更新日期： 2024 年 12 月 1 日
本文為 Django 新手教學，第 4 篇：
網站很少只用純文字來呈現內容，視覺化的網頁樣板是必不可少的。
在 Django 中，我們可以輕鬆地利用樣板來渲染 HTML，讓網站更具吸引力。
本文將介紹如何在 Django 項目中設置與使用網頁樣板，並講解相關配置。
為什麼需要網頁樣板？
純文字的網頁無法滿足大多數現代應用的需求。
通過 Django 的樣板功能，我們可以：
- 在瀏覽器中呈現精美的 HTML 頁面。
- 將 Python 後端邏輯與前端內容分離，保持代碼的結構化。
- 重用相同的 HTML 結構，提高開發效率。
修改視圖函數以使用樣板
要渲染 HTML 樣板，我們需要調整視圖函數，使用 Django 提供的 render 方法，代替返回純文字的 HttpResponse。
以下是範例代碼：
更新後的 views.py
from django.shortcuts import render # 匯入 render 函數
def about(request):
return render(request, "pages/about.html") # 渲染 HTML 樣板
def home(request):
return HttpResponse("home!") # 仍使用純文字
建立樣板目錄與文件
Django 的樣板，需要放置在特定目錄中以便系統檢索。
接下來是設定樣板的步驟。
建立目錄結構
以下是新增樣板後的項目目錄結構：
mysite/
│
├── manage.py
├── mysite/
│ ├── __init__.py
│ ├── asgi.py
│ ├── settings.py
│ ├── urls.py
│ ├── wsgi.py
│
├── pages/
│ ├── __init__.py
│ ├── views.py
│ ├── urls.py
│
├── templates/
│ ├── pages/
│ │ ├── about.html # 關於頁面的 HTML 樣板
│
└── __pycache__/
templates/
樣板的根目錄。templates/pages/
存放pages應用的樣板文件，例如about.html。
建立 about.html
在 templates/pages/ 中創建 about.html 文件，內容如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>About</title>
</head>
<body>
<h1>Welcome to the About Page</h1>
<p>This is the about page rendered using a Django template.</p>
</body>
</html>
配置樣板目錄：修改 settings.py
為了讓 Django 知道樣板的存放位置，我們需要在 settings.py 文件中配置 TEMPLATES 的 DIRS 項目。
配置代碼
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [BASE_DIR / 'templates'], # 指定樣板目錄
'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 的用途
DIRS 是一個列表，用於指定樣板的搜索目錄。
當我們使用 render 函數時，Django 會優先從 DIRS 指定的目錄中查找樣板文件。
在上述範例中，我們將樣板目錄設置為 templates，Django 會根據相對路徑檢索這個目錄。
BASE_DIR / 'templates' 是什麼？
BASE_DIR / 'templates' 是一種生成絕對路徑的方式，它依賴於專案的根目錄 BASE_DIR。
BASE_DIR指向的是專案根目錄（即包含manage.py的目錄）。- 使用
BASE_DIR / 'templates'，會生成一個以專案根目錄為基準的絕對路徑，例如：
C:/Users/Administrator/Desktop/newFloder/mysite/templates- 這樣 Django 可以正確地找到模板檔案。
為什麼 'templates' 無效？
當你直接使用 'templates'，Django 認為這是相對路徑。它會嘗試從當前工作目錄解析該路徑：
- 當前工作目錄：
- Django 預設使用執行
python manage.py runserver的目錄作為當前工作目錄。 - 如果你在專案根目錄執行命令，則當前目錄是
C:/Users/Administrator/Desktop/newFloder/mysite。 - Django 會嘗試尋找
C:/Users/Administrator/Desktop/newFloder/mysite/templates，但相對路徑'templates'可能無法正確解析到這個位置。
- Django 預設使用執行
- 如果你不是在專案根目錄執行命令，而是在其他目錄執行，Django 將無法找到模板。
相對路徑的撰寫方式
在指定樣板文件時，我們使用的路徑是相對於 templates 的。
例如：
render(request, "pages/about.html")路徑解釋：
pages/：對應templates資料夾中的子目錄。about.html：子目錄內的樣板文件。
這種相對路徑方式讓我們能輕鬆組織樣板文件，不會因目錄位置變更而影響代碼。
小結
透過樣板功能，Django 提供了一種簡單而高效的方法來構建網頁。在本文中，我們學習了如何：
- 修改視圖函數，使用
render渲染 HTML。 - 建立樣板目錄與 HTML 文件。
- 配置
settings.py中的DIRS，讓 Django 正確查找樣板。
學會這些基礎操作後，您將能構建更具吸引力和互動性的網站！