افزودن Master Template

ساخت Template

در صفحات قبل دو قالب (template) ایجاد کردیم، یکی برای فهرست کردن همه اعضا و دیگری برای جزئیات مربوط به یک عضو.

قالب ها مجموعه ای از کدهای HTML دارند که برای هر دو قالب یکسان است.

جنگو راهی برای ایجاد یک “قالب والد” (parent template) ارائه می دهد که می توانید آن را در همه صفحات قرار دهید تا کارهایی را انجام دهید که در همه صفحات یکسان است.

با ایجاد یک قالب به نام master.html، با تمام عناصر ضروری HTML شروع کنید:

my_tennis_club/members/templates/master.html :
				
					<!DOCTYPE html>
<html>
<head>
  <title>{% block title %}{% endblock %}</title>
</head>
<body data-rsssl=1>

{% block content %}
{% endblock %}

</body>
</html>
				
			

آیا تگ Block جنگو را در عنصر <title> و عنصر <body> می بینید؟

آن‌ها مکان‌نما هستند و به جنگو می‌گویند که این بلوک را با محتوای منابع دیگر جایگزین کند.

ساخت Template

حالا دو قالب (all_members.html و details.html) می توانند از قالب master.html استفاده کنند.

این کار با اضافه کردن قالب اصلی (master template) به وسیله تگ {% extends %}  و درج یک بلوک عنوان (title) و یک بلوک محتوا (content) انجام می شود:

my_tennis_club/members/templates/all_members.html :
				
					{% extends "master.html" %}

{% block title %}
  My Tennis Club - List of all members
{% endblock %}


{% block content %}
  <h1>Members</h1>
  
  <ul>
    {% for x in mymembers %}
      <li><a href="details/{{ x.id }}">{{ x.firstname }} {{ x.lastname }}</a></li>
    {% endfor %}
  </ul>
{% endblock %}
				
			
my_tennis_club/members/templates/details.html :
				
					{% extends "master.html" %}

{% block title %}
  Details about {{ mymember.firstname }} {{ mymember.lastname }}
{% endblock %}


{% block content %}
  <h1>{{ mymember.firstname }} {{ mymember.lastname }}</h1>
  
  <p>Phone {{ mymember.phone }}</p>
  <p>Member since: {{ mymember.joined_date }}</p>
  
  <p>Back to <a href="/members">Members</a></p>
  
{% endblock %}
				
			

اگر تمام مراحل را در رایانه شخصی خود انجام داده اید، می توانید نتیجه را در مرورگر خود مشاهده کنید: 127.0.0.1:8000/members/.

اگر سرور در حالت اجرا نیست ، باید آن را دوباره با دستور runserver راه اندازی کنید:

				
					py manage.py runserver