Python django web training——(三)我的第一个blog

在前一次,已经建立了名为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!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值