推荐使用Wagtail Code Block: 动态代码高亮的Wagtail扩展
Wagtail Code Block 是一个专为Wagtail CMS设计的源代码高亮显示块,它在后台编辑器和前端页面都提供了实时代码高亮功能,并支持行号显示和PrismJS主题。借助这个工具,你可以让网站的代码展示变得更加专业和易读。
项目简介
Wagtail Code Block 使用PrismJS库,提供了一种简单的方法,在你的Wagtail站点中插入和管理语法高亮的代码片段。无论是前端还是后台编辑界面,都能提供流畅的体验,同时还支持自定义语言设置和主题。
技术剖析
该项目利用了PrismJS的强大功能,允许在后台编辑器中实时预览代码高亮效果。用户可以通过CodeBlock
类来创建新的代码块,指定默认的语言或强制使用特定语言。在Django配置中,你可以定制行号显示、复制到剪贴板功能以及选择你喜欢的PrismJS主题。
应用场景
- 在博客文章中优雅地展示编程示例。
- 在教程或文档网站中,方便读者理解和学习代码。
- 任何需要显示代码的地方,如API文档或开发者资源页。
项目特点
- 实时高亮 - 编辑器中即时显示高亮的代码段,提升编辑体验。
- 多样化语言支持 - 支持多种编程语言,满足不同类型的代码展示需求。
- 可配置性 - 可以根据需要调整行号显示、复制功能和主题风格。
- 易集成 - 简单几步就能将Wagtail Code Block整合进你的现有Wagtail项目。
以下是一个简单的使用示例:
from wagtailcodeblock.blocks import CodeBlock
class HomePage(Page):
body = StreamField([
("code", CodeBlock(label='Code')),
])
安装与设置: 使用pip
即可轻松安装,然后将其添加到INSTALLED_APPS
设置中,并根据需求进行其他配置。
总的来说,Wagtail Code Block是提升Wagtail站点专业度的理想选择,尤其是对于那些希望展示高质量代码片段的开发者和内容创作者。立即尝试,让你的代码看起来更出色吧!