資訊專欄INFORMATION COLUMN
摘要：博文也是同樣的，好的目錄對博主和讀者都很有幫助。文中的目錄之前我們已經(jīng)為博文支持了語法，現(xiàn)在繼續(xù)增強其功能。修改文章詳情視圖文章詳情目錄擴展僅僅是將將擴展添加了進(jìn)去。通過將目錄傳遞給模板。
對會讀書的人來說，讀一本書要做的第一件事，就是仔細(xì)閱讀這本書的目錄。閱讀目錄可以對整體內(nèi)容有所了解，并清楚地知道感興趣的部分在哪里，提高閱讀質(zhì)量。
博文也是同樣的，好的目錄對博主和讀者都很有幫助。更進(jìn)一步的是，還可以在目錄中設(shè)置錨點，點擊標(biāo)題就立即前往該處，非常的方便。
文中的目錄之前我們已經(jīng)為博文支持了Markdown語法，現(xiàn)在繼續(xù)增強其功能。
有折騰代碼高亮的痛苦經(jīng)歷之后，設(shè)置Markdown的目錄擴展就顯得特別輕松了。
修改文章詳情視圖：
article/views.py
...
# 文章詳情
def article_detail(request, id):
...
article.body = markdown.markdown(article.body,
extensions=[
"markdown.extensions.extra",
"markdown.extensions.codehilite",
# 目錄擴展
"markdown.extensions.TOC",
]
)
...
僅僅是將將markdown.extensions.TOC擴展添加了進(jìn)去。
TOC: Table of Contents，即目錄的意思
代碼增加這一行就足夠了。為了方便測試，往之前的文章中添加幾個一級標(biāo)題、二級標(biāo)題等。
還記得Markdown語法如何寫標(biāo)題嗎？一級標(biāo)題：# title1，二級標(biāo)題：## title2
然后你可以在文中的任何地方插入[TOC]字符串，目錄就自動生成好了：
點擊標(biāo)題，頁面就立即前往相應(yīng)的標(biāo)題處（即“錨點”的概念）。
任意位置的目錄上面的方法只能將目錄插入到文章當(dāng)中。如果我想把目錄插入到頁面的任何一個位置呢？
也簡單，這次需要修改Markdown的渲染方法：
article/views.py
...
def article_detail(request, id):
...
# 修改 Markdown 語法渲染
md = markdown.Markdown(
extensions=[
"markdown.extensions.extra",
"markdown.extensions.codehilite",
"markdown.extensions.toc",
]
)
article.body = md.convert(article.body)
# 新增了md.toc對象
context = { "article": article, "toc": md.toc }
return render(request, "article/detail.html", context)
為了能將toc多帶帶提取出來，我們先將Markdown類賦值給一個臨時變量md，然后用convert()方法將正文渲染為html頁面。通過md.toc將目錄傳遞給模板。
注意markdown.markdown()和markdown.Markdown()的區(qū)別更詳細(xì)的解釋見：官方文檔
為了將新的目錄渲染到頁面中，需要修改文章詳情模板：
templates/article/detail.html ......{{ article.title }}
...目錄
{{ toc|safe }}
重新布局，將原有內(nèi)容裝進(jìn)col-9的容器中，將右側(cè)col-3的空間留給目錄
toc需要|safe標(biāo)簽才能正確渲染
重新打開頁面：
總結(jié)完成了文章的目錄功能，至此文章詳情頁面也比較完善了。
有疑問請在杜賽的個人網(wǎng)站留言，我會盡快回復(fù)。
或Email私信我：[email protected]
項目完整代碼：Django_blog_tutorial
轉(zhuǎn)載請注明出處。
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/42913.html
摘要：重新打開一個命令行窗口，進(jìn)入虛擬環(huán)境，安裝是一種通用語法高亮顯示器，可以幫助我們自動生成美化代碼塊的樣式文件。 上一章我們實現(xiàn)了文章詳情頁面。為了讓文章正文能夠進(jìn)行標(biāo)題、加粗、引用、代碼塊等不同的排版（像在Office中那樣?。?，我們將使用Markdown語法。 安裝Markdown Markdown是一種輕量級的標(biāo)記語言，它允許人們使用易讀易寫的純文本格式編寫文檔，然后轉(zhuǎn)換成有效的或...
摘要：后面兩個編輯器自帶，不用單獨下載，添上就可以了添加相關(guān)插件這樣就完成了代碼高亮效果不錯在前臺使用為了讓用戶在前臺也能使用富文本編輯器，還得對代碼稍加改動。對于有些不喜歡的人來說，甚至可以連博文都使用提供的富文本編輯器。 前面我們已經(jīng)實現(xiàn)了用Markdown語法寫文章了。但是文章的評論用Markdown就不太合適了，你不能強求用戶也花時間去熟悉語法啊。另外評論中通常還有表情、帶顏色的字體...
摘要：語法支持再次打開文件，在文件的最后添加指明了使用語法標(biāo)記，做了兩個拓展，其中表示支持語法高亮，包含的特性請參見相關(guān)文檔。語法高亮支持注意這一步必須在安裝完主題之后。 目前網(wǎng)上搭建個人博客的方案很多，雖然使用諸如 Wordpress ( PHP )、Hexo ( Node.js ) 等可以方便快速地搭建一款功能齊全的高性能個人博客，但是本文將嘗試一種更為小眾化的方案 —— 一款基于 dj...
摘要：學(xué)習(xí)小組是由我發(fā)起的一個促進(jìn)新手互相學(xué)習(xí)互相幫助的組織。當(dāng)然如果你不喜歡英文，可以看我們的中文翻譯版本入門教程中文翻譯版。如果模板文件中有如下代碼那么渲染時就會循環(huán)渲染篇文章，并且也會被存儲在數(shù)據(jù)庫中文章的標(biāo)題取代。 本教程內(nèi)容已過時，更新版教程請訪問： django 博客開發(fā)入門教程。 本節(jié)是 Django Blog 項目的開篇，是?Django 學(xué)習(xí)小組的集體學(xué)習(xí)成果。Django...
摘要：一些表單界面元素文本框或復(fù)選框非常簡單并內(nèi)置在中，而其他會復(fù)雜些像彈出日期選擇等操作控件。和標(biāo)簽中的屬性指定了當(dāng)前文本框提交的數(shù)據(jù)的名稱，它必須與表單類中的字段名稱對應(yīng)，否則服務(wù)器無法將字段和數(shù)據(jù)正確的對應(yīng)起來。 前面我們已經(jīng)學(xué)會如何用Markdown語法書寫文章了。 但是還有問題呀。之前寫文章都是在后臺中進(jìn)行的，萬一有別的普通用戶也要發(fā)表文章怎么辦？萬一我想拓展些后臺中沒有的提交驗證...
閱讀 3600·2021-10-15 09:43
閱讀 3515·2021-09-02 15:21
閱讀 2229·2021-08-11 11:23
閱讀 3264·2019-08-30 15:54
閱讀 1959·2019-08-30 13:54
閱讀 3229·2019-08-29 18:35
閱讀 699·2019-08-29 16:58
閱讀 1783·2019-08-29 12:49
