這篇文章主要介紹了關于wordpress使用markdown時采用prism進行代碼高亮 ,有著一定的參考價值,現在分享給大家,有需要的朋友可以參考一下
背景:最近將博客的文章編輯器切換為markdown了,但是發現wordpress主題自帶的css無法實現代碼高亮,作為強迫癥看著非常不舒服,遂想盡方法實現在markdown中實現代碼高亮。
1.使用markdown編輯器 首先,你需要將wordpress自帶的文章編輯器切換為markdown,這里需要安裝markdown插件,幾經對比,選擇了WP Editor.md插件,一款可以實時預覽的markdown編輯器,具體有哪些優點可以詳細閱讀插件說明。
插件截圖:
最主要的是該插件代碼高亮就是使用的prism,所以在編輯階段的代碼會自動使用prism的語法,不需要額外設置。不信你可以查看你文章的html源碼,會有下面的語法:
pre >
代碼高亮選項的開關在插件的設置,“語法高亮選項-支持Prism語法高亮”中開啟。
2.去prism網址下載自己專屬的css和js文件下載地址:http://prismjs.com/download.htm 選擇你常用的語言和配置,點擊DOWNLOAD JS和DOWNLOAD CSS下載css和js文件,也就是prism.js和prism.css文件。
3.修改wordpress主題進入主題對應的文件夾,創建prism文件夾,將prism.js和prism.css文件放入該文件夾
修改funcations.php文件,其中的自定義路徑就是prism.js和prism.css文件的存放路徑
function add_prism() { wp_register_style( prismCSS , get_stylesheet_directory_uri() . prism/prism.css //自定義路徑wp_register_script( prismJS , get_stylesheet_directory_uri() . prism/prism.js //自定義路徑wp_enqueue_style( prismCSS wp_enqueue_script( prismJS add_action( wp_enqueue_scripts , add_prism4.Enjoy
好了,這時候你再刷新你的文章,你就會發現已經實現代碼高亮了,就是這么簡單!
以上就是本文的全部內容,希望對大家的學習有所幫助,更多相關內容請關注PHP !
相關推薦:
WordPress 之在注冊界面 實現 注冊后密碼直接顯示在頁面上
使用PHPstudy在Windows服務器下部署PHP系統
以上就是如何在wordpress中使用markdown時采用prism將代碼調亮的詳細內容,PHP教程
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。
新聞熱點
疑難解答
圖片精選