block

.html文件中有很多相似模块化的代码,重构比较繁琐,可以设置一个同一目录下的公用的base.html框架文件,

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>{% block title %}{% endblock %}</title>
  7. </head>
  8. <body>
  9. <div>
  10. <a href='{% url 'home' %}'>
  11. <h3>S2AC Blog</h3>
  12. </a>
  13. </div>
  14. <hr>
  15. {% block content %}
  16. {% endblock %}
  17. </body>
  18. </html>

extends

在其他html文件中引用base.html

{% extends 'base.html' %}

调用base.html中的方法

    <!--title -->
    {% block title %}
        当前html文件需要设置的标题
    {% endblock %}
    <!-- content-->
    {% block content %}
       当前html文件需要设置的内容
    {% endblock %}

例:blog_details.html

    <!-- coding=gbk -->
    {% extends 'base.html' %}
    <!--title -->
    {% block title %}
        {{blog.title}}
    {% endblock %}

    <!-- content-->
    {% block content %}
        <h3>{{ blog.title }}</h3>
        <p>Posted by {{ blog.author }}</p>
        <p>At: {{ blog.created_time| date:"Y-m-d H:i:s" }}</p>
        <p>Type:
            <a href="{% url 'blogs_with_type' blog.blog_type.pk %}">
                {{ blog.blog_type }}
            </a>
        </p>
    <p>{{ blog.content }}</p>
    {% endblock %}

全局模板文件夹

项目文件夹下-> settings.py -> TEMPLATES -> DIRS
项目根目录下新建 templates文件夹,将公共架构html放入文件夹下,
修改settings.py
    TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [
            os.path.join(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',
            ],
        },
    },
]
#其中 BASE_DIR为settings开头自动生成的根目录路径
    BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))

模板文件设置建议

app模板文件 -> app
project模板文件 -> project