Django 1.5.4 专题26 Bootstrap

作者: wcc526
发布时间:2015-07-02 17:16:18


pip install django south django-bootstrap-toolkit


from django.conf.urls import patterns, include, url  # Uncomment the next two lines to enable the admin: # from django.contrib import admin # admin.autodiscover()  urlpatterns = patterns('',         (r'^articles/',include('article.urls')),     # Examples:     # url(r'^$', 'twitter_bootstrap.views.home', name='home'),     # url(r'^twitter_bootstrap/', include('')),      # Uncomment the admin/doc line below to enable admin documentation:     # url(r'^admin/doc/', include('django.contrib.admindocs.urls')),      # Uncomment the next line to enable the admin:     # url(r'^admin/', include(, ) 


<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" name="viewport" content="width=device-width,initial-scale=1.0"> <title>Bootstrap Tutorial</title> <link rel="stylesheet" href="">  <style type="text/css"> body{     padding-top:60px; } </style> </head> <body>  <div class="navbar navbar-fixed-top navbar-inverse" role="navigation">     <div class="container">         <div class="navbar-header">             <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navgar-collapse">                 <span class="icon-bar"></span>                 <span class="icon-bar"></span>                 <span class="icon-bar"></span>             </button>             <a class="navbar-brand" href="#">Articles App</a>         </div>         <div class="collapse navbar-collapse">             <ul class="nav navbar-nav">                 <li class="activate"> <a href="{% url 'article.views.articles' %}">Home</a> </li>                 <li><a href="{% url 'article.views.create' %}">New</a></li>             </ul>         </div>     </div> </div>  <div class="container">     {% block content %}      {% endblock %} </div>  <script src=""></script> <script src="//"></script>  </body> </html> 


{% extends "base.html" %} {% load bootstrap_toolkit %}  {% block sidebar %} <ul>     <li><a href="/articles/get/{{}}">Cancel</a></li> </ul> {% endblock %}  {% block content %} <form action="/articles/add_comment/{{}}" method="post">{% csrf_token %}     {{|form|as_bootstrap}}     <div class="form-action">         <button class="btn btn-primary" type="submit">Post Comment</button>     </div> </form> {% endblock %} 


{% extends "base.html" %} {% load static %}  {% block content %} <div class="col-md-8">     <h1>{{article.title}}</h1>     <p>{{ article.body}}</p>     <p>{{article.likes}} people liked this article</p>     <p><a href="/articles/like/{{}}" class="btn btn-xs btn-success">Like</a></p>     <h2>Comment</h2>     {% for c in article.comment_set.all %}     <p>{{c.first_name}} {{c.second_name}}:{{c.body}} <a href="/articles/delete_comment/{{}}" class="btn btn-xs btn-danger">Delete</a> </p>     {% endfor %}      <p><a href="/article/add_comment/{{}}" class="btn btn-primary">Add Comment</a></p> </div> {% endblock %} 


{% extends "base.html" %} {% load bootstrap_toolkit %}  {% block sidebar %} <ul>     <li><a href="/articles/all">Cancel</a></li> </ul> {% endblock %}  {% block content %} <form action="/articles/create/" method="post" enctype="multipart/form-data">{% csrf_token %}     {{form|as_bootstrap}}     <div class="form-actions">         <button class="btn btn-primary" type="submit"> Create Article </button>     </div> </form> {% endblock %} 


{% extends "base.html" %}  {% block content %}     <div class="jumbotron">         <h1>Articles for you!</h1>         <p> This is where you can put a description of what this page does!  </p>     </div>     <div class="row">         {% if article.count > 0 %}             {% for article in articles %}                 <div class="col-6 col-sm-6 col-lg-4">                     <h2>{{ article.title}}</h2>                     <p> {{article.body|lower}} </p>                     <p><small> {{article.likes}} people liked this article </small></p>                     <p><a href="{% url 'article.views.article' %}" class="btn btn-default">View details »</a></p>                 </div>             {% endfor %}         {% else %}             <div class="col-6 col-sm-6 col-lg-4">                 <p>None to show!</p>             </div>         {% endif %}     </div>  {% endblock %}


标签: Bootstrap Django Go