%title缩略图

WordPress代码高亮插件推荐

我们在写文章的时候,有时可能想分享一段代码或几句一行代码,在wordpress里,需要额外安装代码高亮插件才能达到需求,这里就来推荐几款比较不错的插件。

enlighter(优先推荐,站长正在使用)

wordpress官方插件页:Enlighter – Customizable Syntax Highlighter – WordPress 插件 | WordPress.org China 简体中文

 

%title插图%num

Enlighter is a free, easy-to-use, syntax highlighting tool for WordPress. Highlighting is powered by the EnlighterJS javascript library to provide a beautiful code-appearance.

Using it can be as simple as adding a new Enlighter Sourcecode block (Gutenberg) and insert the code which you want to highlight: Enlighter takes care of the rest!

An easy to use Theme-Customizer is included to modify the build-in themes without any css knowlegde!
It also supports the automatic creation of tab-panes to display code-groups together (useful for multi-language examples – e.g. html+css+js)

插件功能

  • Full Gutenberg Editor Integration
  • Full Classic Editor Integration (TinyMCE)
  • 支持所有常用开发语言
  • Powerful generic highlighting engine for unknown languages
  • Theme Customizer
  • Inline Syntax Highlighting
  • Advanced configuration options are available within the options page.
  • Supports code-groups (displays multiple code-blocks within a tab-pane)
  • Extensible language and theme engines – add your own one.
  • Simple CSS based themes
  • Integrated CSS file caching (suitable for high traffic sites)
  • Full GDPR compliant – no external resources are required, no data will be aggregated

GUTENBERG EDITOR INTEGRATION

  • Full Editor Integration via “Enlighter Sourcecode” block
  • Inline Syntax Highlighting
  • Automatic transformations for classic editor posts (codeblocks converted to Enlighter Sourcecode block)
  • Transform legacy codeblocks to Enlighter Gutenberg Blocks (manual transformation)
  • Docs and Usage
  • Editor plugin repository

CLASSIC EDITOR (TINYMCE) INTEGRATION

MARKDOWN

  • Markdown fenced code blocks
  • Inline Syntax Highlighting via backtick code (including language specific addon)
  • Docs and Usage

COMPATIBILITY/MIGRATION

  • Crayon compatibility mode (use EnlighterJS highlighting for legacy Crayon codeblocks)pre
  • CodeColorer compatibility mode (use EnlighterJS highlighting for legacy CodeColorer shortcodes)
  • Jetpack markdown compatibility mode (generic or raw highlighting)
  • Gutenberg standard codeblock compatibility mode (no language attributes)

EXTENSIONS

  • bbPress shortcode + markdown code blocks support
  • Dynamic Content via jQuery Ajax.load
  • Dynamic Content via Jetpack.InfiniteScroll

TEXTEDITOR/SHORTCODES (LEGACY)

Shortcodes are deprecated and should be used in text editor mode only – never use them within Gutenberg Editor or Classic Editor!

  • Easy to use Text-Editor mode through the use of Shortcodes and QuickTags
  • Shortcodes within content, comments and widgets
  • Standalone Shortcode-Processor to avoid wpautop filter issues in Text-Editor Mode

SUPPORTED LANGUAGES (BUILD-IN)

In case your language is not available try the Generic Mode which covers a lot of programming languages – or request a new language on GitHub

相关链接

兼容性

All modern webbrowsers with enabled Javascript and HTML5 capabilities for “data-” attributes are compatible with Enlighter. It’s possible that it may work with earlier/other browsers.

  • Chrome 60+
  • Firefox 60+
  • Safari 11+
  • Edge Browser 10+

 

syntaxhighlighter

wordpress官方插件页:SyntaxHighlighter Evolved – WordPress plugin | WordPress.org

 

%title插图%num

Description

Now with support for the new block editor in WordPress 5.0!

SyntaxHighlighter Evolved allows you to easily post syntax-highlighted code to your site without losing its formatting or making any manual changes. It uses the SyntaxHighlighter JavaScript package by Alex Gorbatchev.

For a live demo, see this plugin’s homepage.

For a list of supported languages (most widely used languages are supported), see the WordPress.com support document.

Development of this plugin is on GitHub.
Translation of the plugin into different languages is on the translation page.

As seen on WordPress.com.

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

13 + 15 =

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据