欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页  >  IT编程

使用静态模板实现一个Django的网站

程序员文章站 2022-06-27 14:46:05
1、概述 在理解了上一篇django中mtv模式的情况下，本篇使用静态模板（first_web.html）代替html_strimg，模板中使用前端样式框架semantic.cs...

1、概述

在理解了上一篇django中mtv模式的情况下，本篇使用静态模板（first_web.html）代替html_strimg，模板中使用前端样式框架semantic.css。

2、新建静态文件templates和static

在firstapp文件夹下，新建static和templates文件，其中templates存放静态网页模板，static中存放网页模板的图片、样式

使用静态模板实现一个Django的网站

3、在setting.py中设置静态网页模板的路径

使用静态模板实现一个Django的网站

templates = [
    {
        'backend': 'django.template.backends.django.djangotemplates',
        'dirs': [os.path.join(base_dir, 'templates').replace('\\', '/')],
        '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',
            ],
        },
    },
]

说明：路径中模板文件的名称与新建的模板文件名称对应。

4、在model.py中创建数据表article，存放文章的标题和内容

使用静态模板实现一个Django的网站

说明：article数据表中有两个字段，headline标题和content内容。其中方法__str__(self)是为了能在后台看到存放的名称，见下面后台操作。

5、创建后台超级管理员账号，输入文章article数据

django有 一个很方便的操作就是有自己的后台，可以在后台中可视化的操作所需要的数据。要进入后台，首先创建一个超级管理员账号，方法如下：

1）创建管理员账号

打开终端，输入命令：python manage.py createsuperuser

使用静态模板实现一个Django的网站

说明：按照提示，先输入管理员账号，然后输入密码（邮件地址可以不写）.

2）运行服务

打开终端，输入命令：python manage.py runserver

使用静态模板实现一个Django的网站

3）使用输入后台网址，打开后台

打开浏览器，输入网址：https://127.0.0.1:8000/admin，如下

使用静态模板实现一个Django的网站

说明：输入刚创建好的账号，密码即可登入后台。

4）在admin.py中注册数据

在model.py中建立的数据article，只有在admin.py中进行注册，才能在后台进行操作。，注册方式如下：

使用静态模板实现一个Django的网站

5）在后台中添加aticle中的数据

打开后台中的article对象，然后添加数据标题headline，内容content:

使用静态模板实现一个Django的网站

6、在view.py中对数据进行操作

from django.shortcuts import render, httpresponse
from firstapp.models import people, article
from django.template import context, template

# create your views here.
def index(request):
    context = {}
    article_list = article.objects.all()
    context['article_list'] = article_list
    return render(request, 'first_web.html', context)
解析：

a、引入article的数据，然后使用article.objects.all()获取所有数据；

b、使用context上下文，进行数据与静态与网页模板关联；

c、使用render()方法，返回网页的视图。其中第一个参数为request请求，第二个参数为静态网页模板，第三个参数为上下文。

7、对静态网页模板first_web.html进行修改

django的模板语言有模板标签、模板变量和模板过滤。下面使用模板语言，用article数据库中的数据替换静态模板中的文章的数据。主要内容包括：

1）使用模板标签

<!doctype html>  
<html>  
{% load staticfiles %}  
    <head>  
        <meta charset="utf-8">  
        <title>first web</title>  
        <link rel="stylesheet" href="{% static 'css/semantic.css' %}"  media="screen" title="no title" charset="utf-8">

解析：

a、在首部使用模板标签{% load staticfiles %}来说明一下内容，将载入静态文件；

b、使用{% static 'css/semantic.css' %}来指明css框架文件的存放位置；

c、若html文件中，出现需要引用静态文件的地方，都需要用static来替换。

2）使用模板变量和模板过滤

<p class="ui  vertical segment">  
          {% for article in article_list  %}  
            <p class="ui container vertical segment">  
                <a href="#">  
                    <h1 class="ui header">  
                        {{ article.headline }}  
                    </h1>  
                </a>  
                <i class="icon grey small unhide">10,000</i>  
                <p>  
                    {{ article.content|truncatewords:100 }}  
                    <a href="#">  
                        <i class="angle tiny double grey right icon">readmore</i>  
                    </a>  
                </p>  
                <p class="ui mini  tag label">  
                    life  
                </p>  
            </p>  
          {% endfor %}  
</p>

解析：

a、使用模板标签for循环来读取文章数据，并使用模板变量{{ }}格式来显示数据；

b、{{模板变量|模板过滤}}格式为使用模板变量加过滤，如上{{ article.content|truncatewords:100 }}，文章内容显示不超过100个字符。

8、修改url.py总网页的访问网址

使用静态模板实现一个Django的网站

9、网页效果显示

使用静态模板实现一个Django的网站

上一篇： iOS15如何关闭电量提醒 iOS15关闭电量提醒方法

下一篇： 使用@mediascreen实现网页来适应不同的分辨率（代码）

推荐阅读