在前一次,已经建立了名为mysite的django project。
建立完成后,结构如下:
这一次要在此基础上,建立一个名为blog的app。
新建app,选中mysite,点击鼠标右键,选择django->create application
输入名称:blog,点击OK完成
完成后如下图所示,已经有一个名为blog的folder了
修改代码
models.py
from django.db import models
from django.contrib import admin
# Create your models here.
class BlogPost(models.Model):
title = models.CharField(max_length=150)
body = models.TextField()
timestamp = models.DateTimeField()
class BlogPostAdmin(admin.ModelAdmin):
list_display = ('title','body','timestamp')
admin.site.register(BlogPost,BlogPostAdmin)
views.py
from django.shortcuts import render
from django.template import loader,Context
from django.http import HttpResponse
from blog.models import BlogPost
# Create your views here.
def archive(request):
posts = BlogPost.objects.all()
t = loader.get_template('archive.html')
c = Context({'posts':posts})
return HttpResponse(t.render(c))
settings.py
INSTALLED_APPS = (
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'blog',
)
STATIC_URL = '/static/'
urls.py
from django.conf.urls import patterns, include, url
from django.contrib import admin
admin.autodiscover()
from blog.views import*
urlpatterns = patterns('',
# Examples:
# url(r'^$', 'mysite.views.home', name='home'),
# url(r'^blog/', include('blog.urls')),
url(r'^admin/', include(admin.site.urls)),
url(r'^blog/$',archive),
)
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns += staticfiles_urlpatterns()
建立网页模版
在模块blog下添加templates文件夹
base.html
<html>
<style type="text/css">
</style>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>My blog</title>
<!-- Bootstrap -->
{% block bootstrapcss %}
<link href="/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="/static/starter-template.css" rel="stylesheet">
{% endblock %}
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
{% block container %}
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">My blog</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<form class="navbar-form navbar-right" role="form">
<div class="form-group">
<input type="text" placeholder="Email" class="form-control">
</div>
<div class="form-group">
<input type="password" placeholder="Password" class="form-control">
</div>
<button type="submit" class="btn btn-success">Sign in</button>
</form>
</div><!--/.navbar-collapse -->
</div>
</div>
<div class="jumbotron">
<div class="container">
<h1>Hello, world!</h1>
</div>
</div>
{% endblock %}
{% block jquery %}
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
{% endblock %}
{% block bootstrapjs %}
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="/static/bootstrap/js/bootstrap.min.js"></script>
{% endblock %}
{% block content %}
{% endblock %}
</body>
</html>
archive.html
{% extends "base.html" %}
{% block content %}
{% for post in posts %}
<h1>{{ post.title}}</h1>
<p>{{ post.timestamp}}</p>
<p>{{ post.body }}</p>
{% endfor %}
{% endblock %}
下载bootstrap http://getbootstrap.com/2.3.2/
解压后放在项目的static文件夹中
同步数据库
输入yes
按照步骤输入用户名和密码。
第一次运行时要注册administrator账号,用账号登录admin页面。
运行
登录管理页面
输入网址http://127.0.0.1:8000/admin
进入登录画面
输入账号和密码,进入管理页面。
在blog下,点击Add,添加数据。
登录blog页面
在blog下,点击Change,修改数据。
在浏览器上输入http://127.0.0.1:8000/blog/
That's It!