12. Create the templates

　　你需要做三件事来去掉TemplateDoesNotExist错误

第一件，创建下面目录

* netmag/netmag/templates

* netmag/netmag/templates/blog

　　下一步，你需要配置Django能找到你的templates。打开settings.py文件找到TEMPLATE_DIRS元组。

　　你只需要告诉django去哪找你的netmag/netmag/templates目录，所以编辑TEMPLATE_DIRS元组，让它有指向netmag/netmag/templates目录的绝对路径。字符串后面的逗号很重要。在我电脑上的绝对路径是这样的，注意要改成你们自己电脑上的绝对路径。

TEMPLATE_DIRS = (

    "C:/Users/zhanglei/Desktop/netmag/netmag/templates",

    # Put strings here, like "/home/html/django_templates" or "C:/www/django/templates".

    # Always use forward slashes, even on Windows.

    # Don't forget to use absolute paths, not relative paths.

)

　　最后，你需要创建三个模板。第一个是base.html，它是其它模板要继承的模板。创建templates/base.html并且输入下面的代码在里面：

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>{% block title %}{% endblock %}</title>

</head>

<body>

    <div class="content">

        {% block content %}

        {% endblock %}

    </div>

</body>

</html>

　　现在我们需要再创建两个模板，每个对应一个view函数，创建templates/blog/index.html文件并输入下面的代码：

{% extends 'base.html' %}

{% block title %}Blog Archive{% endblock %}

{% block content %}

    <h1> My Blog Archive</h1>

    {% for post in posts %}

    <div class="post">

        <h2>

        <a href="{{post.get_absolute_url}}">

        {{post.title}}

        </a>

        </h2>

        <p>{{post.description}}</p>

        <p>

            Posted on

            <time datetime="{{post.created|date:'c'}}">

                {{post.created|date}}

            </time>

        </p>

    </div>

    {% endfor %}

{% endblock %}

　　最后，创建templates/blog/post.html文件，并且输入下面代码：

{% extends 'base.html' %}

{% block title %}{{post.title}}{% endblock %}

{% block content %}

<article>

    <header>

        <h1>{{post.title}}</h1>

        <p>

            Posted on

            <time datetime="{{post.created|date:'c'}}">

                {{post.created|date}}

            </time>

        </p>

    </header>

    <p class="description">

        {{post.description}}

    </p>

    {{post.content|safe}}

</article>

{% endblock %}

　　上面有一些不是HTML的元素

* {% tag %} 是一个模板标签

* {{variable}} 是模板变量

* {{variable|filter}} 是被特定的模板过滤器过滤的模板变量

　　关于模板语言，如果想了解更多的话，请查看 https://docs.djangoproject.com/en/1.4/topics/templates/ 值得及花几分钟好好看看。

　　讲了够多的理论，现在回到浏览器刷新页面，查看目前为止的成果

　　好的，到目前为止，我们已经做了很多了。我们可以回顾一下：

* 编辑urls.py，添加一些把特定的urls映射到view函数的urlpattern

* 写一些view函数来对应相应的URLS

* 为模板创建目录

* 配置django去寻找模板

* 创建base.html模板

* 为每一个view函数创建一个模板

* 简单的学习一下django模板语言

　　然而，还有一些问题，blog太单调了。

13. Adding some style

　　添加一点样式，就会让网页的可阅读性大幅提高。这一小部分，我们就给base.html添加一些样式。

　　请注意：一些在开发版上用的方法目前觉得还行，但是别用在要上线的服务器上面。用django来管理static文件是对资源的浪费，好一点的解决方案是用web服务器来管理static文件，关于这方面如果想了解更多的话，请查看 https://docs.djangoproject.com/en/dev/howto/static-files/#basic-usage

　　创建目录netmag/netmag/static，然后在里面创建一个文件style.css并输入下面代码：

body {

    background-color: #fdfdfd;

    color: #2e2e2e;

    margin:;

    padding:;

    font-size: 14px;

    line-height: 28px;

    font-family: 'Helvetica Neue',Helvetica, Arial, sans-serif;

}

div.content {

    border: 1px solid #fbfbfb;

    background-color: #fff;

    max-width: 640px;

    width: 96%;

    padding: 2%;

    margin:28px auto;

}

　　现在在base.html文件里面的头部分添加下面这行代码：

<link rel="stylesheet" type="text/css" href="{{STATIC_URL}}style.css">

　　在你试着刷新浏览器页面的时候，先停一下，像配置templates位置一样，你需要做一些配置让django知道你的static文件在哪。并且用什么URL来引用它们。

　　打开settings.py文件，修改STATIC_URL如下：

STATIC_URL = '/static/'

　　下一步修改STATICFILES_DIRS像下面这样：

STATICFILES_DIRS = (

    'C:/Users/zhanglei/Desktop/netmag/netmag/static/',

    # Put strings here, like "/home/html/static" or "C:/www/django/static".

    # Always use forward slashes, even on Windows.

    # Don't forget to use absolute paths, not relative paths.

)

　　注意：和模板目录一样这里是我的static的绝对目录，读者要改成自己电脑存放static文件的绝对路径。

　　现在可以刷新一下浏览器查看：

　　

　　恭喜你，在这个教程教程中，你已经做了这么多：

* 用django-admin.py创建了一个project

* 用django-admin.py创建了一个app

* 为你的app设计model

* 关于数据库和其它的项目配置

