Django3 模版配置/过滤器/markdown=9

一、模版配置

1.1 模版文件位置

在工程目录(即工程名一级目录)下的setting.py文件中:

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [],
        '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 是指额外指定的目录,比如BASE_DIR表示查找根目录,或者temp表示查找根目录下temp文件夹。
APP_DIRS为 True 时表示查找app目录下的templates
我们可以app_dirs设置为false,然后指定dirs为templates,然后我们把所有模版都放在根目录下的templates文件夹中,不同app不同文件夹存放,便于统一管理。

1.2 编写模版文件

base.html

<!-- base.html -->
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>{% block title %} {% endblock %}</title>
        {% load static %}
        <link rel="stylesheet" href="{% static 'index.css' %}">
    </head>
    <body>
            {% include 'mblog\header.html' %}
            {% block headmessage %} {% endblock %}
            <hr>
            {% block content %} {% endblock %}
            <hr>
            {% include 'mblog\footer.html' %}
    </body>
</html>

header.html

<!-- header.html -->
<h1>欢迎光临 文学天地</h1>

index.html

<!-- index.html -->
{% extends 'mblog\base.html' %}
{% block title %} 欢迎光临我的博客 {% endblock %}

{% block headmessage %}
    <h3>本站文章列表</h3>
{% endblock %}

{% block content %}
    {% for post in posts %}
        <p><a href="post/{{post.slug}}">{{ post.title }}</a></p>
    {% endfor %}
{% endblock %}

post.html

<!-- footer.html -->
{% block footer %}
    {% if now %}
        <p id='time'>现在时刻:{{ now }}</p>
    {% else %}
        <p>本文网络取自网络,侵权来信删除....</p>
    {% endif %}
{% endblock %}

footer.html

<!-- footer.html -->
{% block footer %}
    {% if now %}
        <p id='time'>现在时刻:{{ now }}</p>
    {% else %}
        <p>本文网络取自网络,侵权来信删除....</p>
    {% endif %}
{% endblock %}

1.3 访问查看效果

访问app主页:

访问详情页:

当我们模版位置指定错误的时候,访问页面会报错,并显示出模版查找路径:
这里报错是因为我把模版文件放在了app的templates/mblog目录下,如果是直接放在templates目录下,则不需要前缀。

当我们在setting.py中额外指定目录时:

1.4 网页内容安全模式

当我们在博客正文中添加内容的时候,如果包含有html标签,网页默认是不显示的。
但我们可以通过标签指定让其显示。

# 指定safe解析HTML代码
{{ post.body |safe }}
# 撮指定字数字符,再把第一个字母大写
{{ post.body | truncatechars:40 | capfirst}}

常用过滤器

名称 用途 示例
capfirst 把第一个字母改为大写 `{{ value
center 把字符串的内容居中 `{{ value
cut 把字符串中指定字符删除 `{{value
date 指定日期时间的输出格式 `{{ value
linebreaksbr 置换\n成为<br/> `{{value
linenumbers 为第一行字符串加上行号 `{{ value
lower 把字符串转换为小写 `{{ value
random 把前面的串行元素使用随机的方式任选一个输出 `{{ value
striptags 把所有的HTML标记全部删除 `{{ value
truncatechars 提取指定字数的字符 `{{ value
upper 把字符串转为大写 `{{ value
wordcount 计算字数 {{ value | wordcount}}

1.5 templates

{% if 条件 %}  ...  {% endif %}
{% if 条件 %}  ...  {% elif 条件 %}  ...  {% endif %}
{% if 条件 %}  ...  {% elif 条件 %}  ...  {% else %}  ...  {% endif %}

{% for <var> in <list> %}  ... {% empty %}  ...  {% endfor %}

在循环中可以使用 forloop.counter,这个函数的值是当前第几次循环,从1开始。
如果想从0开始,则使用forloop.counter0,只有这两种,没有诸如forloop.counter1/2/3等。
empty是当列表为空的时候执行的块。

实例:

{% for c in cars %}
    <tr bgcolor="{% cycle '#f05' '#ccc' %}" >
        <td>这是第 {{ forloop.counter }} 次循环。</td>
    </tr>
{% empty %}
    <h3>没有车辆</h3>
{% endfor %}

cycle 可以实现在循环中依次取值。比如用来实现隔行不同颜色。

{% for %}中还有以下参数可以使用:

  • forloop.revcounter //反向
  • forloop.revcounter0 //反向,索引0为最后一个
  • forloop.first //布尔值,只在第一次循环才为真
  • forloop.last //布尔值,只在最后一次循环才为真
  • forloop.parentloop //取上一层循环

二、配置markdown

2.1 下载django-markdown-deux

pip install django-markdown-deux

2.2 在页面中配置markdown

更改post.html

<!-- post.html -->
{% extends 'mblog\base.html' %}
{% load markdown_deux_tags %}

{% block title %}
    {{ post.title }}-文学天地
{% endblock %}

{% block messge %}
    <h3>{{ post.title }}</h3>
    <a href="/blog">回到首页</a>
{% endblock %}

{% block content %}
<p>{{ post.body | markdown }}</p>
{% endblock %}

我们使用{% load markdown_deux_tags %}加载了markdown插件,
然后在输出<p>{{ post.body | markdown }}</p>时声明使用了markdown语法。

2.3 输出测试

访问主页时显示如下:

点进详情页时显示:

三、配置其他模块

2.1 添加flag counter

访问Flag Counter获取你的代码,
将其加入到模版中,即可在自己的网站上看到相应的标识。

posted @   那个白熊  阅读(190)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· .NET10 - 预览版1新功能体验(一)
点击右上角即可分享
微信分享提示