Trong trang Django Intro, chúng tôi đã biết rằng kết quả phải ở định dạng HTML và nó phải được tạo ra trong một mẫu, vì vậy hãy làm điều đó
- Mệnh Đề If Trong Django
- Thêm Mẫu Trong Django
- Cập Nhật Bản Ghi Trong Django
- Thêm thành viên Trong Django
- Thêm bản ghi trong Django
Tạo một thư mục mẫu bên trong thư mục thành viên và tạo tệp HTML có tên myfirst. html
Cấu trúc tệp phải giống như sau
myworld manage.py myworld/ members/ templates/ myfirst.html
Mở tệp HTML và chèn những thứ sau
thành viên/mẫu/myfirst. html
Hello World!
Welcome to my first Django project!
Sửa View Trong Django
Mở chế độ xem tệp. py and instead of view index mode
thành viên/lượt xem. py
from django.http import HttpResponse from django.template import loader def index[request]: template = loader.get_template['myfirst.html'] return HttpResponse[template.render[]]
Change setting
To could doing work with những thứ phức tạp hơn “Hello World. ”, chúng tôi phải nói với Django rằng một ứng dụng mới đã được tạo ra
Thí dụ
Bao gồm một mẫu bên trong mẫu
{% include mymenu.html %}
Welcome
This is my webpage
Run Ví dụ »Định nghĩa và cách sử dụng
Thẻ
from django.http import HttpResponse from django.template import loader def index[request]: template = loader.get_template['myfirst.html'] return HttpResponse[template.render[]]7 cho phép bạn bao gồm nội dung từ một mẫu khác
Đặt thẻ
from django.http import HttpResponse from django.template import loader def index[request]: template = loader.get_template['myfirst.html'] return HttpResponse[template.render[]]7 chính xác nơi bạn muốn hiển thị nội dung
Điều này hữu ích khi bạn có cùng một nội dung cho nhiều trang
Bạn cũng có thể gửi các biến vào mẫu bằng cách sử dụng từ khóa
from django.http import HttpResponse from django.template import loader def index[request]: template = loader.get_template['myfirst.html'] return HttpResponse[template.render[]]9
Thí dụ
Nếu tệp bao gồm trông như thế này
HOME | {{ me }} | ABOUT | FORUM | {{ sponsor }}
Mẫu có thể gửi các giá trị biến vào phần bao gồm như thế này
{% include mymenu.html with me="ALEXANDER" sponsor="W3SCHOOLS" %}
Welcome
This is my webpage
Ví dụ Chạy »cú pháp
{% include template %}
hoặc
{% include template with key=value%}
Thông số
Giá trịMô tảmẫuBắt buộc. Tên tệp của mẫu. Hoặc là một chuỗi hoặc một biến. khóa=giá trịTùy chọn. Một tên và giá trị biến để gửi vào tệp bao gồm. Được sử dụng cùng với từ khóafrom django.http import HttpResponse from django.template import loader def index[request]: template = loader.get_template['myfirst.html'] return HttpResponse[template.render[]]9. Bạn có thể có bao nhiêu cặp khóa/giá trị tùy thích
Nếu như bạn đã biết về Django chắc bạn cũng đã biết, Django cho phép sử dụng các template engine khác nhau thay cho Django template mặc định của framework
Mẫu Jinja là một công cụ nổi bật để sử dụng với các khung web Python. Lý do là bởi Jinja tương thích rất tốt với framework web Python. Jinja2 là đời thứ 2 và nó kế thừa hầu hết sự tốt đẹp của Jinja1. Sự khác nhau giữa Jinja2 và Jinja1 bạn có thể tìm thấy ở đây. Trong bài viết này, mình sẽ nói Jinja2 là đại diện cho Jinja template engine
Vì vậy, lý do nào khiến bạn nên sử dụng Jinja2 thay cho Django template. Và các chuyển đổi từ mẫu Django sang Jinja2 như thế nào?
Giới thiệuChẳng lẽ so sánh framework vs engine template nó chả có ý nghĩa gì cả =]]. Việc so sánh này vốn chỉ dành cho các bạn nhìn tổng quan một chút về Django framework vs Jinja template
DjangoJinja2Điểm sửa lại4. 44K67Câu hỏi tràn ngăn xếp175K4. 34KGitHub Stats35. 1K5. 3K---------------------------------- Mô tảDjango là framework Python mạnh mẽđể phát triển
web framework PythonWebsiteInstagram, Pinterest, Udemy, Coursera, MITSendwithus, RoyaltyShare, MetaBrite, Cobe Ltd, GRVTY
*Dữ liệu được cập nhật. 16/07/2018
So sánh Mẫu Django với JinjaNhư nhau
Jinja2 lấy cảm hứng từ mẫu Django. Do đó, rất nhiều cú pháp của 2 bên giống nhau. Điều đó thuận lợi cho việc chuyển đổi mẫu nếu cần thiết
Biến & Khối
Dấu gạch bỏ.
{% include mymenu.html %}
Welcome
This is my webpage
1 được sử dụng rộng rãi trong cả Django template và Jinja2- Với biến. {{biến của bạn}}
- Với khối.
2.{% include mymenu.html %} Welcome
This is my webpage
3{% include mymenu.html %} Welcome
This is my webpage
Ngoài ra, Django template và Jinja2 đều là những template tốt và mạnh mẽ. Mỗi mẫu lại có những ưu điểm riêng, nhược điểm riêng mà tùy dự án ta có thể sử dụng. Tuy nhiên, ta có thể thấy một điều, việc chuyển đổi giữa 2 mẫu này khá dễ dàng. Làm điều đó, nếu bạn sẽ dễ dàng lựa chọn và thay đổi mẫu phù hợp một cách nhanh chóng
Chủ đề của website là bộ mặt của website doanh nghiệp/cá nhân. Khi người dùng vào một trang web có theme hiệu ứng đẹp , màu sắc hài hòa thì người dùng sẽ ở lại và đọc nội dung hơn là một trang web nhiều chức năng nhưng bố cục đơn giản với xanh đỏ tím vàng
Để tạo chủ đề trên django chúng ta có rất nhiều cách, bằng cách tạo ứng dụng mới hoặc tạo mẫu thư mục và chỉ định trong cài đặt tệp. py. Trong project này mình sẽ chọn cách tạo app mới để tạo theme. You please started by command after
________số 8Sau khi tạo xong danh mục ứng dụng, bạn phải thêm ứng dụng vào INSTALLED_APPS trong cài đặt. py. Các bạn cần lưu ý rằng, ứng dụng chủ đề phải được đặt trên tất cả các ứng dụng khác trong INTALLED_APPS để có thể ghi đè lên tất cả các mẫu
Hầu hết các ứng dụng khi bạn tạo mới hoặc cài đặt thêm đều phải khai báo vào INSTALLED_APPS trong cài đặt. py và các thiết lập kèm theo ứng dụng đó theo [nếu có] để có thể sử dụng trên django
# other settings
INSTALLED_APPS = [
'theme',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles'
]
# other settings
Hình trên là danh mục ứng dụng thư mục được tự động tạo thông qua quản lý. ứng dụng khởi động py. Tất cả các ứng dụng được tạo thông qua startapp đều có cấu trúc như hình trên, bạn hãy xóa tệp kiểm tra. py đi, chúng ta không cần sử dụng tệp này
- di chuyển thư mục. Di chuyển là cách mà django thực hiện các thay đổi cho mô hình [thêm trường, xóa mô hình. ] đến cơ sở dữ liệu lược đồ. Hầu hết các tệp di chuyển được tạo ra tự động bằng lệnh makemigration và di chuyển để thực hiện thay đổi. Bạn cũng có thể tự viết di chuyển tệp để thực hiện di chuyển [thường sử dụng trong trường hợp thêm dữ liệu mặc định cho mô hình đó]. Xem thêm chi tiết tại đây
- quản trị viên. py. Một trong những tính năng mình thích ở django là khả năng tự động tạo giao diện quản trị viên. Django sẽ đọc các siêu dữ liệu từ mô hình để tạo và cấp quyền cho người dùng truy cập vào mô hình đó. And file admin. py sẽ nối giữa các mô hình. py with admin interface. Xem thêm chi tiết tại đây
- ứng dụng. py. là tập tin chứa các cấu hình khai báo ứng dụng. Xem thêm chi tiết tại đây
- người mẫu. py. là tệp chứa các mô hình của ứng dụng mà bạn tạo ra. Nó cũng định nghĩa các trường và dùng để đồng bộ lên cơ sở dữ liệu. Xem thêm chi tiết tại đây
- lượt xem. py. là tập tin chứa các lượt xem của django. Nói đơn giản thì lượt xem. py sẽ nhận vào yêu cầu và trả về Web phản hồi. Phản hồi này có thể là nội dung html của trang web, chuyển hướng đến lượt xem hoặc liên kết khác, trả về lỗi 404, xml hoặc json. Xem thêm chi tiết tại đây
Bây giờ, ta sẽ tạo trang chủ của website. Bạn đã tạo một thư mục mới trong chủ đề thư mục, hãy đặt tên là mẫu và tạo tệp cơ sở. html trong thư mục vừa tạo với nội dung như sau
0Hello World!
Welcome to my first Django project!
To show content of base. html lên trang chủ, bạn mở file theme/views. py và chức năng tạo trang chủ
1Hello World!
Welcome to my first Django project!
- TemplateResponse[yêu cầu, 'cơ sở. html']. will only any template to display ra. Tại thời điểm này ta chỉ có cơ sở. html to show, mình will build from the start from this file same with you
Sau khi có template, views, tiếp theo bạn cần tạo route cho trang chủ. You open file newsproject/urls. py thêm các dòng như sau
2Hello World!
Welcome to my first Django project!
url tệp. py hoàn chỉnh sẽ như sau
3Hello World!
Welcome to my first Django project!
- Nhập xem trang chủ để thêm vào các tuyến đường
- quản trị viên. Địa điểm. url là quản trị viên url của django, bạn có thể thay đổi đường dẫn quản trị để bảo mật bằng cách thay đổi mẫu ^admin/ thành đường dẫn bạn muốn
- Lộ trình của trang chủ, mẫu ^$ sẽ là http. //tên miền của bạn. com/
Bây giờ ta hãy vào 127. 0. 0. 1. 8000 to see content has been change
Tới đây là bạn setup theme thành công rồi. Tiếp theo ta sẽ cần một mẫu reponsive hoàn hảo cho trang web của chúng ta. Bạn hãy tải mẫu này về và giải nén ra
Liên kết tải xuống. https. //siêu cấp. nz/#. lE5VkCLa. ETFLC5x_iqOwxYJTYtBKP2loE5UC4OGFWQMJM9-2Bx4
Sau khi giải nén ra, bạn hãy tạo thư mục static trong newsproject/theme/static, và copy 4 thư mục css, fonts, images, js vào thư mục statics
Những tập tin css. hình ảnh, phông chữ, js chúng ta sẽ đặt giống nhau trong một thư mục là tĩnh, django sẽ đọc và tải những tệp này bằng thẻ mẫu trong jinja2. Nhưng bạn phải config để django hiểu và đọc được những thư mục này. You please open file newsproject/settings. py find STATIC_URL, BASE_DIR xóa đi và thêm đoạn sau vào
4Hello World!
Welcome to my first Django project!
- Tìm đường dẫn tuyệt đối cho cài đặt tệp. py
- Gán đường dẫn đến dự án vào 2 biến PROJECT_ROOT và BASE_DIR
- Gán route url cho các file thống kê
- Đường dẫn đến thư mục tĩnh
- Đường dẫn đến thư mục chứa các tập tin tĩnh sau khi chạy lệnh collstatic
- Gán route /media/. Đây là thư mục chứa các tập tin hình ảnh được tải lên
- Đường dẫn đến thư mục media
- Thiết lập đường dẫn đến mẫu thư mục
Cài đặt tệp. py will like after
5Hello World!
Welcome to my first Django project!
Sau đó, bạn chạy lệnh này để sao chép các tệp tĩnh vào thư mục skin
6Hello World!
Welcome to my first Django project!
Các bạn chú ý là mỗi khi update file tĩnh hoặc add file mới thì phải chạy lệnh này để cập nhật file
Tiếp theo bạn hãy mở file base. html up và copy toàn bộ nội dung từ index. html trong thư mục giao diện ta tải trước đó vào. In line on the same of base. html bạn hãy tải các tệp tĩnh vào
7Hello World!
Welcome to my first Django project!
Bây giờ bạn hãy tìm những chỗ có css, js, hình ảnh và sử dụng thẻ mẫu sau khi thay thế
# other settings
INSTALLED_APPS = [
'theme',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles'
]
# other settings
0Bạn nào muốn tiết kiệm thời gian thì copy nội dung bên dưới vào file base. html nha
# other settings
INSTALLED_APPS = [
'theme',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles'
]
# other settings
1Làm mới lại trang chủ để xem kết quả nào
If you show are to here, see as ổn rồi đấy. d. Tiếp theo ta cần xây dựng giao diện theo kiểu jinja2 thật. Chúng ta sẽ đặt tiêu đề chặn, chặn css, chặn js, chặn nội dung
Bây giờ bạn hãy lập chỉ mục tệp. html vertical row with base. html và định nghĩa đây là phần mở rộng tệp của cơ sở. html
# other settings
INSTALLED_APPS = [
'theme',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles'
]
# other settings
2Tiếp theo là cắt phần nội dung chính trong cơ sở. html qua chỉ mục. html. Để làm được điều này, bạn cần có một chút khả năng phân tích và đọc mã nguồn. Đầu tiên ta phải xác định đây là trang web dạng gì
Mình sẽ vẽ lại bố cục của mẫu này cho các bạn biết rõ hơn
Như các bạn đã thấy đây là website dạng layout cơ bản bao gồm header trên cùng, cột bên trái chứa nội dung, cột phải chứa sidebar và footer. Bây giờ ta sẽ tách phần nội dung bên trái vào chỉ mục. html
Bạn hãy tạo hai khối tiêu đề và nội dung trong chỉ mục. html
# other settings
INSTALLED_APPS = [
'theme',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles'
]
# other settings
3Bạn hãy tìm col-md-8 content-left trong base. html và copy vào block content-left trong index. html
# other settings
INSTALLED_APPS = [
'theme',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles'
]
# other settings
4Tìm class col-md-4 side-bar và copy nội dung div vào file sidebar. html
# other settings
INSTALLED_APPS = [
'theme',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles'
]
# other settings
5Sau đó đặt ba khối này vào cơ sở. html to index. html can to override/show content at the blocks compatible in base. html
# other settings
INSTALLED_APPS = [
'theme',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles'
]
# other settings
6Bạn sẽ để ý thấy mình có bao 1 block content bên ngoài block content-left. Mục đích mình làm vậy là để có trang nào cần đầy đủ mình sẽ ghi đè trực tiếp chặn nội dung. Chặn thanh bên mình chỉ bao gồm thanh bên tệp. html vào và có một khối bao bên ngoài được sử dụng như khối nội dung
Ok bây giờ ta sẽ nhóm các file js và css lại, và thêm 2 block extracss và extrajs để có trang nào cần dùng js hoặc css đặc biệt. Bạn không thể nhóm các file css và js lại, nhưng cá nhân mình thì muốn nhóm lại để dễ quản lý, và sau này tiện ích khai triển nén css, js. Bây giờ sau khi thêm các khối tập tin cơ sở. html will like after
# other settings
INSTALLED_APPS = [
'theme',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles'
]
# other settings
7Vui lòng tải lại trang để xem kết quả nào
Hơ. Sao title nó trống trơn, nội dung cũng mất đâu rồi. [[
Đi hơi thôi, chúng ta vẫn làm đúng đấy, bạn còn nhớ xem trang chủ tại theme/views. py chứ. Chúng ta cần phải thiết lập trang chủ mẫu sang chỉ mục. html thì nội dung mới hiển thị ra được
# other settings
INSTALLED_APPS = [
'theme',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles'
]
# other settings
8Ok tải lại trang chủ phát lại nào. d
Homepage của chúng ta lại show nội dung đẹp như demo rồi. ]]
Bài 2 trong series django đến đây là kết thúc. Mọi ý kiến đóng góp của các bạn mình rất hoan hỉ. Các bạn thắc mắc có thể hỏi mình bằng cách comment tại bài viết này hoặc trên group Cộng đồng Python Việt Nam. Chúc các bạn tự học python thành công
p/s. Các bạn muốn trao đổi thảo luận nhanh có thể tham gia nhóm telegram để tiện trao đổi nha. https. //t. tôi/tham gia trò chuyện/CZonIg9l9VX3WbbVChHRnQ
- ← Bài trước
- Bài kế tiếp →
Các thẻ
con trăn
ứng dụng
django
loạt
Bài viết liên quan
Ngày 22 Tháng 6, 2018
Ngày 13 Tháng 6, 2018
Ngày 08 Tháng 6, 2018
ĐƯỢC VIẾT BỞI
Từ Anh Vũ
Ngoài công việc chính là viết mã, môn thể thao yêu thích của tôi là taekwondo. Các bạn cùng sở thích code hoặc đam mê taekwondo với tôi có thể liên hệ với tôi để cùng giao lưu trao đổi kiến thức
11 nhận xét
Liên kết. Trả lời
Shin
14 Tháng 6, 2018
hay quá anh ơi, phần 3 là làm db chưa anh
Liên kết. Trả lời
Từ Anh Vũ
14 Tháng 6, 2018
Phần 3 sẽ đi chi tiết về các model tin tức, loại tin, cũng như cơ sở dữ liệu nha em. d
Liên kết. Trả lời
Cường
20 Tháng 6, 2018
Hồng Redis a. . ]
Liên kết. Trả lời
Anh Vũ Từ
21 Tháng 6, 2018
Redis cũng đơn giản mà em, nếu muốn website chạy nhanh thì không chỉ cache với redis thôi mà mình còn kết hợp với nhiều kỹ thuật khác nữa. d
Liên kết. Trả lời
Shin
20 Tháng 6, 2018
anh ơi chờ bài 3 như nhìn mẹ về anh ạ =]]]
Liên kết. Trả lời
Từ Anh Vũ
21 Tháng 6, 2018
thì anh đang viết tiếp phần 3. Nhưng có nhiều lỗi cần sửa với mongodb quá. Anh sẽ đề cập chi tiết trong bài 3 và cách khắc phục luôn
Liên kết. Trả lời
Lê Đức Hòa
18 Tháng 9, 2018
e bị lỗi k load css thì làm sao ạ.
mới tìm hiểu django nên cần ảnh giải đáp ạ.Liên kết. Trả lời
Anh Vũ Từ
19 Tháng 9, 2018
Chào bạn, để tiện cho việc trao đổi và gỡ lỗi, bạn hãy liên lạc qua telegram với mình tại https. //t. me/YuKusanagi , hoặc trong trò chuyện nhóm tại https. //t. tôi/tham gia trò chuyện/CZonIg9l9VX3WbbVChHRnQ