对于ylion 更换代码主题的小疑惑

[bingshuang2014]

### highlight{@highlightStyle:[github,solarized-light]}
### 内置两款代码主题
#highlightStyle: github

我想使用 highlight 的 monokai-sublime

我把 ↓ ↓ ↓ 这些代码 放入了layout.ejs 文件中 但是没反应 那里错了

<link rel="stylesheet"
      href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.12.0/build/styles/monokai-sublime.min.css">
<script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.12.0/build/highlight.min.js"></script>
<script >hljs.initHighlightingOnLoad();</script> 

[GeekaholicLin]

你可以尝试以下操作：

1. 下载你需要的主题css文件，并放置在github.css所在的目录下（也就是ylion/source/css/thirdParty/highlight 文件夹），需要命名，比如命名为monokai-sublime.css
2. 修改主题的config配置文件，把highLightStyle改为你下载的css文件名，比如说monokai-sublime

还有一个需要注意的地方是，每次升级主题的时候需要备份好自己自定义的部分（比如自定义的css文件和config配置文件），否则会导致覆盖。

希望能够帮助你~

[bingshuang2014]

试了下 发现 修改 highLightStyle: 这个选项的内容 原装的2个主题可以应用

而我放在ylion/source/css/thirdParty/highlight 这里的css 不起作用

@GeekaholicLin

[GeekaholicLin]

orz，找到原因了。因为Hexo处理代码块的时候没有添加前缀，所以需要对下载的css样式文件进行一些处理。

1. 下载放置并命名
2. 去掉所有的hljs-，比如.hljs-tag会变成.tag（可以使用IDE的全局替换，方便）
3. 因为代码框样式的问题（比如这里的背景色会不同），需要对样式进行微调。在这里将所有的.hljs变成#post #post-body .highlight，然后添加

   .highlight:before{
   background: #23241F;
   border-top: none;
   }

4. 最终的样式为 monokai theme gist
5. 预览效果：

[bingshuang2014]

@GeekaholicLin 谢谢大神