上節(jié)我們用模板弄出來第一個hello world ，這節(jié)課，我們把數(shù)據(jù)庫里面真正的數(shù)據(jù)跟單篇文章的詳情頁顯示出來
一. 模板的下載
- 這里的模板下載指的是，下載js和css文件， 一個網(wǎng)站想要變得漂亮，變得可以稍微好看點，這里我們使用是bootstrap，是facebook的一套模板？適配了手機，平板，移動端。我也是因為學(xué)這個才了解到的這套框架，不過據(jù)公司前端小哥哥說，現(xiàn)在已經(jīng)是算過時了，有很多vue,angular,react框架，不過我們現(xiàn)在用一下還是可以行得通的。
下面說下模板使用步驟：
1 . https://github.com/zmrenwu/django-blog-tutorial-templates(用的追夢大哥的，這套學(xué)習(xí)系列也是基于這個自己做一個更深刻的總結(jié))
下載完后，我們在blog/下新建一個static文件夾，在static下再新建一個blog文件夾，我們這樣子寫是按照功能static下的blog是以后還會有其他功能，或者是comments功能之類的，工作經(jīng)驗會讓你懂得這是為什么的，
這時候我們把css，js文件夾都拷到static/blog下，把模板中的index.html 替換掉我們之前寫的index.html,這時候我們再啟動一下服務(wù)器會看到：
- 這樣子看起來是js和css 沒有起到作用的，我們需要在index.html中head標(biāo)簽中進行重新修改一下
：
<head>
<title>Black & White</title>
<!-- meta -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- css -->
<link rel="stylesheet" >
<link rel="stylesheet" href="{% static 'blog/css/bootstrap.min.css' %}">
<link rel="stylesheet" href="{% static 'blog/css/pace.css' %}">
<link rel="stylesheet" href="{% static 'blog/css/custom.css' %}">
<!-- js -->
<script src="{% static 'blog/js/jquery-2.1.3.min.js' %}"></script>
<script src="{% static 'blog/js/bootstrap.min.js' %}"></script>
<script src="{% static 'blog/js/pace.min.js' %}"></script>
<script src="{% static 'blog/js/modernizr.custom.js' %}"></script>
</head>
還有這里的：
<!-- Mobile Menu -->
<div class="overlay overlay-hugeinc">
<button type="button" class="overlay-close"><span class="ion-ios-close-empty"></span></button>
<nav>
<ul>
<li><a href="index.html">首頁</a></li>
<li><a href="full-width.html">博客</a></li>
<li><a href="about.html">關(guān)于</a></li>
<li><a href="contact.html">聯(lián)系</a></li>
</ul>
</nav>
</div>
<script src="{% static 'blog/js/script.js' %}"></script>
</body>
</html>
說明一下：主要用模板代碼引入，加入了{% static 'blog 和%}
這里的<link rel="stylesheet" href="{% static 'blog/css/pace.css' %}"> 代碼在瀏覽器中運行被替換成了：
<link rel="stylesheet" href="/static/blog/css/pace.css">
我們再運行一遍：
- 我們把index.html的數(shù)據(jù)完善一下，因為現(xiàn)在有多個article標(biāo)簽，我們這里只需要一個就可以了，然后寫上代碼：
templates/blog/index.html
{% for post in post_list %}
<article class="post post-{{ post.pk }}">
...
</article>
{% empty %}
<div class="no-post">暫時還沒有發(fā)布的文章！</div>
{% endfor %}
這里的post_list 是從blog/views.py index方法傳的post_list,模板代碼用for 循環(huán)取出每一個post文章，
我們再在article標(biāo)簽中把內(nèi)容填一下：
{% for post in post_list %}
<article class="post post-{{ post.pk }}">
<header class="entry-header">
<h1 class="entry-title">
<a href="{{ post.get_absolute_url }}">{{ post.title }}</a>
</h1>
<div class="entry-meta">
<span class="post-category"><a href="#">{{ post.category.name }}</a></span>
<span class="post-date"><a href="#"><time class="entry-date"
datetime="{{ post.created_time }}">{{ post.created_time }}</time></a></span>
<span class="post-author"><a href="#">{{ post.author }}</a></span>
<span class="comments-link"><a href="#">4 評論</a></span>
<span class="views-count"><a href="#">588 閱讀</a></span>
</div>
</header>
<div class="entry-content clearfix">
<p>{{ post.excerpt }}</p>
<div class="read-more cl-effect-14">
<a href="{{ post.get_absolute_url }}" class="more-link">繼續(xù)閱讀 <span class="meta-nav">→</span></a>
</div>
</div>
</article>
{% empty %}
<div class="no-post">暫時還沒有發(fā)布的文章！</div>
{% endfor %}
我們再訪問一次，瀏覽器中顯示的是： 暫時還沒有發(fā)布的文章
好吧，我們應(yīng)該從后臺創(chuàng)建admin賬號，進行文章的添加操作了。
二. admin后臺用戶的創(chuàng)建并發(fā)布文章
- 使用命令行：
python manage.py createsuperuser
這里我們可以暫時不填寫email address,在填寫密碼時是看不出你填的什么的
- 我們創(chuàng)建好賬戶了，現(xiàn)在需要在后臺注冊我們自己創(chuàng)建的幾個模型
Django 快速搭建博客 第三節(jié)
這里有說道，在blog/admin.py 下寫上上面的代碼：
from django.contrib import admin
from .models import Post,Category,Tag
# Register your models here.
#希望能看到文章的更多信息，而不僅僅是文章
class PostAdmin(admin.ModelAdmin):
list_display = ['title','category','created_time','modified_time','author']
# 把新注冊的PostAdmin也注冊進來
admin.site.register(Post,PostAdmin)
admin.site.register(Category)
admin.site.register(Tag)
這里寫了個class類是為了在后臺能看清楚post(文章)的具體信息，標(biāo)題，標(biāo)簽，時間,etc
現(xiàn)在我們在服務(wù)器運行，輸入：http://127.0.0.1:8000/admin/
這時候：
輸入完之后：
我們新建幾篇文章試試：
到這里，我們在刷新一下服務(wù)器，就會出現(xiàn)我們剛剛寫的文章標(biāo)題作者什么的
ending...
