WordPress|怎样在文章中插入代码

作为技术博客,自然会有在文章中插入代码的需要。但有时你会发觉你插入的代码并不能如预期般显示,你可以试试这个:

<p>Paragraphy</p>

这是因为WordPress本身是由PHP、HTML、CSS、JS等程序代码实现,直接插入代码很有可能会被作为代码解释,或者因为安全机制而被过滤。

WordPress官网文档Writing Code in Your Posts对此做了详尽的解释,接下来谈谈我的看法。

HTML Entities

比如尖括号<> 出现在文章内容中,就有可能被WordPress认为是代码标签,这些符号就是HTML Entities。解决问题的方法是使用转义字符,比如用&lt;&gt;来代替<>

解决方案:使用代码格式化插件

比如SyntaxHighlighter Evolved一类的代码格式化插件。除了能让你插入代码,还能帮你美化代码格式。

缺点:如果插件不再更新,那么之前使用插件显示的代码就会有麻烦。

解决方案:使用外部服务

把代码片段保存在如GitHub:GistPasteBin之类的平台上,然后将代码片段嵌入WordPress。

缺点:依赖于服务的稳定,如果需要插入的代码比较零散,那么两边频繁切换会很麻烦。

解决方案:使用编辑器插件实现字符转义

安装编辑器插件如CKEditor或TinyMCE,会发现当你在编辑器中输入代码时,编辑器会帮助你自动完成字符转义。

这是我选择的方案,优点是编辑器仅作转义,转义完成后代码的显示不依赖于其它插件或服务,缺点是没有附带的代码美化功能,根据编程语言实现关键字高亮这样的福利是没有的。

<pre>和<code>标签

<pre>标签内的内容以等宽字体显示,并且其中的空格和换行符会被保留。把代码片段粘贴进<pre>标签内会很方便。

<code>标签表示标签内的内容是一段代码,<code>标签目前没有特别的作用,但之后可能会增加更丰富的CSS效果,因此把代码放入<code>标签也算是未雨绸缪。

Leave a Reply