zoukankan      html  css  js  c++  java
  • 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 'mblogheader.html' %}
                {% block headmessage %} {% endblock %}
                <hr>
                {% block content %} {% endblock %}
                <hr>
                {% include 'mblogfooter.html' %}
        </body>
    </html>
    

    header.html

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

    index.html

    <!-- index.html -->
    {% extends 'mblogase.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 | capfirst }}
    center 把字符串的内容居中 {{ value | center: "12" }}
    cut 把字符串中指定字符删除 {{value|cut:""}}
    date 指定日期时间的输出格式 {{ value|date:"d M Y"}}
    linebreaksbr 置换 成为<br/> {{value|linebreaksbr}}
    linenumbers 为第一行字符串加上行号 {{ value | linenumbers }}
    lower 把字符串转换为小写 {{ value | lower }}
    random 把前面的串行元素使用随机的方式任选一个输出 {{ value | random }}
    striptags 把所有的HTML标记全部删除 {{ value | striptags }}
    truncatechars 提取指定字数的字符 {{ value | truncatechars:40 }}
    upper 把字符串转为大写 {{ value | upper }}
    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 'mblogase.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获取你的代码,
    将其加入到模版中,即可在自己的网站上看到相应的标识。

  • 相关阅读:
    Nginx 学习笔记(七)如何解决nginx: [emerg] bind() to [::]:80 failed (98: Address already in use)
    jQuery基础 (四)——使用jquery-cookie 实现点赞功能
    Travis CI实现持续部署
    三大云安全工具(CASB、CSPM、CWPP)的使用场景
    数据访问安全代理 CASB
    SDP(软件定义边界)让SDN更安全,你的对面可不能是一条狗!
    从BeyondCorp说起
    [Docker] Docker整体架构图
    当博弈论遇上机器学习:一文读懂相关理论
    用Rust重写Linux内核模块体验
  • 原文地址:https://www.cnblogs.com/amnotgcs/p/13802257.html
Copyright © 2011-2022 走看看