1. 程式人生 > >Django開發部落格(六)——新增markdown支援

Django開發部落格(六)——新增markdown支援

背景

新增文章的功能總算是磕磕碰碰的完成了,有時間要去學學前端的技術,自己寫一個介面出來,目前看到的介面都是別人的,看起來有點坑,雖然總體風格不錯,但是很難找到特別符合我想法的介面。
下一步部落格需要新增markdown的功能、編輯功能和刪除功能
注:markdown現在基本上已經是一個部落格所必須具備的功能了,語法詳見《markdown語法說明》
編輯和刪除功能:這兩個功能一般來說放在後臺使用,因為部落格只負責展示內容給別人看,只不過熟悉一下這個東西

版本相關
作業系統:Mac OS X EI Caption
Python版本:3.4
Django版本:1.9
IDE:PyCharm

編輯和刪除

思路

刪除的思路很簡單,點選按鈕的時候web端傳一個文章的唯一鍵值(ID)給後端,後端執行刪除操作吧資料庫這條記錄刪除了,再返回一個頁面,可以自己做一個結果頁。也可以直接返回首頁(或者其他),我是直接返回首頁了,等學會前端後再來返工寫這個結果頁。
編輯相對複雜一些,點選編輯按鈕的時候,web端要吧文章的ID傳給後端,後端要跳轉到一個頁面,然後把文章的內容填充到頁面的編輯框中。我的想法是和新增使用同一個頁面,具體實現細節還沒想好,後續再增加這個邏輯的處理

檢視函式

先寫好編輯和刪除的函式,編輯先用佔位符處理,刪除可以寫好方法。

views.py

def
del_article(request, blog_body_id):
BlogBody.objects.get(id=blog_body_id).delete() return redirect('/') def edit_article(request): pass

傳入ID,然後使用ID在資料庫做一個刪除,最後重定向到首頁。編輯的檢視函式暫時不處理,使用pass站位。

url處理

url需要新增一個刪除的匹配規則。

urls.py

url(r'^del_article/(?P<blog_body_id>\d+)/$', views.del_article, name='del_article'
),

匹配的規則和顯示文章的內容一樣。需要吧這個(?P\d+加上,這樣後臺才能接受到傳入的ID。

模版處理

模版處理其實就是一個刪除的入口。這個入口放在那裡取決於你自己。我是放在文章的內容頁裡面

view.html

<a href="/">編輯</a> <a href="{% url 'del_article' blog_content.id %}">刪除</a>

這個可以自己隨意放置,裡面連結的方式和之前的URL跳轉方式一樣。這樣刪除功能就搞定了

markdown

思路

這一塊就比較麻煩了,自己去寫語法肯定是比較麻煩的。Python有現成的markdown庫,我們直接呼叫就行了。安裝方法如下:

$sudo pip install markdown

安裝完畢之後,我們要做的就是在Django中使用這個語法作為一個過濾器,把存入後臺的markdown文字轉化顯示出來。
注:Django在1.5之後的版本把內建的markdown移除了,所以我們只能自己製造過濾器。

自定義過濾器

在app下新建一個templatetags,裡面新建兩個檔案,一個是init.py空檔案。表示這個是Python的一個模組。另一個是custom_markdown.py。輸入以下程式碼:

app/templatetags/custom_markdown.py

import markdown
from django import template
from django.template.defaultfilters import stringfilter
from django.utils.encoding import force_text
from django.utils.safestring import mark_safe

register = template.Library()  # 自定義filter時必須加上


@register.filter(is_safe=True)  # 註冊template filter
@stringfilter  # 希望字串作為引數
def custom_markdown(value):
    return mark_safe(markdown.markdown(value,
                                       extensions=['markdown.extensions.fenced_code', 'markdown.extensions.codehilite'],
                                       safe_mode=True,
                                       enable_attributes=False))

這樣我們的過濾方法就寫好了,詳細的內容參照《自定義標籤和過濾器》

模版處理

在需要使用markdown過濾的模版中輸入這行程式碼{% load custom_markdown %}。表示載入我們的過濾器。然後再我們的文章內容的變數中使用這個就行了,類似這樣:{{ blog_content.blog_body | custom_markdown }}就不需要上次寫的那個增加空格和換行的過濾了。

程式碼高亮

使用markdown還不夠,我們還需要讓程式碼高亮顯示。去pygment-css下載自己需要的css樣式,隨便一個下載來使用都可以。我是全部下下來一個一個的看了效果。使用這個的時候需要安裝pygment,我是使用3.x的版本,所以我下載的是3.3的庫,安裝完畢後,在base.html載入下載的CSS就可以看到最終的效果了

後記

markdown和語法高亮相關是參考《極客學院教程》整(chao)理(xi)而來。總體來說,還是很快速的實現了功能。但是還是有一些問題。比如:
1、存放到資料庫的欄位會變成##這種,顯示列表的時候不好看。
2、我的HTML程式碼是高亮了。。。。可是Python的程式碼依然不是高亮的。= =!
3、程式碼不會自動換行,基本上長程式碼都無法瀏覽。
(未完待續。。。。)