Excellent software and practical tutorials
Many people like to record their used codes in their blogs, but as we all know, the code functions of WordPress itself are very simple, and even have no beautification effect, making it difficult to read. If you want to display beautiful code effects, you must install a suitableCode highlightingPlug-ins. Next, I will select a few of the best ones for you. WordPress Code Block Plugin
WordPress Code Enlighter Plugin
Compared to other plugins,EnlighterIt has a more concise style with modern design, uses small fonts and is very beautiful. It supports code block highlighting and inline code highlighting. Whether it is the front-end display or the back-end design, it is a very thoughtful design.
Enlighter is a very easy-to-use plugin. You only need to click on the input box, copy the code and save it. You can make beautiful code display without any additional settings. You can modify the code directly in the default TinyMCE editor of WordPress without opening the code box. Even if you are not familiar with the code, you can easily get started.
Enlighter has been adapted to the new version of WordPress Gutenberg editor, and provides a code module for it, which can be directly added
WordPress code plugin SyntaxHighlighter Evolved
SyntaxHighlighter EvolvedIt is a very simple plug-in. Its biggest feature is that it is easy to use. It does not add any extra elements to the editor. If you want to highlight the code, you only need to insert the short code of the corresponding language before and after the code. For example, to insert the PHP language, use the format of [php] code [/php]. Of course, you cannot adjust the style in this way. You can set a default style in the plug-in settings and apply it to all codes.
Code Prettify
It can be said to be the simplest code highlighting plug-in to use.Code PrettifyBased on the formatting of WordPress, a code highlighting style has been added. You only need to select the code and then choose pre-formatting. It will automatically sniff the language and add a highlighting effect to the code. This plug-in is very suitable for beginners or non-professionals. It does not have any settings, but it is very convenient to use.
In Gutenberg, Code Prettify also does not add more modules. You only need to set the block similar to code to use the code highlighting effect of the Code Prettify plugin.
WordPress code plugin Crayon Syntax Highlighter (not yet supported by Gutenberg)
Although it is not adapted to the new version of WordPress editor,Crayon Syntax Highlighter It is still the most comprehensive code highlighting plugin, built with PHP and Jquery. After installation, it will add a code button in the WordPress editor, where you can customize the code.
At the same time, you can also choose language, font, code format and other options, and you can choose your favorite theme, such as Monokai, Eclipse, etc., with dozens of built-in styles
A toolbar is also provided to allow visitors to control the display of the code by themselves, such as
- Code wrapping
- Extra long and wide display
- Code all selected function
- Hide row numbers
- Open the code in a new tab
If you don't like the toolbar, you can also set a default value for these options directly in the background, and then hide the toolbar to show the pure code.
In addition, remember that Crayon Syntax Highlighter must be used with the classic editor. WordPress uses the default classic editor method.
These are all excellent plug-ins, and all are free plug-ins. They can help us better record code, display code, read code, and improve code format.