* 连接你的应用和系统自带管理app，并且自己写了一个自定义的admin类

* 为你的app写urlpatterns view函数 模板，配置关于templates相关的

* 配置css相关，提高你的网站的颗阅读性

14. Suggestions for taking it further

　　这部分是一些学习django的建议，就不翻译了，感兴趣的话可以看原文，原文网址 http://www.creativebloq.com/netmag/get-started-django-7132932 第14小节。

　　

　　　　

用django搭建一个简易blog系统（翻译）（四）的更多相关文章

  1. 用django搭建一个简易blog系统（翻译）（三）

    06. Connecting the Django admin to the blog app Django 本身就带有一个应用叫作Admin,而且它是一个很好的工具 在这一部分,我们将要激活admi ...

  2. 用django搭建一个简易blog系统（翻译）（一）

    Django 入门 原始网址: http://www.creativebloq.com/netmag/get-started-django-7132932 代码:https://github.com/ ...

  3. 用django搭建一个简易blog系统（翻译）（二）

    03. Starting the blog app 在这部分,将要为你的project创建一个blog 应用,通过编辑setting.py文件,并把它添加到INSTALLED_APPS. 在你的命令行 ...

  4. 通过django搭建一个简易的web页面（实现数据的查询、添加、修改、删除）

    一.创建django项目 通过命令创建: django-admin startproject 项目名称 创建app应用 python3 manage.py startapp 应用名 #这里manage ...

  5. python django搭建一个简易博客的解析（按照文件顺序逐一讲解）

    上次讲解了一下各py文件的内容,但比较乱,所以这次整理了一个顺序版. 源代码请在http://github/Cheng0829/mysite自行下载 mysite: db.sqlite3:数据库文件. ...

  6. django 搭建一个投票类网站（四）

    昨天我把投票页面终于写完,怎么说呢,觉得这本书对我的帮助也不是很大,然后去看了下django的文档,发现竟然是同一个项目...... 但还是要善始善终吧,贴一下中文版的文档https://docs.d ...

  7. django开发个人简易Blog——数据模型

    提到数据模型,一定要说一下MVC,MVC框架是现代web开发中最流行的开发框架,它将数据与业务逻辑分开,减小了应用之间的高度耦合.个人非常喜欢MVC开发框架,除了具有上述特性,它使得web开发变得非常 ...

  8. Angularjs,WebAPI 搭建一个简易权限管理系统

    Angularjs,WebAPI 搭建一个简易权限管理系统 Angularjs名词与概念(一)   1. 目录 前言 Angularjs名词与概念 权限系统原型 权限系统业务 数据库设计和实现 Web ...

  9. 如何搭建一个简易的 Web Terminal（一）

    前言 在介绍本篇文章的时候,先说一下本篇文章的一些背景.笔者是基于公司的基础建设哆啦 A 梦(Doraemon)一些功能背景写的这篇文章,不了解.有兴趣的同学可以去 袋鼠云 的 github 下面了解 ...

随机推荐

  1. 基于Jquery的多彩二维码的生成

    Demo效果图: 源代码: @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name=&quo ...

  2. Swift语言指南(九)--基本运算符

    原文:Swift语言指南(九)--基本运算符 运算符(operator)是用来检查,改变或合并值的一种特殊符号或短语.例如,加号运算符让两个数字相加(如:let i = 1 + 2),还有些更复杂的运 ...

  3. angularJS之站在jQuery的肩膀上

    jQuery:用更少的代码,实现更强悍的功能 托互联网日新月异发展的福,浏览器变成了人们接入互联网的入口,而JavaScript 这个曾经的小语种,终于成功地站到了舞台的中央,唤起了开发者的兴趣. 浏 ...

  4. IOS发展--他们控制的定义

    有没有这样的要求,,自定义panel,里面放几个控件,在多个页面中使用此panel. 有三个观点来解决这个问题: 1.自己继承UIView写一个类,在它是在代码的形式加入需要控制.完成布局. 2.使用 ...

  5. CentOs Linux 常见命令

    整理一些常用的命令(持续更新): 查看端口是否开启: netstat -an | grep prot (查看是否打开23端口) |:通道的意思,grep是指查看当前字符所在的行 LINUX通过下面的命 ...

  6. linux下C语言中的flock函数使用方法 .

    表头文件  #include<sys/file.h> 定义函数  int flock(int fd,int operation); 函数说明  flock()会依參数operation所指 ...

  7. Mvc 导出 Excel

    Mvc 导出 Excel 之前接触过Webform,winfrom 的导出Excel方法 ,优点:省事.缺点:服务器必须安装Office 这几天做项目 和 大牛学习了一下 新的方法,自己加以总结.希望 ...

  8. TCP/UDP差异

    首先,它 TCP是面向连接的.有序可靠的协议,然后UDP同TCP相对,那张脸无序连接不可靠的协议. 首先,为什么TCP它是面向连接的.由TCP如果传输是需要进行三次握手,这是client为了服务发送数 ...

  9. android文件缓存，并SD卡创建目录未能解决和bitmap内存溢出解决

    1.相关代码: 加入权限: <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" ...

  10. 有return如果是try catch finally运行命令

    背景: 昨天一个朋友出去采访,遇到这样的问题:"C#  catch那里return.finally也弄它运行?" 个人总结实践: 1.无论有木有出现异常.finally块中代码都会 ...