用django搭建一个简易blog系统（翻译）（四）
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系统（翻译）（四）的更多相关文章
- 用django搭建一个简易blog系统（翻译）（三）
06. Connecting the Django admin to the blog app Django 本身就带有一个应用叫作Admin,而且它是一个很好的工具 在这一部分,我们将要激活admi ...
- 用django搭建一个简易blog系统（翻译）（一）
Django 入门 原始网址: http://www.creativebloq.com/netmag/get-started-django-7132932 代码:https://github.com/ ...
- 用django搭建一个简易blog系统（翻译）（二）
03. Starting the blog app 在这部分,将要为你的project创建一个blog 应用,通过编辑setting.py文件,并把它添加到INSTALLED_APPS. 在你的命令行 ...
- 通过django搭建一个简易的web页面（实现数据的查询、添加、修改、删除）
一.创建django项目 通过命令创建: django-admin startproject 项目名称 创建app应用 python3 manage.py startapp 应用名 #这里manage ...
- python django搭建一个简易博客的解析（按照文件顺序逐一讲解）
上次讲解了一下各py文件的内容,但比较乱,所以这次整理了一个顺序版. 源代码请在http://github/Cheng0829/mysite自行下载 mysite: db.sqlite3:数据库文件. ...
- django 搭建一个投票类网站（四）
昨天我把投票页面终于写完,怎么说呢,觉得这本书对我的帮助也不是很大,然后去看了下django的文档,发现竟然是同一个项目...... 但还是要善始善终吧,贴一下中文版的文档https://docs.d ...
- django开发个人简易Blog——数据模型
提到数据模型,一定要说一下MVC,MVC框架是现代web开发中最流行的开发框架,它将数据与业务逻辑分开,减小了应用之间的高度耦合.个人非常喜欢MVC开发框架,除了具有上述特性,它使得web开发变得非常 ...
- Angularjs,WebAPI 搭建一个简易权限管理系统
Angularjs,WebAPI 搭建一个简易权限管理系统 Angularjs名词与概念(一) 1. 目录 前言 Angularjs名词与概念 权限系统原型 权限系统业务 数据库设计和实现 Web ...
- 如何搭建一个简易的 Web Terminal（一）
前言 在介绍本篇文章的时候,先说一下本篇文章的一些背景.笔者是基于公司的基础建设哆啦 A 梦(Doraemon)一些功能背景写的这篇文章,不了解.有兴趣的同学可以去 袋鼠云 的 github 下面了解 ...
随机推荐
- Python判断内网IP
def ip_into_int(ip): # 先把 192.168.1.13 变成16进制的 c0.a8.01.0d ,再去了"."后转成10进制的 3232235789 即可. ...
- crawler_爬虫代理方案
爬虫往往会遇到各种限制ip问题 理方案(爬虫) IP代理软件 优势标记: 是 自动切换IP 基本无开发成本标记: 黄色, 考虑切换IP时 ,网络瞬时异常 IP池,由商家维护 劣势标记: 非 部署 每个 ...
- krpano音量控制（我们已经转移到krpano中国网站 krpano360.com）
需求: 实现音量控制,这是官网的样例, 本文已经转移 到 krpano中文网 p=148">http://krpano360.com/? p=148 很多其它教程关注微信公众号 krp ...
- 再谈IE的浏览器模式和文档模式
原文:再谈IE的浏览器模式和文档模式 以前在 “IE8兼容视图(IE7 mode)与独立IE7的区别”一文中曾经涉及过浏览器模式和文档模式,但二者的区别却不甚了了,现在有了新的认识,再补充一下. 1. ...
- 10. IDENTITY属性使用小结
原文:10. IDENTITY属性使用小结 从SQL Server 2012开始有了Sequence,简单用列如下: CREATE SEQUENCE TestSeq START INCREMENT ; ...
- linux 下一个 jira-6.3.6 组态 皴 翻译 迁移数据库
每一个版本号翻译包下载 https://translations.atlassian.com/dashboard/download jira下载地址 https://www.atlassian.c ...
- PL/SQL个人学习笔记（二）
IF条件 declare cursor s is select version from city_server t; s_ city_server.version%type ...
- 转载：善待Redis中的数据
Redis是我们数据的保管者,我们可以随时存随时取,大的小的,重要的不重要的,它都毫无怨言的帮我们保存着,甚至有些时候,我们变得很懒,存东西进去的时候顺便还贴张纸:"过了一个星期就帮我扔了吧 ...
- HBuilder CSS 自定义代码块
=begin 本文档是CSS代码块的编辑文件.注意不要把其他语言的设置放到css里来. HBuilder可使用ruby脚本来编辑代码块和增强操作命令. 1.编辑代码块 如果要新增一个代码块,复制如下一 ...
- VS2015安装
VS2015安装 Secondary Installer Setup Failed求解决方案 看到微软最近的一系列变化,着实让我等兴奋不已.VS2015下载地址就不说了.先来记录一下微软的几个变化吧. ...