Tipask3.0程序代码高亮样式配置

因为代码高亮主要针对于技术社区,所以就不直接集成到程序中了。有这种需求的可以按照此文档进行扩展。

本次教程用的是 highlight.js来实现的代码高亮。highlight.js支持很多编程语言例如PHP、Java等等同时也有很多主题 想进一步了解请点击  https://highlightjs.org/static/demo

整体配置步骤其实比较简单,步骤如下:

1、引入主题样式文件

2、引入highlight.js和对于的语言js

3、通过选择器调用highlight.js进行代码渲染。

整体配置方式通过tipask后台站点设置,页面头部扩展和底部扩展即可完成。

以PHP代码高亮为例:

1、去百度cdn找到highlight.js的资源

attachments-2016-07-HdoMhVV057848e0dea10

2、点击highlight.js,复制主题样式文件,粘贴到tipask后台页面头部扩展;复制highlight.js的js文件和PHP代码js文件粘贴到tipask后台页面底部扩展。attachments-2016-07-4KQgMRdQ57848e920a38

后台配置截图:

attachments-2016-07-Ajwl0XKJ57848f45e343

3、找到需要高亮的标签进行代码高亮处理:




好了,将上面的代码放到刚刚添加的js文件下面即可,代码高亮就配置完成了。


通过Tipask3.0编辑器插入代码片段:

attachments-2016-07-QeP7JvHS5784908606f7

点击pre标签即可。

  • 发表于 2016-07-12 14:35
  • 阅读 ( 1575 )

4 条评论

请先 登录 后评论
sdf_sky
sdf_sky

Tipask官方技术支持

31 篇文章

作家榜 »

  1. sdf_sky 31 文章
  2. 福泽天下 17 文章
  3. 李询金 14 文章
  4. 袁益丰 10 文章
  5. shaoye001 8 文章
  6. 冯光朴 6 文章
  7. 张子豪 5 文章
  8. 新会TV 5 文章