Ghost本地安装highlight.js使代码高亮
对于程序猿写博客来说,这代码高亮是起码的要求。可是Ghost本身没有支持高亮代码。
可是能够通过扩展来实现,它就是highlight.js——附官方站点,看了下首页介绍,真的非常强大,如今说说怎么进行安装,非常easy。
下载highlight.js
本来已经包括了非常多支持的高亮语言,假设上面没找到你要的语言,能够在以下继续 勾选。最后点击下方的下载。
解压安装highlight.js
解压highlight.js到Ghost本地的主题目录以下的资源目录。我这里是:
安装highlight.js
用文本编辑器打开theme目录下的default.hbs文件进行编辑:
找到{{! Styles’n’Scripts }},在以下加入:
<link rel="stylesheet" type="text/css" href="{{asset "/highlight/styles/hybrid.css"}}" />
这里的hybrid.css是你想用的代码主题。这里我用的hybrid.css,,个人喜好。还能够选择styles目录下的其他主题样式。你能够到这个站点预览各种风格的代码主题,选择自己喜欢的。
找到{{! The main JavaScript file for Casper }},在以下加入:
<script type="text/javascript" src="{{asset "/highlight/highlight.pack.js"}}"></script>
<script type="text/javascript">hljs.initHighlightingOnLoad();</script>
怎样使用代码高亮
用Ghost自带的markdown编辑器时。依照例如以下格式:
<pre><code class="python">...</code></pre>
python能够换成其他的语言。
Ok。如今能够体验代码高亮的感觉了!效果例如以下,这是一段python代码:
Ghost本地安装highlight.js使代码高亮的更多相关文章
- highlight.js 页面 代码高亮
官网:https://highlightjs.org/ 功能: 支持 155 种编程语言的语法解析:拥有 73 种样式 自动检测编程语言 可以在 node.js 平台上运行 支持各种标签 与任何 js ...
- 测试使用highlight.js的代码效果
---恢复内容开始--- C#代码 private void NextDateUpdate(DateTime dtt) { dtt.AddDays(); Response.Write("dt ...
- IDEA中使用插件添加更多可选择的主题,使代码高亮,缓解视觉疲劳
1.点击 File-->settings(或Ctrl+Shift+S)打开IDE设置面板 点击plugins-->右侧选择Marketplace-->搜索框中输入Material-- ...
- 本地安装node.js模块
一.需求 单位电脑不让上网,但是需要用到一个node.js模块,elasticdump. 二.解决 1.自己电脑上下载模块: npm install elasticdump -g 注意:必须要加 -g ...
- 使用 Google Code Prettify 实现代码高亮
今天这篇文章主要讲述使用 google-code-prettify 来实现代码的高亮显示,以前我使用 highlight.js 来实现文章中代码的高亮显示. prettify 非常小巧且配置简单,使用 ...
- SyntaxHighlighter 代码高亮极简单配置
页首Html代码: <!--<link type="text/css" rel="stylesheet" href="https://bl ...
- 【highlight.js】页面代码高亮插件
[highlight.js] 很多博客都支持页面插入各种语言的代码,而这些代码肯定是有高亮设置的.那么在我们自己的页面上如何进行代码高亮设置?有现成的这个highlight.js插件我们可以使用. h ...
- 用 highlight.js 为文章中的代码添加语法高亮
来源:http://www.ghostchina.com/adding-syntax-highlighting-to-ghost-using-highlight-js/ --------------- ...
- highlight.js 代码高亮插件的使用
在网页使用过程中,经常会用到代码的展示.而不同颜色的代码,可以让代码看起来更直观,也更美观. 找了几个不同的插件,觉得highlight的插件比较实用,而且用起来炒鸡简单. 比如这样: 首先,我们先下 ...
随机推荐
- pytorch导入错误so: undefined symbol: _Z11libshm_initPKc
首先删除torch文件 或者直接卸载 删除会更彻底 https://blog.csdn.net/qq_37674858/article/details/88870124 但是会发现卸载重装pytorc ...
- Django ORM (一) 创建数据库和模型常用的字段类型参数及Field 重要参数介绍
创建一个 Django 项目及应用 django-admin startproject orm cd orm python manage.py startapp app01 在 models.py 上 ...
- 我的Python分析成长之路4
一.函数 1.什么是函数?:函数是带名字的代码块,调用函数,只要调用函数名就可以. 2.函数的性质:1.减少重复代码 2.使程序变得可扩展 3.使程序变得易维护 3.编程范示: 1.面向对象编程 ...
- Python9-文件操作-day8
# 1.文件路径:d:\xxx.txt# 绝对路径:从根目录开始# 想对路径:当前文件下# 2.编码方式:utf-8/gbk...# 3.操作方式:只读.只写.追加.读写.写读..... f=open ...
- cocos2d中的anchorPoint属性详解
原文地址:http://www.tuicool.com/articles/ANVjMj 1> anchorPoint对position的影响 anchorPoint的作用就是相当于确定在子节点的 ...
- 爬虫开发python工具包介绍 (4)
本文来自网易云社区 作者:王涛 此处我们给出几个常用的代码例子,包括get,post(json,表单),带证书访问:Get 请求 @gen.coroutine def fetch_url(): ...
- 七、docker基本命令
Docker 基本命令 docker的基本命令 docker version :查看docker的版本号,包括客户端.服务端.依赖的Go等 [root@centos7 ~]# docker versi ...
- 九度oj 题目1533:最长上升子序列
题目描述: 给定一个整型数组, 求这个数组的最长严格递增子序列的长度. 譬如序列1 2 2 4 3 的最长严格递增子序列为1,2,4或1,2,3.他们的长度为3. 输入: 输入可能包含多个测试案例. ...
- CSS相对布局和绝对布局
relative 相对布局,正常的,从上到下.绝对布局absolute,就像不占位置,透明了一样,会和别的重合
- CocoaAsyncSocket一个第三方Socket库
github地址:https://github.com/robbiehanson/CocoaAsyncSocket github上的不完整,cocochina也有demohttp://code4app ...