PythonTip >> 博文 >> Django python

django练习——博客系统优化

zihua 2014-05-04 15:05:24 点击: 843 | 收藏


        一直准备使用Django搭建一个个人网站,最近终于开始动手,上周已经完成了基本博客功能的搭建( http://blog.csdn.net/hcx25909/article/details/24601331 ),不过代码基本是copy的,还是很想掌握具体的实现过程。于是,这几天在之前的基础上继续优化博客的功能和界面,将别人代码中比较好的部分移植到自己的博客当中。主要参考的个人博客系统是:http://hansonsblog.sinaapp.com/,源代码在github上可以下到,在此向Hanson致敬,如有雷同,纯属是我抄袭。

        代码托管github地址: https://github.com/huchunxu/dblog

一、概述

        之前实现的功能比较简单,界面也不是很美观,如下图所示,其中还有很多问题。

        在此基础上进行了很多优化:

(1)使用bootstrap对界面进一步美化,添加了背景图片,调整了整体布局

(2)评论使用了第三方多说评论系统插件,方便其他社交账号的集成

(3)修改博客的数据库位mysql

(4)删除前端添加博客的功能,只能通过后台站点管理添加博客

(5)首页博客内容缩略显示,添加翻页功能

(6)添加博客分类,回到顶部按键,调整侧边栏的显示

        先来上一张整体图片:

       主要使用的软件和插件版本

(1) Pycharm版本:3.1.2

(2) Django版本:1.4.10

(3) Python版本:2.7.6

(4) Bootstrap:3.0.1

(5) 多说:0.1

二、Bootstrap

         Bootstrap是 Twitter 推出的一个开源的用于前端开发的工具包。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架。 Bootstrap是基于jQuery框架开发的,它在jQuery框架的基础上进行了更为个性化和人性化的完善,形成一套自己独有的网站风格,并兼容大部分jQuery插件。 Bootstrap中包含了丰富的Web组件,根据这些组件,可以快速的搭建一个漂亮、功能完备的网站。其中包括以下组件:下拉菜单、按钮组、按钮下拉菜单、导航、 导航条面包屑 、分页、排版、缩略图、警告对话框、进度条、媒体对象等。具体的使用方法和案例在Bootstrap中文网( http://www.bootcss.com/ )都有非常详细的说明。

        作为初学者,可以参考宁浩网站的视频教程《 HTML5 与 Bootstrap 应用实例 》( http://ninghao.net/video/665 ),部分内容是收费的,可以直接百度找到别人分享的资源,看完之后可以基本了解Bootstrap和CSS的使用方法。

三、多说评论

        一开始使用的是Django自带的评论系统,但是配置的比较麻烦,而且界面不是很好看,不方便集成其他的社交账号。从Hanson那里看到了多说,立刻觉得很高大上的感觉,尝试用起来。集成的方法很简单,可以参考多说的官方说明: http://dev.duoshuo.com/python-sdk ,需要注意的是, 在settings中要设置宏如下:        

        如果没有在多说的官网上配置站点,这里就用默认的五个‘x’,否则会出错。

四、mysql

        数据库使用的底层接口django都已经为我们提供了,所以我们只需要配置好就可以。

        mysql的配置方法可以参考《 Django使用MySQL数据库 》( http://blog.csdn.net/hawk0930/article/details/10070513 )。

        需要注意的是,在使用数据库之前需要先创建数据库文件,数据库文件的默认存储位置是在/var/lib/mysql目录下。

五、博客功能

1、博客列表内容缩略

         在首页的博客列表中,我们不需要每篇博客都显示全部内容,否则会导致首页过长。显示内容略缩略的方法很简单,在显示内容的部分加上truncatechars描述就可以,例如:

         这样,每篇博客只显示200个字符,后面的内容会以“...”的方式提示省略,可以点击阅读全文进入查看。

2、回到顶部功能

         这个功能时使用了一个小的js程序实现:

         对应的css样式:

        这样,在博客列表的低端,就出现一个回到顶部的图标,鼠标悬停会反色,点击回到顶端。

3、翻页

        翻页使用的是django自带的Paginator插件,参考下面两篇博客:

      (1) 使用 Paginator 实现分页功能: http://mozillazg.com/2013/01/django-pagination-by-use-paginator.html

      (2) django智能分页函数http://www.jovesky.com/post/214/django-pagination-11/

        在html中的代码:

         views.py中的代码:

 

----------------------------------------------------------------

欢迎大家转载我的文章。

转载请注明:转自 古-月

http://blog.csdn.net/hcx25909

欢迎继续关注我的博客


原文链接:http://www.tuicool.com/articles/aMvyAb

作者:zihua | 分类: Django python | 标签: django python | 阅读: 843 | 发布于: 2014-05-04 15时 |