在做界面之前我们先给我们文章的显示加上了markdown，至于声明时markdown可以自行百度，至于怎么加上markdown我们在这就不做讨论了，博主就直接贴出教程地址吧~

django1.8下的markdown，highlight, pagedown解决

好啦 现在就开始给我们的博客主页改头换面

首先，我们在我们myblog/article/templates/目录下新建一个base.html文件，这个html文件会放置我们整个博客系统最基本的网站前端骨架不笨，比如布局和导航～


    
    My First Blog

我假装你们已经看了上面的markdown配置教程

首先我们得从新构建我们的模板文件，先修改我们的base.html，引入高亮js和css，加上title block和container blok，更利于以后的扩展

{% load staticfiles %}
    
    
    
    {% block title %}{% endblock %}{% block container %}
{% endblock %}

对于我们博客本身的功能先不做扩展。index.html我们依然只是显示所有文章的一个列表,代码如下：

{% extends "base.html" %}
{% load custom_markdown %}
{% block container %}    

        {% for article in article_list %}            
{{ article.title }}

            

            Time: {{ article.create_time }}            

            

            {{ article.content|custom_markdown }}            

        {% endfor %}    
{% endblock %}

关于block的只是请看我们的官方中文文档，当然你想看英文的也可以，我们给出中文文档的链接

模板概述

现在我们主要编辑的还是我们的base.html,因为我们要先做好整体的网站布局和导航～

为了方便，我们前端会用到bootstrap，一般我们会把bootstrap下载到本地，为了方便我们就直接以链接的方式引入～


    
    
    
    
    

我个人更喜欢导航条的方式，各位可以根据自己 的喜欢自己引用css～

bootstrap中文文档

以下内容建议大家先学一下bootstrap，不然估计看不懂

bootstrap视频教程

虽然有点啰嗦，不过我还是一句一句的把每个代码进行说明，其实博主写博客的时候也是边学边写，学会了就用，会用了就写成博客～



    
        
            
                Toggle navigation
                       
                
                
            
            Blog